VYNL
VYNL’s current website is difficult to navigate and lacks transparency about its products & services. New and returning members have found it challenging to understand how to select an album for their upcoming subscription order.
2022
UI/UX
Mobile Site Redesign
Solution
We implemented solutions focused on improving the site’s navigation and information architecture. This included restructuring the site's content to provide clarity and transparency to VYNL’s products and services.
Our goal was to make our membership plans more attractive and increase our retention rates. To achieve this, we revamped our plans with detailed information and made the process of filling out music profiles engaging for users. We also added Spotify features that allow users to listen to a sample of a record before adding it to their order.
The Challenge
VYNL is a growing company looking to enhance its membership appeal, simplify its products and services, and streamline its record curation process.
Some users may find VYNL's website difficult to navigate, which can lead to confusion about their membership and record curation services. This may cause new and returning members to require assistance in selecting an album for their monthly subscription order.
Product Description and Goals
VYNL aims to help music lovers discover exclusive vinyl explicitly curated to their musical tastes. To tailor the curation process to your tastes, members can sign in and connect their favorite music streaming platforms, including Spotify, Soundcloud, etc. Members will create a music profile where they can tell our curators their favorite artists, genres, and exclusive vinyl they’re looking for, as well as vinyl that they don’t want. Doing so helps our curators hand-select records for next month’s shipment.
High-Level Goals
Bring clarity and detail to VYNL’s membership plans and how they work.
Reinforce the brand’s Unique Selling Proposition of providing members with curated records based on their music profile.
Enhance member experience and re-designing music profile.
Project Outline
Discover
Research Process
Heuristic Evaluation
Competitive Analysis
User Survey
User Interview
Site Analysis
Discover
Objective
Gain insights into the user's experience with VYNL's current website.
Explore the different membership and subscription options VYNL's competitors offer.
Discover users' experiences and obstacles when using subscription plans.
Research Process
Methods
Heuristic Evaluation
Competitive Analysis
User Survey
User Interview
Usability Testing
To conduct thorough research, it was essential to acquaint ourselves with VYNL's range of products and services. Our team aimed to gain an in-depth comprehension of VYNL's daily operations while identifying opportunities to enhance their services and establish credibility for the brand. Throughout our research, we remained mindful of VYNL's objectives - to simplify their membership plans, boost membership interest, and improve the record curation process by identifying user pain points and needs.
Process
To start our research, we carefully reviewed the content, products, and services provided by VYNL. Through a heuristic evaluation of their website, we identified inconsistencies, pain points, and areas for improvement.
Heuristic Evaluation
Key Insights
Trouble navigating the site and encountered broken links.
Incorporating Spotify and other music streaming services is beneficial for curating records for subscription-based memberships.
The language and terms used must be more consistent and clear.
Process
After understanding VYNL's services comprehensively, we thoroughly compared the company with its competitors. We identified areas where VYNL was performing exceptionally well, such as its seamless integration with Spotify and other music platforms, while identifying areas where it could improve.
We analyzed VYNL's services and compared them to 6 competitors with a background in subscription plans, music streaming integration, and limited edition finds. We identified the top 4 competitors based on their strengths, weaknesses, and services.
Competitive Analysis
Key Insights
Competitors offer detailed subscription plans and record selection process.
Emphasis on exclusive records.
Opportunity to grow Spotify integration and taste-making capabilities.
User Survey
Background
Key Insights
Process
Our aim for conducting the user survey was to gain insight into how vinyl enthusiasts expand their collections. We distributed a survey that focused on vinyl ownership, monthly subscription plans, and the experience of shopping for vinyl records.
13 Vinyl Enthusiasts
User Interview
Background
Key Insights
Process
Through user interviews, we gained valuable insights into the habits of avid vinyl collectors. Our interviews explored users’ music discovery methods and the factors that impact their vinyl purchases, views on vinyl subscription services, and must-have features for record shopping.
6 Vinyl Enthusiasts
Existing Site Analysis
Store
Users wanted the option to easily filter their searches by artist, genre, and exclusive records.
Process
VYNL is committed to providing transparency in its membership plans and curation process. To ensure this, a usability test assessed how users navigate our site and receive feedback on their selection and enrollment in a membership plan. Our team designed a test centered on users' comprehension of VYNL's products, creating a music profile, and their checkout experience.
Background
6 Vinyl enthusiasts
Music Profile
Users appreciated the ability to connect their music streaming accounts.
Excessive number of input text fields is causing survey fatigue.
Users expected more diversity in genres and sub-genres listed in the music profile.
Broken Links / Friction
Users encountered negative friction points with pop-up windows and two broken links.
Homepage
Users found it difficult to understand how membership plans work.
Users were confused by the language and terminology used throughout the site: vibes, bin diving, etc.
Develop
Persona
After completing our initial research, we created a persona to help us with our design journey. Our goal was to come up with solutions that would enhance the overall album selection experience for both new and returning members, while also addressing specific pain points that users may encounter.
User Journey
Through the usability testing carried out on VYNL's website, we were able to gain valuable insights into the pain points that users encountered while navigating the site. Our team created a journey map that illustrates the specific areas where participants faced challenges and frustration while trying to sign up for a membership plan.
Goals
To discover a one-stop-shop to shop exclusive records of their favorite artists and grow their vinyl collection.
Needs
An easy way to find exclusive records.
Pain points on VYNL’s Site
Broken links in the main navigation lead to dead ends.
Membership plans lack comprehensive information about what they include and how they operate.
Creating a Music Profile caused fatigue due to the number of input text fields.
Difficulty selecting records to be included in membership shipment
Poor customer service.
The Problem
Corey has difficulty finding and shopping for exclusive vinyl to add to their growing collection. VNYL offers exclusive vinyl through their online store and subscription service, spreading the joy of owning and playing vinyl. However, VYNL currently has a subscription service that only a few people use because the site is hard to navigate.
How might we make it easier to shop for exclusive vinyls?
Ideating Solutions
With a clearly defined problem and business goals, our team brainstormed solutions to enhance the user experience on the site. We focused on improving the record selection process and navigation for VYNL members. Through collaboration, we reframed our insights into opportunities for innovation and aimed to create a user-friendly interface that enhances their experience.
How might we increase appeal in signing up for and maintaining a monthly vinyl subscription?
Updating the Sitemap
Participants from the usability testing unanimously agreed that poor navigation and negative friction impacted their confidence and trust in VYNL’s products and services. This feedback influenced our decision to begin our redesign with the sitemap to create a stronger foundation for information and content on VYNL’s site.
Update 1
Removed broken links from the primary navigation
Update 2
Relocated FAQ to the main menu for easier access
Update 3
Introduced search filter capabilities to the Store page
Final Sitemap
Creating a Music Profile
Process
Our approach was to prioritize developing a user's music profile rather than rushing to purchase a membership plan. This helped instill confidence in VYNL's curation abilities and establish trust with our users.
Membership Plan
Process
Once users have created their music profile, they are presented with four distinct membership options to select from.
Goals
Assist users in selecting a monthly essential record to add to their upcoming shipment
Goals
Reduce fatigue when creating a music profile by minimizing text fields.
Design
Style Guide
VYNL had an existing brand identity, but its style guidelines did not meet accessibility standards. Our heuristic evaluation revealed that the brand's design included colors that failed our color contrast tests, making the content less legible. Our task was to enhance the brand colors and style guidelines to improve accessibility.
Tone and Voice
Process
Our aim was to establish a tone and voice guide that would provide clear and consistent terminology on VYNL's website. There were challenges for users in comprehending the meaning of "vibes" and its relevance to VYNL's membership options and record selection.
Updated Terminology
Updated the term ‘vibes’ to ‘records.’
Emphasize exclusive records.
Typography
Typography
Noto Sans is a san serif font used for headers and body text.
Utilize font size and weight to differentiate content sections effectively.
Content Spacing Guide
The purpose of the content spacing guide is to enhance the readability and accessibility of different content available on VYNL's website.
Color Pallet
Primary Brand Color
Razzmatazz is the primary brand color.
Accent Brand Color
French Blue is the accent color.
Previous Colors - Fail
Updated Colors - Pass
Developing Essential Records
Process
Our team integrated the Spotify music feature to simplify shopping for exclusive vinyl, allowing users to play a sample of a record they're interested in adding to their monthly shipment or purchase through the online store. We chose to go with design 3 for the mid-fi design.
Vinyl Card Content
Record name
Artist name
Album art
Tracklist
Tap to play feature
Add to favorites
Membership Card Content
Name of membership plan
Price
Number of records each month
Member store access
Billing cycle
Get Started - CTA
Developing Membership Plans
Process
VYNL offers 4 different membership plans. We set out to design the membership cards with a detailed breakdown of each plan, including only the most essential information for new users. We chose to go with design 5 for the mid-fi design.
Membership Page
Process
To increase membership appeal, we must concisely communicate what a VYNL membership includes and how the record curation process works.
Essential Records
Explore the Essential Records selected by VYNL curators from the previous month.
Created an area for customer reviews to establish confidence and trust in our record selection process.
How VYNL Works
‘How it works?’ explains to users in four easy steps how to sign up and maintain a VYNL membership.
Membership Plans
Detailed membership plans are arranged in a carousel scroll.
To create a music profile, simply click on the ‘Get Started' button available on the card and choose your preferred plan.
Goals
Increase membership sign-ups
Clarify the VYNL membership process
Don’t Include
Input artists or records to not include in shipment.
Curated Records
Users can tap to play a sample of records before selecting the curated records they love.
To Include
Input artists or records for VYNL curators to include in shipment.
Select Favorite Artists
Select favorite artsits.
Select Favorite Genres
Select favorite genres and sub-genres.
Confirmation Message
Confirmation message that Spotify is connected.
Music Profile
Process
After completing the Music Profile task flow, we used it as a blueprint to design the user interface. We aimed to minimize user fatigue by replacing the input text fields with interactive drop-downs and selections.
Connect Music Platform
Users select Spotify as their music streaming platform.
Input Turntable
Input turntable model so VYNL curators know what size . to include
Selecting a Membership Plan
Process
Once users have finished creating their music profile, they complete their account by choosing a membership plan and reviewing their music profile. The selected plan will then be added to their cart, and they can proceed to checkout.
Checkout with Membership Plan
Review and place order.
Review Profile
User review music profile and membership plan before checking out to complete their order and first curated shipment.
Choose Membership Plans
Users can select a membership plan with the ‘Add to cart’ button on the card, adding a plan to their cart.
Goals
Build trust by reviewing the music profile and membership plan.
Testing the Design
Process
Now that our mid-fidelity prototype is finished, it's time to put our designs and solutions to the test. We want to determine what worked well and identify areas for improvement.
Key Insights
Scenario - Usability Test
Locate and review information about VYNL’s Curators.
Navigate to the Membership page and review plans and how VYNL membership works.
Create a music profile, select Trio Membership, and proceed to checkout.
Navigate to Store Page, locate the exclusive record “Full-On Monet” by Husbands, and proceed to add the record to the cart and checkout.
Improving Our Design
Improvement 1
We have revamped our membership plans to make them easier to read and less cluttered.
Added sub-copy to provide further information regarding membership plans.
Improvement 2
Removed the ‘Who we are’ section from the About page.
Improvement 3
Relocated the 'Gift Membership' section from the Homepage to the Membership and Store pages for better organization.
Updating Membership Plans
Process
During our mid-fidelity usability test, users needed more information regarding the membership plans to make an informed decision. We considered their feedback and improved the membership cards' design to address their need for additional details and an overall better design.
Membership Plans - Detailed
Added sub-copy to provide more details on membership plans.
Redesigned cards to be easier to read and reduce clutter.
Membership Plans - Condensed
Designed a condensed version of membership plans showcasing the most important information.
Used in smaller spaces, including the Homepage, music profile, and checkout.
Deliver
Homepage
Our top priority in redesigning the homepage was to ensure that users can easily understand the range of products and services offered by VYNL. This includes VYNL’s monthly subscription-based membership plans as well as their online store.
Unique Content
Created unique content sections: Store, Membership, and essential records with CTA buttons.
Descriptive sub-copy provides detailed information about products and services.
Interactive content carousels give users access to essential information without leaving the homepage.
Contact VYNL
Contact VYNL is designed to give users easy access to contact VYNL for any queries or questions.
My Account
The newly redesigned account page serves as the primary hub for users to access their music profile, curate shipments included in their membership, and modify any information related to their membership plan.
Notification Center
The notification center is designed to remind members that it’s time to curate their upcoming shipments as part of their membership plan.
Curating Shipment
Returning members can curate their shipment in one of two ways; members can choose to have a VYNL curator select all exclusive records for their upcoming shipment or choose from next month’s essential records.
Returning Members - Curate Shipment
VYNL Store
We have revamped the store page to simplify the process of searching and shopping for exclusive vinyl records. Our new design incorporates filtered search and comprehensive product details, making it easier for users to quickly find their favorite records.
Gift VYNL Membership
At the forefront of the store's promotion are membership gift cards to increase membership enrollment.
Filter Search
Save time while shopping for exclusive records by quickly filtering your search.
Product Page
Tap to play a sample of a record - powered by Spotify.
Product details include: album description, track list, about the artist, and verified customer reviews.
About VYNL
The About page of VYNL plays an important role in establishing trust among users, new and old alike. After conducting a thorough site analysis, it became apparent that users were having difficulty comprehending VYNL's curation process and record selection. Therefore, our team made it a priority to provide clear answers to these inquiries for the benefit of users.
Meet Our Curators
Meet the curators responsible for curating the essential records and managing the store at VYNL.
Get In Touch
If you have queries or concerns, contact VYNL customer service quickly and easily.
What is VYNL?
Clear and concise information showcases VYNL’s offerings and how the service works.
Next Steps
To enhance customer service, we plan to further develop and utilize innovative tools like the notification center in the user profile. These tools will instill trust in VYNL's services, ultimately leading to higher levels of customer satisfaction.
Perform a usability test on the hi-fi design, with a specific focus on the task flow for selecting records for returning members.
Reflection
During the research stage, conducting additional user interviews is highly recommended to accurately identify participants who are subscribed to a vinyl service.
While designing the information architecture and content strategy, we had to determine what information would go on each page. However, we later discovered that some sections were duplicated across multiple pages. With better planning and consideration of the layout and information architecture, we could have avoided this issue and reduced the amount of duplicated content.
Our team had initially planned a project with a scope that was too ambitious for the given timeline. In hindsight, concentrating our efforts on enhancing members' overall appeal and experience would have been more beneficial. Prioritizing returning members equally to new potential members.