top of page
Reckless Records:
An (Unsolicited) e-commerce Site Redesign
Reckless Records current website
Project Overview | Reckless Records is a well known record shop with a few locations in Chicago. They cater to the local music enthusiast and admirers alike, but their current website is difficult to navigate. This is a student project to redesign an ecommerce website to both benefit Reckless Records and their customers.
Timeline | 2 Weeks
UX Methods |
-
Interviews
-
Affinity Mapping
-
Personas and User Flows
-
Sketches, Wireframes, Prototype
-
Visual Design
Let's talk about music
Customer Care | I sat down and interviewed 5 vinyl record collectors. I focused the conversation on how they shopped for vinyl, where, and why. It was important for me to get an understanding of their shopping behaviors. Do they buy records online or in-store? What do they look for when buying a record? All these factors were important for the redesign of this site.
Interviewed 5 vinyl record collectors over Zoom
It's hard to find the small link that allows you to browse
.jpg)
Mapped out the commonalities
Once you find it the filter options are confusing
Testing | I put the original Reckless Records website in front of the users. I asked them to find a certain album by browsing. It took the users about 8 minutes to find the correct page. They just had to know that LP meant vinyl record. Not everyone did, which made it confusing to those users.
The Vinyl Connoisseur
Combining Trends | Even though these 5 people live all across the country, they had some strong similarities when it came to buying records. Most of them were more inclined to purchase records online, but through big box retailers. They prefer to support small businesses, but the websites tend to look untrustworthy.
The Problem:
"Brian needs a way to support his local record shop online so that he can feel better about buying records on the internet."
The Flow
.jpg)
User Flow | The task I was focusing on was the check out flow. I learned that my persona usually has two different ways of shopping for vinyl records. The first flow shows my persona already knows which record that they want, so they search for it. The second flow is when my persona is browsing around for a record to catch their eye.
Sketching + Wireframing
Previous Iterations| The original wireframes had the shopping cart as just text with the number of items in the cart. This was changed in the final prototype to a shopping cart icon based off of usability testing. The social media icons were also changed to different icons to look more refined.
Home Page | I wanted to make it obvious this was an e-commerce website. This way the users would feel more confident in making a purchase. Just like the in-store experience, I have featured albums displayed. Based off of my research, users like shopping in local record stores to get suggestions from the shop employees.
Product Page | The original site made it really difficult to browse the available records. Based off of my research, users also enjoy looking at all the album artwork. I designed the layout so the user can casually scroll through each genre. Making it easy and clear so the user can figure out what albums they would like to purchase.
Visual Design
Mood Board | I wanted to evoke the feeling of walking into a basement and being greeted by heavy riffs. Reckless Records keeps the grunge, punk spirit alive when you walk into their shops. I wanted their website to bring that same spirit.
Typography | I wanted the website's lettering to have a modern, but casual feel. I based it off the shops logo, which is a sans-serif.
Website Prototype
Go through the Prototype yourself!
Testing | I put my redesign in front of one of the users. It took them less than 30 seconds to complete a task. This was a huge improvement from the original 8 minutes to complete the same task on the current site.
Next Steps | I would like to conduct more usability tests, so I can make further iterations.
bottom of page