MaxiLash Boutique
Adding a feature to an existing website
Timeline
4 months in 2022
My Role
Research
Information Architecture
Prototype
User Testing
Project Type
School Project
Worked with real business
From the beginning...
One of my capstone projects at DesignLab was to add a feature to an existing website. During that time, the salon I worked at had just added permanent makeup to their services. Since permanent makeup is a tattoo on the face, there are many contraindications a client and stylist must consider. The client needs to fully understand and consent to the before care, procedure process, and aftercare to ensure safety, health, and good results.
The Problem...
Consent forms are usually provided at the time of the appointment which created 2 main issues:
1) People do not thoroughly read through the contraindication or consent forms
2) If a client did have a contraindication (medical condition preventing them from getting the service) they would have to cancel last minute and the salon would lose money for that 3-6 hour time slot
What we will address:
1
Add a permanent makeup service page to align with the design of the other service pages
2
Integrate important information from consent forms into booking process
3
Turn consent forms from long text into digestible information to encourage reading
Sneak Peek at the Final Solution
Here are some of the screens showing the final solution. Read more below to see how the solution came to fruition.
The project was successful because the users read the important information prior to booking without having to read the details of a long monotonous consent form.
Empathize
Methods of Research
I had the unique advantage of working at MaxiLash while adding the feature to the website. I was able to do field observations and take notes about problems that arose with consent forms when booking clients. I was also able to conduct surveys with willing clients.
I used four methods of research for this project:
-
Competitive analysis
-
Secondary Research
-
Open Ended Survey with follow-up Interviews
-
Field Observation
Competitor Research
I focused on Direct Competitors in and around the Boston area because that was the location of the salon I was doing the website design. These were direct competitors at brick-and-mortar locations.
However, to understand how other salons were integrating consent forms for permanent make-up, I also did secondary research on permanent make-up salons nationwide.
Observational Research Findings and Survey Questions
Research Findings
1st Set
2nd Set
Research Findings
Key Findings
-
Most research participants view consent forms as professional and "necessary" yet do not actually read them
-
Receiving a consent form before the appointment did not increase the rate of completion
-
30% of participants mentioned "trust" in the company they chose that they did not feel important to read the consent form
-
Putting a financial deposit down for service upon booking encouraged reading important information prior to booking
-
"Long boring text" and "short attention spans" seemed to be the main deterrent of reading consent forms
"Most consent forms are a lot of legal ease that I just sign without reading."
-Selena
The Persona
"Booking should be easy. I really don't want to hassle with a consent form at that point."
-Adrianna
Define
I was adding a feature to an existing website. Without rebranding and re-designing the entire site, I had to work within certain constraints. I started by creating a site map that depicted the site as it was.
Then, I incorporated Permanent Makeup services as a service page, integrated services into booking, and a series of slides for important information in place of the consent form.
I decided to redesign the information architecture of the site so there was a more intuitive structure based on my card sorting results.
Wireframes
Four sets of wireframes were tested.
Set 1
Ideate
Minor Design Changes
I was not rebranding or redesigning the entire MaxiLash website. However, there were minor design changes I suggested to the owner to make the added feature flow better regarding information architecture. I also suggested a couple of color adjustments to better align with accessibility standards.
The button texts are inconsistent throughout the site. The white text on the light pink button does not fit accessibility standards.
Change the text on the main navigation bar and body text on the gray background to fit accessibility standards as well.
Initial Design Ideas
1st Prototype
Test
I tested the first prototype using Maze and did remote testing.
There were 5 participants that were MaxiLash Boutique clients all of whom expressed interest in receiving permanent makeup in the near future.
Key Test Insights
Final Flow
Including Integration with Third-Party Apps
The Final Flow includes adapting to the constraints of the original website design, making subtle design changes to comply with accessibility standards, and changing menu items to have a more intuitive information architecture according to card sorting results. The final flow also shows the integration of the third-party apps used by the company for consent forms and payment. Third-party screens were not my design.
Third-Party App
Third-Party App
Changes, Successes and Lessons Learned
The biggest change made after user testing was adding the consent form and deposit as a fourth step so it was not broken up from the steps of the service. The goal was to get clients to read the important information, make a deposit, and sign the consent (or get the consent form emailed). The initial prototype completed the first 3 steps of important information, only to realize you were not done with the process. This would typically be an aversion point. So making clear from the beginning that there are 4 steps, the user will be prepared and know what to expect.
The project was successful because not only was I able to add a simple feature but it accomplished a big goal of breaking down the information into smaller digestible steps the clients were ushered through before booking. You can never guarantee that a user will actually read the content but it was offered in a scannable way and required clicking through to get to the end goal. The continue to Booking CTA allows returning user to skip the content but is lower on the page so reading is still encouraged.
I learned the lesson of time constraints and scaling projects. I started to redesign the entire website as well as add a feature. Time constraints did not allow for the redesign. If I would have had more experience in scaling the project and estimating the time, I would have been able to set expectations from the beginning. I learned how to reassess the project priorities and have important conversations about moving forward. It was agreed in the end that the priority for all stakeholders was to focus on the added feature for the new permanent makeup service.
