AboutContact

Rook Records
Redisign Responsive Website

In this project, I redesigned a website for rook records, an online record store for "music heads".
My main focus is to provide music lovers with automatic recommendations, but also to allow them to feel the personal connection between the seller and the buyer.

My role: UX Designers an UI
Limitation: 80 Hours
Tools: Figma, Photoshop

The Problem

Music lover and records digger spending a lot of time by searching of new records and to find music they never heard before.

The Solution

By redisigning the website and by creating a reccomendations funnel we want to help the user to find in easy way records they want to purchase, and help them to discover new music. The process comes to simulate the way collectors buy records in a record store and emphasizes the things that are important to them that we discovered in the study

Projects Objective

  • Design a responsive eCommerce website with a unique branding that will suit the target audience of the store
  • Create a recommendation system for the user to find the new and best records to purchase
  • Create a simple navigation system between albums, artists and genre  to help the user find new music

Design Process

Competitors Analysis

In order to understand the strength and weaknesses of the competitors, I conducted a small competitor analysis. It helps me to understand which features are more relevant and what should I include on the website. Furthermore, it gave me some ideas about how to characterize the site and differentiate it from the competition. Due to my desire to learn about how the current version of Rook Records works and how it can be improved, I considered this version of the website as a competitor

provisional personas

I created some personas with different purposes that may be relevant to the site

Users Interview

After analyzing competitors and creating a provisional persona, I conducted a user interview.

Participant
: I decided to conduct it with four interviews with different typecasting and shopping behavior.

Goal: To understand what is important to users when they buy records and how they behave in a record store
‍
I asked the following questions:‍

  • There is records you will never buy online? Why?
  • How do you choose which record to buy? (describe the process in physical shop and ecommerce store)
  • What made you buy the last records you purchased?
  • What makes you return and purchase more products from the store?
  • Can you tell about positive experienced when you have purchased records online?

Outcome

Although the cover is important, the music takes precedence
Even though some interviewees mentioned they like to pick records they don't know by their covers.  The preview song helped them to decide which album to purchase. At least 30 seconds from the song will help you make a decision.

Users want to know about the music they buy
Purchasing an album can be motivated by the information on it. It is important to give fun facts about the musician and the record, collaborations, producer, and more

Decisions are made by opinion leaders
Quote from a review by a radio host, opinion leader, or DJ can encourage people to purchase the album

Saving items for later is useful in record stores (Really helps, Not because it's standard on eCommerce sites)
Interviewees said they liked to save items and decided later what to buy. The item they did not buy due to budget constraints, they will purchase next time

Similar to physical stores, the styles and genres specialized are important
A store must have character, be specialized in a particular genre, and provide a pleasant shopping experience for its customers.
According to interviewees, the first impression they get of a record store influences their choices of what to look for.

Buyers enjoy communicating with sellers
The inability to communicate with a real person and get recommendations from a seller can hurt the buying experience. It is important to create an accurate system of recommendations that will enable music lovers to discover new music

Observation

To observe how records collectors behave when buying records, I spent two hours in two different record stores. In this observation, my main goal was to see what the process was from digging in the records to listening to them. How many records do they listen to before they purchase? How many times do they dig before they find something they want to buy.

  • A typical buyer takes 4-6 records to the listening station and does two rounds until they find what they want to purchase
  • On average, buyers listen to 30-45 seconds of each song
  • The listener will usually take the record if he listens to 3-4 songs and more
  • Listeners in the listening station next to each other like to glance and see what the other is hearing

DEFINE STAGE

Emphaty Map

I created the following map using data I gathered in the previous steps to understand how a user approaches buying records.

Task Flow and User Flow

This task flow shows how a user comes to the site and then goes through the recommendations funnel to get recommendations

After conducting the interviews I focused on one of the interviewees and built the user flow with a number of different scenarios. My goal was to put myself in the interviewer's shoes and see what would be going through his mind when he was making a purchase

DESIGN

Wireframes

The interview had the objective of understanding how users purchase records online or in-store and what factors influence their decision. Their answers help me to create the following funnel at the end of which users can receive recommendations for new music.

UI Design - Desktop and Mobile

TEST

Usability Test

Test objectives:

  • Test how users preferred to navigate, and how to found items to buy, when they want to discover new music
  • Test how users interact with the funnel. To make sure the user can easily complete the process, if the steps are clear to them, and which ones are more relevant
  • Test how users interact with the homepage during the first visit
  • To understand in which elements the users use and what is more important to them
  • Asses the overall impression and the experience of the website

Test goals:

  • Observe how users interact with the website
  • Understand what important for the user when they see records they never heard of
  • Understand how user behave in the funnel, the results page and album page
  • Identify error and area that cause pain

Affinity Map

With all the data and analyzing the results from the previous step, I built an affinity map that helped me understand the user's behavior and be ready to move on to iteration.

Iteration

Based on all the conclusions from the previous step and the usability test, I made a few changes