The grove

THE GROVE WEBSITE

Client

The Grove Salon and Spa

My Role

Project Lead: Prototyping, UX Design, Development, Testing

Platforms

Desktop, Tablet, Mobile

Tools

Editor X, Figma, Photoshop, Canva

View Live Site

Background

The Grove Salon sought to revamp their online presence with a focus on sustainability, user engagement, and streamlined digital interactions. They needed a website that not only highlighted their eco-friendly practices but also provided a seamless user experience for clients seeking salon services.

Comprehensive Design Process

1. Initial Research and Data Collection

_Objective:_{Understand The Grove Salon’s brand values, target audience, and specific requirements.}
_Actions:_{Conducted stakeholder interviews and gathered comprehensive data from salon owners.}

2. Brand Book Creation

_Objective:_{Establish a cohesive visual and tonal brand identity.}
_Actions:_{Designed a detailed brand book outlining the salon’s visual guidelines, including logos, color schemes, typography, and imagery. The brand book was created to reflect The Grove Salon’s commitment to sustainability and high-quality service. After revisions and feedback from the client, the brand book was finalized and approved.}

3. Wireframe Development

_Objective:_{Create a structural blueprint of the website to guide the design and functionality.}
_‍_Actions:_{Developed initial wireframes to map out the website’s layout, navigation, and key elements. This phase involved multiple revision cycles, where client feedback was incorporated to ensure the wireframe met their vision. User experience principles were prioritized to ensure a seamless and intuitive navigation flow.}

4. Website Design and Development

_Objective:_{Build the website based on the approved wireframes and brand guidelines.}
_Actions:_{Created high-fidelity designs incorporating the approved wireframes and brand book elements. Additionally, I focused on the overall digitalization of communication to reduce the need for extra employees otherwise required to answer phones. Client-provided content and images were integrated effectively and consistently with the overall design. Few rounds of revisions were conducted based on client feedback to fine-tune the design.}

5. Implementation and Testing

_Objective:_{Ensure the website is fully functional and user-friendly before launch.}
_Actions:_{Implemented the final design into a functional website, paying close attention to detail and user experience. Thorough testing was conducted to identify and resolve any issues, ensuring the site was optimized for performance and accessibility. Feedback from a select group of users was gathered to validate usability and make final adjustments.}

6. Launch and Post-Launch Support

_Objective:_{Successfully launch the website and provide ongoing support.}
_Actions:_{Coordinated with the client to ensure a smooth website launch. Post-launch, the website was monitored to address any emerging issues promptly. Training and support were provided to The Grove Salon’s team to ensure they could manage and update the website effectively.}

In-Depth Research

First I created a digital adoption plan for The Grove Salon, which outlines detailed project goals and comprehensive research. It includes analyses and recommendations for enhancing the salon's online presence, marketing strategies, SEO, and digital infrastructure. Specific to their website, the presentation covers the current state analysis, performance metrics, a comprehensive SEO strategy, website redesign proposals, and the implementation of automated reception services and chatbots. The aim is to improve the salon's visibility, customer engagement, and overall operational efficiency through targeted digital initiatives.

The images displayed below are just a sneak peak, click the button to view the full presentation!

View Presentation

Project Goals & Brand Book

I then outlined the key objectives for The Grove Salon’s rebrand and website redesign.

Create a Strong Brand Identity_‍

_{Develop a recognizable brand identity reflecting The Grove Salon’s commitment to sustainability and high-quality service.}
_{Create a detailed brand book outlining visual and tonal guidelines.}
_{Ensure consistency in branding elements across the website, including logos, color schemes, typography, and imagery}
_{Highlight the salon's eco-friendly practices and sustainable products to differentiate it from competitors.}

Enhance User Experience (UX)

_{Provide a seamless, intuitive, and engaging user experience meeting the needs of diverse user personas.}
_{Design a user-friendly interface with easy navigation, clear information architecture, and accessible features.}

Automate Customer Communication

_{Reduce reliance on phone interactions}
_{Implement an AI chatbot to handle common inquiries and provide instant support.}
_{Design and integrate a comprehensive “Contact Us” form for more detailed queries.}
_{Streamline communication with customers through automated and targeted email newsletters, ensure new subscribers are automatically added to the mailing list.}

Personalize Customer Experience

_{Provide personalized recommendations and services to enhance customer satisfaction and loyalty.}
_{Develop a detailed “Find My Stylist” form to match clients with the most suitable stylist based on their preferences and needs.}
_{Create comprehensive stylist profiles with detailed descriptions and booking links.}
_{Connect instagram feed to website so clients can directly view it from the website.}

Showcase Sustainable Practices

_{Highlight The Grove Salon’s commitment to sustainability to attract eco-conscious customers and build a competitive advantage.}
_{Integrate information and imagery that emphasize the salon’s sustainable practices and eco-friendly products. Use a green and earthy color palette to reinforce the sustainability theme.}

Organize Services by Location

_{Clearly present the services offered at each of The Grove Salon’s locations to improve customer convenience and satisfaction.}
_{Ensure customers can easily find and book services at their preferred location.}

Following the initial research and data collection from The Grove Salon owners, I began by creating a comprehensive brand book. After undergoing revisions and receiving client approval, the next step was to develop the website wireframe.

View Presentation

Wireframe

To expedite the process, as the client needed the website ready for an urgent launch, they requested a high-fidelity Figma design of only the homepage for both desktop and mobile views. I presented multiple homepage design options and the client selected version 3 of the home-page design. They then granted me full creative control to design the remaining pages, ensuring a consistent theme and aesthetic across the site. Before the final launch, the website underwent additional revisions to precisely align with the client's vision.

Final Website Comparison

The final website I designed and developed (the video's have been sped up), click play to view or check out the live site by clicking the button below!

Before

[data-wf-bgvideo-fallback-img] { display: none; } @media (prefers-reduced-motion: reduce) { [data-wf-bgvideo-fallback-img] { position: absolute; z-index: -100; display: inline-block; height: 100%; width: 100%; object-fit: cover; } }

After

View Live Site

Launch Strategy

The launch of The Grove Salon’s new website followed a phased approach. Initially, the site underwent thorough internal testing to identify and resolve any technical issues. Following this, a soft launch was conducted, inviting a select group of loyal clients to explore the site and provide feedback. This feedback was used to make final adjustments. Concurrently, a marketing campaign was rolled out, leveraging email newsletters (automatically sent out to subscribers on the site), social media, and local advertising to build anticipation and drive traffic.

Post-Launch Strategy

After launching The Grove Salon’s new website, the focus was on continuous improvement and engagement. Regular monitoring of website analytics provided insights into visitor behavior and page performance, guiding ongoing enhancements. Frequent content updates kept the site fresh and supported SEO efforts. Ongoing marketing campaigns through email newsletters, social media, and local advertising drove traffic and retained customer interest. Regular technical maintenance ensured the website remained secure and fast.

Conclusion

The redesign of The Grove Salon's website successfully improved its online presence, meeting and exceeding client expectations. By establishing a strong brand identity, enhancing user experience, and implementing efficient digital tools, the site now effectively showcases the salon's commitment to sustainability and high-quality service. The introduction of a chatbot and online forms digitalized client communication, making interactions easier and more efficient. The phased launch strategy and continuous post-launch improvements ensure sustained customer interest and satisfaction, giving The Grove Salon a competitive advantage over the other salons.

The grove

THE GROVE WEBSITE

Background

Comprehensive Design Process

In-Depth Research

Project Goals & Brand Book

Wireframe

Final Website Comparison

Before

After

Launch Strategy

Post-Launch Strategy

Conclusion

Continue to next project

MINIMIL