Blue Recorders

Overview

Blue Recorders, private artist centric studio, had some inconsistency issues that on their website.

My Role

Reached out as a freelancer, I was their UX/UI designer and coder. They had brought up some issues that they had with their website, while asking me to seek out other problems as well.

Programs

HTML
CSS
Squarespace

Problems

These are some of the UX problems that we identified with their original website, in addition to content that they wanted to include:

No back tab when you get to the Mastering site (link it) for both West and East locations.
No information about the music that they have worked on on the Mastering page).
They wanted to add a newsletter tab under the About.
Missing members on their team section.
Mobile menu was inconsistent as it was duplicating/missing some tabs that were found on the desktop version.

Solution

Problem #1: No back tab when you get to the Mastering site (link it) for both West and East locations.

Solution #1: Added "Back to West" and "Back to South" tab.

Problem #1

Solution #1

Problem #2: No information about the music that they have worked on on the Mastering page).

Solution #2: Showed album information when user hovers over the album artwork (test here).

Problem #2

Solution #2

Problem #3: They wanted to add a newsletter tab under the About.

Solution #3: Added a "Newsletter" sub navigation under "About" tab (test here).

Problem #3

Solution #3

Problem #4: Missing a member on their team section.

Solution #4: Added the missing member and biography, while reorganizing the layout (test here).

Problem #4

Solution #4

Problem #5: Mobile menu was inconsistent as it was duplicating/missing some tabs that were found on the desktop version.

Solution #5: Fixed the mobile menu to reflect the same as desktop version (test here using mobile device or function).

Problem #5

Solution #5

Final

The finished website can be found here: https://www.bluerecorders.com/.

Takeaways

This was a great project that allowed me to brush up on my coding skills, while being able to bring in my design expertise. I got to learn much more throughout the processs since I was able to work with both website and mobile view when most of my other projects only dealt with one or the other. It reminded me to keep users in mind since their users are going onto the website on different devices.