Musicnotes is your one stop shop for sheet music. Browse through a catalog of over 300,000 arrangements, then view them online or in their apps. In my time with them I redesigned the iOS and Android app interfaces, modernizing them and improving their app store ratings. I also worked on a team that redesigned the musicnotes website.
The goals in redesigning the Android and iOS apps were to allow easier access to the functions that our customers used most, while also updating them to meet modern app styleguides.
Adding a recent songs section to the menu made jumping back in to where you left off easier. We also wanted to add in user requests, such as the ability to play and loop part of the piece, as well as a metronome feature.
I worked primarily in Sketch, as well as in Principle. I used Zeplin to share my mockups with developers.
When I started on the UX team, we were in the middle of updating, and more formalizing the company's style-guide. Musicnotes had had a styleguide previously, but it was hardly used and didn't suit the company's needs, nor reflect the voice we wanted the company to have going forward. We ended up cutting down the number of brand color down by half, as well as settling on a typeface that could be used across the site and all of our print media.
When we were thinking about the site redesign, we wanted to move away from a lot of the greys and greens we had previously been using, and focus on blue, since that was our primary brand color and it suited the brand well. This then freed us up to use green primarily on buttons as an eye-catching call to action. We also were able to remove some of the gradients and skeumorphism that the site had previously used and switch to more flat and rounded UI elements that reflected the roundness of our logo and projected a friendly yet professional feeling.
One of the biggest (and most fun) challenges was working on the redesign of the Musicnotes Android app. It hadn't been touched in a long time and needed a lot of love. It had a ton of interesting features, but they were all so hard to find and use that most of our customers didn't even know they were there.
Another unforseen challenge was that I had to work hard to get buy in from stakeholders for our app Android app to look different from our iOS app. Our apps shared a codebase and creating separate UI for each app would mean extra time and expense. However I argued that it would be worth it, since each platform comes with its own set of expectations for layout, design, color, typography, and types of interaction. Ultimately we were able to create a really unique design for Android that took the existing features and made them come alive in a much more usable and fun interface.