Completed in 2021
Redesigned in 2023
Figma, Illustrator, WordPress
Website Design, UX/UI, WordPress
UX/UI Designer
High-quality client interactions and satisfaction.
This project gave me an opportunity to work closely with a mock client named Sezi who runs a Vancouver-based high-end hair design studio and online shop. To ensure effective communication, weekly check-in meetings were set up to resolve any questions or confusion. The primary objective was to create a user-friendly website that meets the client's specific requirements. As the designer, my aim was to ensure that all the client's needs were met and they were satisfied with the final outcome.
Getting to know the client was essential to achieving our objectives. Therefore, we conducted research on the client Sezi and his goals before the first client meeting, with the intent of gathering and clarifying information. To further understand the client's requirements, we developed a questionnaire which was used to guide the discussion. In addition, we performed research on the targeted users andent a questionnaire to this group to determine their pain points and goals.
What are the requirements that the client provides?
What are the objectives of the website design according to the client's requirements?
Who are the targeted users and what are their expectations and preferences?
What are users' commonalities, differences, pain points, and goals?
Sezi provided a detailed project summary with clear goals and requirements that helped us to understand their preferences and dislikes. With the requirements, we were able to understand our client's dislikes and preferences. It helped us plan out how the website should work and build the project scope appropriately.
Sezi provided us with customer information, which we used to create a survey that was sent to the targeted users. The survey included questions related to tasks and competing websites. The results of the survey helped us gain insight into users' preferences and attitudes towards hair salon websites. We were able to identify commonalities, differences, pain points, action points, and recommendations.
According to the survey results, users prefer simple and fast booking systems over clunky appointment systems that require them to make phone calls instead of booking online. Therefore, it is important to ensure that the user experience design is intuitive and easy to navigate.
Additionally, Sezi and his clients want the website to showcase stylist portfolios with detailed information on their experiences, training, and skill levels. The survey also revealed that users want prices to be upfront and visible on the website.
Users appreciate clean, modern layouts and more details surrounding what services entail (clarification on the jargon).
Based on the results of the user survey, we developed targeted audience personas to better understand the needs, behaviors, and goals of Sezi's studio website users. By understanding the unique perspectives and priorities of each persona, we were able to prioritize website features and design decisions to ensure the best possible user experience.
Since the website is going to be used by both hair salon employees and customers, we built two user personas to identify their goals, motivations, behaviours, and pain points. It helped define who the website is being created for and what is necessary or unnecessary for them from a user-centric point of view.
Based on Sezi's requirements and users' preferences, we visualized a hierarchical diagram of a website that shows how pages are prioritized, linked, and labeled with the sitemap. This allowed us to plan usability of the website. With the sitemap, we also created wireframes that served as a blueprint for the entire project, laying the foundation for the visual design, user interface, and user experience design.
The sitemap provided us with a comprehensive overview, enabling us to streamline the website by eliminating unnecessary pages and prioritizing the essential ones.
By building wireframes, we were able to establish a clear and solid foundation for the website's design. This allowed us to ensure that the website's visual design matched its information architecture, resulting in an intuitive and clean user interface.
The chosen design for Sezi's website incorporates his style keywords of fresh, funky, young, fun, and creative while also maintaining a professional appearance.
Photography of the stylists’ work will remain of primary importance on the website, so the design will be lively without being overpowering.
Fun colours have been chosen to be used throughout the website to set Sezi’s website apart from the rest. They will be used to colour- code certain elements of the website: bookings, online store, and portfolios.
Simple sans-serif fonts were chosen for readability and contrast with the lighter background, while visual elements and direct pictures of the salon's work and products support the overall design.
After designing wireframes and creating a style guide, we conducted user testings with our target audience to understand exactly which parts of the design frustrate people and help generate more intuitive user interactions.
We conducted a usability test through Discord voice channels and screen-sharing in order to gain insight into user performance and their needs.
We introduced our mockup to the participants. Our main focus was expectancy testing - we paid close attention to assumptions concerning how to navigate the site, as well as what content the participant expected to find.
We ran participants through five different scenarios for for both our medium-fidelity and high-fidelity mockups with the intent of determining a) if they could complete the task, and b) what their click-path was to successfully achieve their task.
In the first round of testing, 80% of the scenarios were free of critical errors, while the second round achieved a 100% success rate. This allowed us to refine the design and ensure a seamless user experience.
The final website satisfied Sezi and included everything he requested.