Hair Salon Website
Ginger Snap Hair Studio
Wireframes & Low-Fi Prototype
The salon owner relocated to a new city and needed to build a new client base. She desired a website and brand style that fit in with her values of simplicity and approachability, and allowed clients to book appointments.
Ginger Snap Hair Studio is a new salon in Pittsburgh, PA who needed to establish their brand and build a client base. As the sole designer working with a business owner, I wore quite a few hats. I did branding design, user research, wireframing/prototyping, visual design, and implemented the website via WordPress.
- Establish brand aesthetic and messaging
- Incorporate Vagaro booking system into website, which the client has used in the past
- Highlight portfolio photos
- List services with transparent pricing
- Make booking an appointment easy to locate
Gain knowledge of target market preferences to inform what we included on the website, and to guide future interviews with more in-depth questions.
- Verified theory that customers prefer to book appointments through an app or widget, and that they are more likely to book a stylist if they were recommended by friends or family.
- The most important factor when booking was that customers wanted to view the stylist’s portfolio.
- Users prefer an easy-to-use system where they can book appointments remotely, and view pricing for their specific stylist.
- Users want transparency when it comes to policies and pricing.
- Word-of-mouth is the easiest way users feel comfortable with booking a new stylist.
- Users want to see photos in the stylist’s portfolio that match the service they have in mind.
Based on the survey, interviews, and input from the salon owner, I set up three personas. We referred to them throughout the product development process. Each has different priorities, lifestyle, and preferences; they fit into different target users for the salon.
The site is relatively simple; the likeliest user flow would be for users to arrive at the site, view portfolio pictures, read about the stylist, and then book an appointment.
Wireframe & Low-Fi Prototype
After initially sketching out the sitemap and overall page structure, I used Figma to make wireframes and a low-fidelity prototype.
For visual design, the goal was for the user to feel inspired and welcomed. Tying back to the brand design, the warm color palette, painted textures, and use of typography pulled together the overall style for the website.
The homepage welcomed the user and incorporated portfolio photos and testimonials. We established the brand aesthetic through use of texture, color, and illustration.
The booking page allowed clients to seamlessly book appointments via the Vagaro widget.
The portfolio page showcased photos of her work, which was one of the top requirements of users. The page pulled images from the Instagram feed automatically, so the client didn't have to update the page manually.
I believe we succeeded in establishing a style that captures Ginger Snap’s brand personality as well as launching a website that provides users with a pleasant experience that encourages them to book an appointment.
This project was an opportunity for me to bring a brand to life from scratch, working not only on branding design but also website design. It was challenging to be the only designer on the project and conduct the research on my own, but it was a great opportunity to learn and adapt throughout the process.
The next steps for this project are to monitor the site via Google Analytics and collect additional feedback from clients. These could inform how we can make improvements to the site and continue the iterative design process.