Who is it for Duration of Project Deliverables
School Project 5-6 weeks UX/UI Responsive Website
The Problem
How am I going to make a responsive website for a new music label?
To tackle this goal, I had to start doing research about the genre of music I selected for the label, as well as research 3 artists within that genre. Based off that genre I created a brand for the music label. Next, I would create an IA website layout plan, then work on figma and learn how to use autolayout, constraints, and other plugins to check the responsiveness of the website to other devices.
Research
What am I going to learn about the reggaeton music industry and the chosen artists?
Bad Bunny
Anuel AA
Jhayco
Picture Sources: Los Angeles Times, Celeb Secrets, & Latina
The chosen music genre would be reggaeton, an upbeat Latinx music style that has many subcategories within. The three reggaeton music artists I chose to represent for the label were Anuel AA, Bad Bunny, and Jhayco. I chose these artists based off personal preference because I enjoyed their music, but also because they are known artists to lead music charts and have a high popularity in the reggaeton music world.
Moodboard
The displayed moodboard included a collection of images that represented the style of music and visual identity for each of the three artists. Other visuals were included for the reggaeton genre itself as a way to compare the visual style and vibe of reggaeton to each artist. This moodboard and mind maps that were done for each subject helped influence the decision of the visual direction for the brand. The similarities between each subject were noted as significant keywords.
Brand
Lobo Records
'Lobo' means wolf in Spanish, which I chose to help convey a sense of belonging, leadership, and support such as a wolf pack within the music label. Spanish is the main language for reggaeton, which is why I wanted to use a Spanish word for the music label brand name. The font choice was selected to represent an earthy or muddy texture as wolves live in the wild such as in forests. This would be balanced with a clean and striking font for the word 'records' underneath. Brand colors were chosen based off the moodboards and what colors were similar for each artist's vibe.
Wireframes & Prototypes
What is going to be my approach to building the responsive music label website?
Overall View of Responsive Website Prototype
Results
How does the website respond to different devices?
Laptop Version
Phone Version
Tablet Version
The purpose of the website was to be a home base for the artists regarding new music, brief background and history, merch, and other information. With the website being able to be responsive to other devices, this would allow inclusivity and accessibility to users that have differing technology. Adding a Spanish language translation feature could help Spanish speakers navigate the website. Other visual elements of the website were added for interactivity and to convey the aesthetic of reggaeton artists and music.
Artist Landing Page
Spanish Toggle Button
Bad Bunny Page
Summary
Moving Forward
This brand could be furthered expanded on other media such as television and social media. The music label can include other reggaeton artists that represent the brand’s mission. There could also be more user testing in the field to test for accessibility and user experience.
