Digital Objects Repository Website
UI INTERACTION DESIGN FRONT-END

About

Digital repository website containing several educational resources such as images, videos and PDFs that are used in Senac courses and which will be available for teachers to use in presencial classes.

My Role

In this project, the visual identity of the whole project such as colors, fonts, icons, logo, navigation bar, top banner, visual assets, aside menu, content area, cards of resources in the content area and footer was conceived by a colleague of mine. Using the style guide defined, I worked on the UI design and front-end implementation for desktop, tablet and mobile of the:

  • Login page;
  • Home page (Recent resources);
  • Details page (Image, Video, PDF);
  • Search feature (Resource not found page, Search options menu);
  • User area in the top navigation bar.

The back-end (Angular, PHP) was made by a developer colleague. In this project I also collaborated working on the Information Architecture and User Flows. The project involved the Design Team, Instructional Design Team and Development Team.

Technologies


HTML, CSS, Bootstrap, Angular, PHP, MySQL.

Tools


  • Adobe Illustrator
  • Figma
  • Brackets

Login

...

Recent resources

...

Details page

Image resource
...
Video resource
...
PDF resource
...

Search feature

Resource not found page
...
Search options menu
...