Web Design

Desktop Webdesign for E-Commerce

CONTEXT
Built a personalized music artist website and created a direct-to-fan distribution channel for selling music and merchandise.

CHALLENGE
How might we increase brand awareness and sell merch?

SOLUTION
I utilized design methods including building a persona, sitemap, mid-fidelity wireframes, and a final visual design.

 
 

Statistics from Secondary Research

 
 
 

INTERVIEWS

I interviewed five random men and five random women to understand their online shopping experiences.
I recruited participants from Santa Monica College and shoppers at Amoeba Music record store in Hollywood, California.
The goal was to learn how participants discover new music, artists, and online shopping expectations, and frustrations.

 

Participant Demographics

 
 
 

User Interview Insights

 
 
 

Persona

User interviews help to build personas. After conducting user interviews, I extracted insights to identify user needs, goals, pain points, and behavior patterns. I examined analytics from the client's YouTube, Facebook, and Instagram accounts to understand the audience demographics. I synthesized these data points into a user persona to help create understanding and empathy with the end-user, allowing the design to reflect on the user needs and expectations of this project.

 
 
 
 
 

Sitemap

A sitemap represents web pages of the site and structures them to make sense to the user. A sitemap will allow you to create a website with a navigation flow that makes sense to the user and a search engine. I did an inventory of what content will be on the website and asked users to organize the information under meaningful labels users' would navigate to learn more. Organized top-level navigation labels are used to advertise website content.

 
 
 
 

Wireframe Prototype

Click the image to interact with the prototype

 
 

Tarelle Butts © 2018