This case study highlights a sophisticated B2B sales strategy combined with advanced Figma system design. I didn't just design a website; you built a real-time "Sales Configuration Engine" using Figma variables to close deals instantly while maintaining a luxury brand standard.
Beauty
Wellness
Duration :
28 Days
Platform :
WIX
Country :
Germany
Brief Context
Our agency aimed to disrupt the traditional client-onboarding process for salons by creating a variable-driven Figma ecosystem.
The goal was to eliminate the long "design-feedback" loop. We built a high-end, modular salon template that could be customized on the spot during a sales call.
By using Figma components and variables, we could instantly toggle layouts (e.g., changing a 5-member team section to a 2-member layout) based on the specific salon’s scale, allowing the client to see their future website in real-time.
Dynamic Scalability :
Engineering a Figma file using variables and components that could adapt to different business sizes (e.g., single location vs. multi-location) without breaking the luxury aesthetic.
WIX Technical Constraints :
Designing a premium, modern UI that felt custom-coded while staying within the functional boundaries of the WIX checkout and booking system.
Progressive Disclosure on Mobile :
Navigating the "Choice Paradox" by making a deep hierarchy of services (Category > Sub-service > Add-ons) feel effortless on a mobile screen.
The "Add-on" Motivation :
Designing a checkout flow that felt like a "Personal Stylist" experience rather than a cold e-commerce transaction.
Design Approach
I focused on Visual Storytelling and Luxury UX. To preserve the premium vibe, the Hero section remained a high-impact, clean visual of the salon's interior, moving all "About" text to a secondary section to maintain breathing room.
For the booking flow, I implemented Progressive Disclosure. Instead of overwhelming users with a list of 50 services, I categorized them into logical groups (Styling, Coloring, etc.).
Once a user selected a service, I used a "Finishing Touches" strategy to upsell add-ons. By framing add-ons as "completing the look," we tapped into the user's desire for perfection, increasing the average order value (AOV) for the salon.
Everything was built with a Mobile-First mindset, ensuring that the cart was always visible as a sticky footer, allowing users to track their selections and total price in real-time.
Our Team Section Variants according to number of employees
Shop Intro Section on Home Page
Key Learnings
Sales-Led Design :
I learned that design can be a powerful sales tool; by building a flexible system in Figma, we reduced the time from "Lead" to "Contract" significantly.
Systemic Creativity :
Designing for a CMS like WIX taught me to see restrictions as a framework for creativity—ensuring a premium look while staying within the "safe zones" of the platform's backend.
Psychological Upselling :
Learned that micro-copy (like "Finishing Touches") has a higher conversion impact than generic labels like "Add-ons."
Advanced Figma Mastery :
This project pushed my skills in Variables and Auto-layout, creating a file that wasn't just a design, but a functional product configuration tool.
