The Challenge

Survey

Comparative Analysis

Site Map

Style Guide

Mockups

Results

Challenge

Monaghan Music, LLC deserved a much-needed site overhaul. The site hadn't been touched in about 10 years and required some moderization.

Tools

Sketch, Bootstrap, HTML, CSS, JavaScript

The Original Site Design

The site's original layout consisted of three columns and two navigation bars (horizontal and vertical). Upon initial review, it was hard to know where to look to get to know more about Monaghan Music.

The challenge for me as designer and developer, was to come up with a new site that was not only better organized and more visually appealing but also coded in a way Bill could easily update content in the future.

As Bill and I discussed the site redesign, we realized we needed some feedback from his audience to find what content was most important to them.

We also wanted to know where his audience was buying music. This is important to know because Bill is selling his music online on various platforms. We wanted to be sure those platforms aligned with the preferences of his audience.

Survey Results

We concluded that the following were most important to the site:

• Most people wanted to know the latest about Monaghan Music events and upcoming concerts.
• Most people buy their music online via Amazon and iTunes.

While photos and videos did not score high on the survey, Bill still wanted to showcase his work via photos and videos from gigs and events over the years. This makes sense and is good for both his current and prospective audiences to see his music in action.

We took a look at the sites of some of the most prominent names in music to see what they were doing online.

I wanted to show Bill how musicians were organizing their content via their navigation. Also, he liked how both Billy Joel and Dave Matthews Band had a photo carousel at the top of their home pages showcasing themselves and their gigs.

We both liked how the Dave Matthews Band site prominently displayed its social media icons. This was important to Bill, as he is active on various social media outlets and wanted to be sure his audience had easy access to them.

Dave Matthews Band

Once we gathered the survey results and conducted the comparative analysis, I was able to put together an updated site map for Bill. It shows Sheet Music as its own entity in the navigation even though it is housed on the Store page. This was important to Bill, as most of his customers go to the store for the sheet music. He wanted to be sure they had a quick way to access his sheet music which consists of around 300 songs.

It was easy to come up with a color pallette, as I pulled colors from Monaghan Music's logo to keep a consistent look and feel.

Mockup - Home Page

The mockup was done in Sketch and shows a slightly different layout for the header than the final version. I initially wanted to keep the logo centered, but after working with the code, the header displayed better on smaller screens with the logo placed to the left. It also gave more room for all of the social media icons.

The redesign project for Monaghan Music, LLC was a success! I stayed on time and on budget with complete satisfaction from the client. Bill was so thrilled with the results that he included a bonus in his final payment to me for a job well done! He is also excited to continue our work together in the future to keep the site fresh with edits and enhancements as needed.
The finished redesign is at Monaghan Music!

Here is what some of the site now looks like. All the colors, fonts and structure Bill and I discussed and worked through are now a reality on the new site!

Home Page

Store

Sheet Music Section of the Store