Studio Bell

Bringing music to life

Background

In 2018 I worked with National Music Centre (NMC) to redesign the Studio Bell Website. Starting with a series of design sprints and workshops, I worked the NMC team to develop a digital strategy, initial sitemap, and content strategy before starting design on their new website.

Research
Results from a card sorting exercise

Results from a card sorting exercise

UX Workshops

Before starting the design process, I conducted two half day workshops with the NMC team.

The first workshop focused on identifying the goals of the NMC organization, the users who would be visiting the website, and to ideate on how we can bring those two things together.

The second workshop was a design ideation session, where we completed a crazy 8 and paper prototype sessions to to help identify the design direction of the final website.

An example heat map from HotJar

An example heat map from HotJar

Analytics + User Survey

After understanding what NMC wanted with their website, I started digging into what their users wanted. I did this by installing software from HotJar onto their website.

This allowed me to analyze overall traffic, heat maps of interactions, and recordings of user sessions. I was also able to have a survey popup for users, asking them if they found what they were looking for – and if not – what information they were trying to find.

This data gave me a deep understanding of how users interacted the website, and how we should approach the new design going forward.

Strategy

Digital Strategy

After using all of the research gathered through analytics and our workshops, I created a full digital strategy for the NMC/Studio Bell team. The strategy included:

  • Research results

  • User personas

  • High value user scenarios

  • Key UX and design recommendations

  • Suggested sitemap

  • Design wireframes

This document outlined everything needed to design and build the new website, and even included future recommendations for the NMC team to take into consideration.

*I can't show the full digital strategy online. Please contact me if you'd like to see it.

Examples of the wireframes included in the digital strategy

Examples of the wireframes included in the digital strategy

Design

Putting it all togther

Using my research and strategy as a guide, the new Studio Bell website was born. A strong focus was put on increasing revenue – both through ticketing and donations – so a large portion of the website was designed around concerts and events.

I also wanted to make sure that potential visitors could find information quickly and easily. Things such as hours of operation, cost of entry, and a map of Studio Bell itself were hidden on the previous website, so I brought it front and centre with this new design.

The Studio Bell website has been a huge succes and is still in operation today. I'm ecstatic to have helped this historic venue bring music to life online.