Redesign the user interface for an online store

Brief generated using: Briefz.Biz | Designed: August 2020

TL;DR

Redesigned the Gibson online store as part of a self-initiated design challenge during lockdown, using randomly generated briefs from Briefz.Biz. With no constraints or client input, I applied industry practices to create a polished concept that blended my design skills with a personal passion for music.

Background

Not long after relocating from Bournemouth, the global pandemic sent the world into a lockdown and my career would soon be put on hold. All of my scheduled interviews were cancelled. Companies were understandably hesitant on hiring new starters so at this time in my life, I was ultimately lost on what to do next. However, I didn't want to sit around and do nothing with my time. I began to work on side projects to keep my skills sharp whilst having fun at the same time.

One day, I stumbled across this awesome website known as Briefz.Biz. This website is a design brief generator supported and backed by an awesome community. With this website, you are able to generate random: Branding Design, Graphic Design, UI/UX Design, and Web Design briefs.

There are no limitations, no guidelines, no help decks, and no deadlines. These parameters are set by yourself. It puts the accountability on you to complete each brief (whilst letting your creativity run wild at the same time). The thing I love about this resource is that it allows you to put together a 'mock' project scope to emulate what it would be like in a live environment.

This project, along with Explore and SOLE, were randomly generated and I set myself 4-weeks to complete each brief.

Challenge

The main challenge that I faced with this brief, and the two mentioned above, is that I had to completely rely on the knowledge, skills and experience that have been gathered throughout the years and put them into practice. Though it was a challenge to do this, it truly allowed me to push the limits of my creativity and explore the boundaries of areas I'm not 100% familiar with.

Approach

The chosen online store that I attempted to redesign for was Gibson (famously known for their Gibson guitars).

Why did I choose this online store? During the lockdown, I was spending a couple of hours each day dusting the cobwebs off from my guitar playing skills. Fun fact: One of my idols and still is to this day, is Slash from Guns N' Roses! When I first saw and heard the magic that was being played on that Sunburst Gibson Les Paul guitar, it inspired me to one day play the guitar myself. I was self taught from age of 10/11 all the way until 18 - I even studied music in secondary school and was in a band.

At the time of this redesign, the Gibson website looked like this: Welcome to Gibson - archived from Wayback Machine.

Before going ahead and simply redesigning the Gibson online store, I adopted a similar approach that I've carried out on previous projects throughout the years. With this approach, I was able to maintain a level of consistency whilst adapting certain steps that are not available at this time, e.g. gather feedback on wireframes and carrying out rounds of testing to a live audience. You can see an examples of this throughout different projects on my portfolio.

Within the redesign, I covered the following areas of the online store:

Homepage
Product Page
Cart
Checkout
Mobile Responsiveness

Final Designs