Elysian: Streamlining Salon Booking and Style Discovery— A case study
Let’s take a closer look at how i worked on issues people usually face when booking salon appointments and also discover the distinctive feature that allows users to explore new styles.
🚶 Lets begin the odyssey!
Problem Statement
In our busy lives, looking good often takes a backseat as we hustle through our daily routines. Many users find the process of booking salon appointments inconvenient and confusing. Traditional methods often lack transparency and efficiency, leading to frustration. Additionally, discovering new hairstyles that suit individual preferences can be challenging. Users need a streamlined, user-friendly solution to easily book appointments, select specialists, and explore personalized style options.
Team : Solo Product designer
Duration: 14 days
Wanna sneak-peak into the app-
🎯Key objectives are-
1.Enhance Booking Efficiency -
Streamline the salon booking process to increase user efficiency by providing real-time availability and simplified reservation steps.
2. Style Exploration and Inspiration -
Inspire users by incorporating a style exploration feature that showcases trending and personalized styles, encouraging them to try new looks.
3. Personalized Specialist Connection -
Facilitate a personalized experience by allowing users to add and book their favorite specialists, fostering a sense of familiarity and trust in the salon service.
🔍 Embarking on the Salon Booking App Adventure
The Role of Secondary Research
Imagine building a fantastic salon booking app is like going on a thrilling adventure. In this quest, secondary research acts as my trusty compass, leading the way to an app that truly understands and delights users. It’s the tool that helps us navigate the twists and turns of design, ensuring we craft an experience that’s not just good but outstanding!
Unveiling User Pain Points: The Inside Scoop
To design the salon booking app, i delved into user experiences through articles, competitive analysis and app reviews. Here’s a sneak peek into the pain points i have discovered.
Simplifying the hunt:
Users crave convenience but often face hurdles in the form of cluttered apps and difficult information architecture. The smoother, the better — think of it like a well-orchestrated dance where booking is the star.
Booking blues:
Users share the struggle of finding the right stylist, dealing with limited booking options, and the headache of lack of cancellation flexibility. Users desire a platform that manages bookings seamlessly and instills confidence, especially for those who might not be tech wizards.
Visual desires unfulfilled:
Users yearn for a more streamlined management of visual content, like flipping through a style magazine for inspiration. The absence of features like image reviews/gallery creates a void, where users find it challenging to visualize styles and settings.
Post-booking silence:
Lack of communication or updates from the salon app after a user completes their booking, leaving users feeling disconnected and uninformed about their upcoming appointment. This silence can leave users feeling uncertain or disconnected, impacting their overall experience.
Meeting our salon seeker: Target audience
To design the salon booking app and to make it truly user-centric, we need to know who our users are. User personas are like guiding stars. By understanding our users’ goals, frustrations, and preferences, we ensure our app is tailor-made for them.
By concluding my research journey, I have found the core problem, which is to-
“Design a salon booking app that seamlessly bridges appointment booking and style exploration, elevating user experience.”
💡Ideating the solution
Let’s introduce the information architecture (IA), wireframe and moodboard inspirations of our salon booking app.
🪜 Information Architecture
Let’s give the blueprint that ensures our users navigate seamlessly.
It’s the skeleton that holds everything together. Picture it as a well-organized bookshelf. Each shelf represents a section of our app, making it easy for users to find what they need without feeling lost.
📝 Wireframing -
The pen and paper sketch is the best part I love; it helps me to ease out the iterations, and while sketching, my mind gives me freedom to find out the ideas.
🖼️ Designing the Vision
Before the pixels meet the screen, let’s talk inspiration. Our moodboard is like a visual roadmap, filled with colors, textures, and vibes that capture the essence of what our salon booking app will feel like.
Imagine it as a canvas where we paint the emotions and experiences we want our users to have.
Introducting Elysian
Elysian is a mobile app that helps users take appointments for their salon services in nearby areas, select their stylist, and explore new styles.
Elysian helps users easily book their salon appointments by providing them with the best salons nearby, helping them select specialists, exploring new styles, and taking inspiration.
This app is for clients who will book their appointments through the app, they can also contact the salon and learn about them. But the salons can also use the app by accepting or rejecting the appointments taken by their clients.
But for this project, I am only focusing on the client side.
Let’s introduce the visual guidelines of my salon booking app.
As we embark on the visual journey of our salon booking app, let’s set the stage with our visual guidelines. This is where the magic happens — the colors, icons, and fonts that will weave together to create an aesthetic symphony.
Continuing our odyssey with design screens
User Onboarding..
The journey begins with the splash and onboarding screens, where simplicity reigns supreme. Although I won’t reveal them just yet, picture an introduction so smooth it’s like meeting an old friend. Navigating Elysian is not a task; it’s a delightful experience that welcomes you with open arms.
Upon entering, the login/signup screens act as your gateway to the Elysian universe. These screens are designed with clarity in mind, making the initial steps a breeze. No complicated paths — just a straightforward entry to a world of beauty and style.
Home Screen..
The Home Screen is where beauty meets convenience, inviting you to explore, book, and indulge in the world of Elysian.
With just a glance, you’ll navigate effortlessly, finding your way to the perfect salon experience.
Take inspirations and salon card..
“Take Inspirations” section helps users to consider as a style compass, pointing users towards the latest trends and timeless classics. With a simple tap, explore a world of new styles.
Explore Screen..
Welcome to the “Explore” screen, where the thrill of the unknown meets the joy of discovery, where trends, inspirations, and face-scanned styles converge to redefine your salon experience.
Imagine this as your style adventurer’s map, guiding you through a diverse landscape of trends, cuts, and styles.
Your Face, Your Canvas: Face Scanner Unleashed
Welcome to the magical realm of the face scanner within the Explore tab — a revolutionary feature that transforms your face into a canvas for new and personalized hairstyles.
Save the discovered styles for future inspiration. The face scanner isn’t just a tool for today; it’s your stylist companion for the future.
This is more than a screen; it’s a personalized journey, putting the power of discovery directly in your hands.
Appointments tab..
Now, let’s peek into the heart of your salon journey — the Appointments tab. Think of it as your personal salon timeline, keeping you in the loop with all your upcoming, past, and even cancelled appointments.
Navigate effortlessly through your salon history in the Appointments tab — your personalized salon time machine.
Profile screen..
Explore the profile tab of Elysian from the bottom nav bar to better understand the app settings, and learn more about the app, you can also logout from your account by visiting this tab and much more.
Let’s understand the flow of booking..
Before understanding the flow of booking, first lets see how a particular salon page looks like.
The seamless booking flow..
Let’s introduce the booking flow, highlighting the seamless process of adding services, selecting a date and time, and choosing your preferred salon specialist.
Continuing the booking flow after the adding services to the appointment screen. Appointment booking screen helps user to select date, time and salon specialist.
This process isn’t just about booking; it’s a collaborative dance between you, your chosen services, and your dedicated salon specialist.
Know your specialist..
This screen flow is your backstage pass to finding the perfect stylist who understands and enhances your unique beauty.
It’s not just about booking; it’s a collaboration between you and your chosen specialist, creating a salon experience that’s as unique as you are.
Recheck your date and time slots by coming back after adding your best specialist. Also know more about the availability of your specilast.
Final touches: Checkout and booking summary..
As you reach the final steps of your salon adventure, the checkout screen and booking summary are your last stops to ensure a smooth and delightful experience.
Behind the scenes peek at the design journey of Elysian..
Here, I proudly present the iterations showcase, where you witness the evolution of the salon booking app — from the first strokes on the digital canvas to the refined masterpiece it has become.
🎉 That’s a wrap!
I hope you have enjoyed reading this cases study.
Visit my figma project to explore the iterations, design decisions, and the meticulous crafting that went into Elysian.
Click prototype to interact with the app and witness its beauty unfold.
If you have any feedback, feel free to drop it in the comments, and I will surely look into it.
I am open for product design role, feel free to chat on Linkedin or Twitter.
Thank you for being part of my odyssey. Stay beautiful, stay Elysian!
✨ Hold the clap button and watch the fireworks — up to 50 claps!