Ginger Snap Branding and Digital
Ginger Snap Hair Studio is a new salon in Pittsburgh, PA. As a previous salon owner who relocated to a new city, it was important for the client, Jessica Schwarz, to build a new client base. The client desired a logo and brand style that fit in with her values of simplicity, approachability and confidence; she differentiates herself from the competition by providing well-rounded services with a more organic, natural style.
- The target audience was women in the downtown area aged 25-65, who are looking for fresh yet low-maintenance hair styling.
- The challenge with this project was how to showcase Jessica’s talent and bring across her personality to potential clients.
- The client has been in the industry for 15+ years, and having owned a salon previously, she has a good grasp on what her clients want. Her old salon had a website with a booking widget, which was popular from both a client perspective for ease of booking and also from a client management perspective, as it saved time for the staff and sent out automatic reminder emails to clients. This is something we planned on bringing into the new website.
As the sole designer working with a business owner, I wore quite a few hats. I did branding design, user research, wireframing, visual design, and implemented the website via WordPress.
Logo and Branding Design
I designed a logo and developed a visual brand style for Ginger Snap that encapsulates their brand values and inspires the customer to book with the salon. The overall goal is for the target audience to feel inspired and welcomed.
The logo and color palette are 70’s inspired, which feel warm, lighthearted, and confident. The artwork has plenty of texture and a nod to nature, which ties in to Ginger Snap’s values of approachability and creativity. The artwork brings a sense of harmony and flow, and is flexible for future use.
The client wanted the brand to visually stand out from other salons in the area who favor a minimal aesthetic. After creating a moodboard that nailed down the client’s vision for her brand, I designed a logo and brand art style that can be used as a pattern in different materials. I’ve established a set of 25+ social posts to be integrated with her portfolio of hair photos on Instagram. These carry through the brand style onto social media with illustrations, color, and texture. From there, I moved into the research phase for the website.
In order to get a better picture of what her target customers are interested in, I conducted a short, anonymous survey. 40 people filled out the survey, which included questions about demographics, their consumer interests in hair styling, and their preferences when it comes to finding a new stylist and how they book their appointments. The goal was to get a general idea of preferences to inform what we included on the website, and to guide future interviews with more in-depth questions. Click here to view the survey results and methodology in detail.
From the information gathered in the survey, I was able to determine that we were hitting our target demographic of women who prefer low-maintenance hair colors that look okay grown out, like balayage. I verified our 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. This will inform how the site is built and how new customers are recruited. This also informed our decision to have CTAs direct the user to the Book Now page, instead of the Contact page. While it was still necessary to give users a way to get in contact with the salon, this was not our main focus.
At the discovery phase of my project, I conducted user interviews in order to better understand user preferences and ask clarifying questions that were obtained through the survey. The responses were used to guide the website design and to also build user personas.
Research questions below included questions that were included in the survey along with more open-ended questions that could guide a discussion with the user. The main insights gleaned from the interviews were:
- 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 persona has different priorities, lifestyle, and preferences; they fit into different target audiences for the salon. Click here to view the user personas in detail.
Overall, the user journey is pretty simple once they reach the Ginger Snap Hair Studio website. By doing interviews, I was able to determine what the likeliest user flow would be, which is that they arrive at the site, view portfolio pictures, read about the stylist, and then book an appointment. The biggest opportunity to lose a conversion was through the booking widget, since the user would not be able to complete the process without creating an account. The Vagaro booking system was already implemented by the salon, so I was not able to control the process once the user reached the page. Overall, it is a powerful tool, so I focused on the aspects of getting the user to the Book Now page to complete their task.
Wireframes & UI Design
At the beginning of my design process I created wireframes for testing purposes. After initially sketching out the IA and overall page structure, I used Figma to make a low-fidelity prototype. Click here to view the mobile prototype. Once refining the placement of the elements throughout the site, I moved into doing a mockup for the homepage as well as an interior page to make sure the scale of the artwork was working. Once getting sign-off from the client, I output all of the visual elements and built the site in WordPress using a front-end builder, and did some minimal code editing.
For visual design, I went with a light and fresh look but integrated some elements that added depth and personality to the site. Tying back to the logo and brand design for Ginger Snap, the goal was for the user to feel inspired and welcomed. The warm color palette, painted textures, and use of the brand font Recoleta for headlines pulled together the overall style for the website.
Before launching the site, I did a round of user testing in order to reveal possible usability problems. I observed the same two users I interviewed, via Zoom, and following the observation, I asked follow up questions. Overall, feedback was that the site was easy to use, and the homepage felt warm and inviting. The users felt that they were missing photos of the actual salon, and especially during covid, knowing the situation for the environment in the salon would be helpful in converting them into clients. Since photos of the space were not available, this will be added to the site at a later date.
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.
It can also be challenging designing something for an independent business owner because their identity feels tied to the brand, but this also makes it incredibly rewarding when the client loves the result. 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.
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.
Ginger Snap Hair Studio