Fredem Salon Studios Website Redesign
Overview
Role
UX Designer
​
Responsibilities
Conducting interviews, paper and digital wireframing, low and hi fidelity prototyping, conducting usability studies, iterating on designs, determining information architecture, and responsive design.
​
Project Duration
May 2022-July 2022
Background
I was asked to re-design the original website and it should attract the most talented beauty professionals and entrepreneurs to join the Fredem community and provide visitors with a clear understanding of the benefits of choosing Fredem for their beauty needs.
The Problem
The Fredem Salon Studios website currently faces challenges in effectively attracting the most talented beauty professionals and entrepreneurs, while also providing visitors with a clear understanding of the benefits of choosing Fredem for their beauty needs.
The Goal
The goal of redesigning the Fredem Salon Studios website is to create an inviting, user-friendly platform that appeals to potential customers and salon professionals. It should have a clear layout, highlighting the luxurious experience Fredem offers, and showcase its various services, including Cosmetology services for Eyes, Hair, Nails, Skin, and Spa.
​
Empathize
Research Approach
To get a better understanding of the current market and expectations of the potential clients and employees, I employed two research methods--competitive analysis, customer interviews, and expert evaluation.
​
Research Goals
The research goal for the redesign of the Fredem Salon Studios website is to gain a deep understanding of the target audience, their preferences, and their motivations when it comes to choosing beauty professionals and salon services. The research will focus on identifying key factors that influence conversion rates and engagement on the website, such as user behavior, user expectations, and the effectiveness of current website elements. Additionally, the research will explore industry best practices and emerging trends in web design, user experience, and conversion optimization to inform the redesign process. The ultimate aim is to gather insights that will guide the creation of a compelling and effective website that successfully attracts talented beauty professionals, entrepreneurs, and potential customers to join the Fredem community and choose Fredem Salon Studios for their beauty needs.
Competitive Analysis
​
​
User Interviews
For this project, I recruited 12 participants who are ranging from beauty professionals, entrepreneurs, owners, current clients, potential clients, and cosmetology students. The age of participants ranged from 23 to 45; 6 identified as woman and 6 identified as man.
​
Insights
Here are some general insights I observed:
-
Update Design: The website's design is perceived as outdated and lacking a modern and sleek appearance.
-
Studio Info: It is challenging to find information about studio spaces available, pricing, support, and resources provided to beauty professionals. The information is not prominently displayed and requires time to locate.
-
Unique Benefits: The website does not effectively highlight the unique benefits of choosing Fredem, such as the freedom to brand and personalize studio spaces.
-
Success stories: There is a need for the website to showcase success stories and testimonials from beauty professionals who have thrived at Fredem.
-
Interview Suggestions: Suggestions for improvement include revamping the website with a more modern and user-friendly design, prominently featuring the benefits and success stories of beauty professionals, adding virtual tours of the studio spaces, simplifying navigation, adding visuals and testimonials, and creating dedicated sections for student offerings, resources, and profiles of professionals working at Fredem.
​
Define
Personas
I conducted user interviews to gain insights and feedback from our target audience. These interviews allowed me to identify user goals, behaviors, and pain points, which were then used to inform the design decisions.
Persona 1: Kiesha​
Persona 2: Monica
​
Ideate
Wireframes of main user flow
I went straight to wireframes because of the ideas the users gave and the idea my client already had in mind I was able to come up with solutions based on that.
​
​
Prototype
Low Fidelity Prototype
I preformed an unmoderated usability test/study that was about 30 mins long, remote and tested this low fidelity prototype on 5 participants. From this test, I was able to understand did i miss anything or what was confusing. Here are some of the findings I used to improve my design for my high fidelity prototype:
​
​
Final Designs
Homescreen Mockup
I have developed a convenient feature in the form of a "Book A Pro Button" that provides direct access to the professionals' page, allowing you to easily find and choose the hairstylist you prefer.
Services Mockup
I have created the "Our Services" section to inform all customers about the range of services we offer and to provide access to the professionals who specialize in providing these services.
Success Stories & Testimonials
In response to user requests, I successfully implemented a "Success Stories and Testimonials" section as an additional feature. This section was introduced with the intention of enhancing the credibility of our professionals and providing them with well-deserved recognition for their exceptional skills and achievements.
Book A Pro Flow Mockups
I have carefully designed the "Book a Pro" flow to embody a minimalistic approach while delivering essential information to customers promptly. This flow enables customers to access a stylist's mini-profile, allowing them to familiarize themselves with the stylist's background. Additionally, by clicking on the "View Prices" button, customers can directly book an appointment with the stylist through their embedded booking platform on their own website.
Test
High Fidelity Prototype Usability Test
I preformed an unmoderated usability test/study that was about 30-45 mins long, remote and tested this high fidelity prototype on 5 participants. From this test, I was able to understand what vital pieces were missing and what was confusing. Here are some of the findings I used to improve my design for my high fidelity prototype:
​
-
Simplified Forms: Some users found the registration and contact forms on the website to be too lengthy and complex. They recommended simplifying the forms by removing unnecessary fields and using a more streamlined design. Additionally, providing real-time validation and clear instructions would help users complete the forms more easily and confidently.
-
Grammatical & Form Errors: Some users encountered grammatical and form errors during their interaction with the website. These errors could include issues with grammar, spelling, or formatting within the content and form fields.
Grammar/Form Errors & Simplified Forms
After analyzing the user feedback and recommendations, I have implemented the suggested changes to improve the website. Here is a visual representation showcasing the updates:
Impact
By implementing these updates to the Fredem Salon Studios website, the impact is expected to be significant. The revamped design, improved information accessibility, highlighted unique benefits, and showcased success stories will enhance user engagement, credibility, and ultimately attract more beauty professionals to choose Fredem as their salon space.
What I Learned
-
User Research: Understanding the importance of user research and learning how to conduct effective research methods such as interviews, surveys, and usability testing. This helps in gaining insights into user behaviors, needs, and preferences.
-
Wireframing and Prototyping: Mastering the art of creating low-fidelity wireframes and high-fidelity prototypes. These help visualize and communicate design ideas, test concepts, and gather feedback early in the design process.
-
Usability Testing and Iteration: Learning how to conduct usability testing sessions to gather feedback from users and identify areas for improvement. Iterating designs based on user feedback and data-driven insights.
Next Steps
-
Create dedicated sections for student offerings.
-
Transfer the domain name over.
-
Perform another usability test on what users like and dislike about the site.