School Project: Music site



Web Design & Development

2015 · Canada

Project Overview

This project was created for the training “Design and Ergonomic Principles for the Web” of the Collège de Maisonneuve. The objective was to design a site following the standards of usability and accessibility applicable in the industry.

Project Process

Research UX and Design

  • Analyze content, usability, and design of Official Musical Groups Websites.
  • Apply ergonomic principles learned in “Design and Ergonomic Principles for the Web”.


  • Conceptualize two pages and adapt the design to three screen sizes: large, medium and small. Use the 960 Grid System as a visual reference.
  • Use free images to create the identity of the site.


  • Integrate mock-ups into responsive HTML5 templates using media queries.



As a Graphic Designer, I designed the logo, created the main image, and icons for the project. Also, the other pictures have been edited in Photoshop to harmonize the presentation.


  • Create assets slicing the Mock-ups in Photoshop.
  • Templates built in HTML5 using media queries to adapt the content at the screen.
  • QA of the code.


  • Create responsive UX

Tools used



Adobe Suite