Side Launch Brewing Company

UX/UI

Vision & Scope

“Side Launch came to us with a vision in mind, they wanted us to revamp thier existing website to bring brand awareness. Together we decided to go with the nautical theme and to represent a very urban fisherman kind of style on their merchandise page to increase their sales. They also wanted to capture a greater market share through their social media, they wanted to make their website look and feel very fun and exciting, adventurous and explorative, yet simple and clean looking with less text and more visual representation. Some of the attributes we worked with were ‘work hard play hard’, ‘travel and imagination”, “nature and sailing.”

Design Approach

User Research

Surveyed potential users to understand beer consumption patterns and preferences.

Survey Insights

  • 80% like pairing food with their beer.

  • Brand, price and quality are important factors.

  • 68% drink craft beer because it tastes different than mainstream beer.

  • 57% were aware of Side Launch beer.

  • 93.8% had tried Side Launch beer before.

  • Familiarity with the brand seems primarily associated with their Wheat beer.

  • 67.9% were interested in visiting a local brewery.

  • 91.3% have never bought merchandise from beer companies.

Comparative / Competitive Analysis

Compared Side Launch to 9 existing brewing companies.

CC Analysis Takeaway

  • Content on these sites is very cluttered and unorganized.

  • Items are hard to find.

  • Text is confusing and not easy to read.

  • They used very dark and dull colours for their interface.

  • Found some great inspiration from Minhas Brewery and Big Rock Brewery.

Primary User Persona

Opportunity

"To tap into our audience's strong enthusiasm for experimentation, by exposing them more to Side Launch's diverse lineup of beers."

PLANNING

Story Board

We used a storyboard to help provide user context. The story begins with Kevin who wants to host a party but doesn’t know what type of refreshment or beer he wants to have at his party. He finally lands on the Side Launch website, goes to LCBO to purchase the beer that he likes or thinks his friends would enjoy, and then at last he has a blast with his friends at the party.

Customer Journey Map

The overall customer journey of the existing Side Launch website was mainly neutral, except when the users had to click back and forth between the different types of beer that was showcased on their website.

User Flow

DESIGNING / TESTING

V1 vs. V2 (Home page)

Changed content on the nav bar to create a better flow and information architecture.

Took out the shopping cart from the top right corner and switched it with their social media, because our testing indicated that it confused our users into thinking that they could actually buy beer off the website.

V1 vs. V2 (Beer Description)

Moved the location of the arrows to indicate that the users can skim through the different types of beer Side Launch offers, where as before the arrow buttons confused our users into thinking that they could skim through different sections of the website.t they could actually buy beer off the website.

V1 vs. V2 (Merchandise)

Took out the sub categories and moved the entire filter option to the left side so that there can be more space for the merchandise content.

Mood Board

Style Guide

Logo Redesign

Side Launch Logo GIF Design

Desktop Prototype

Mobile Prototype (iOS)

Summary

  • Introduced the entire Side Launch beer collection on one page.

  • Presented a glimpse of Side Launch’s merchandise catalogue on its homepage.

  • Organized the events page in list-view to avoid an empty state.

  • Integrated the website with Instagram to increase new followers and capture greater engagement.

  • Delivered a simple and clean looking interface.

  • Created a fun, exciting and adventurous customer journey.