Lindevo

Aura Beauty Studio

Concept design for a boutique salon — last-minute luxury card, stylist portfolios with real before/after stacks, and a booking flow that respects how people actually choose a salon.

Tech Stack
TypeScript
React
Tailwind CSS
TanStack
Vite
Vercel
Aura Beauty Studio

Aura Beauty Studio — Effortless beauty appointments

A concept design exploring how a boutique salon should sell a curated experience online

This is a portfolio concept piece, not a live client engagement. The brief we wrote ourselves: "someone scrolling salons on Instagram on a Wednesday afternoon should book a Saturday slot before they close the tab." That conversion window — under three minutes, mostly mobile — drove the whole layout.

What the design solves

Most boutique salon sites in this segment either look like a marketing-template wedding site or like a calendar app with no personality. Aura's mockup splits the difference. The hero overlays three stacked images at staggered scales — a wide salon shot, a hands-on detail, and an editorial portrait — framed in soft white borders, signaling craft without leaning on stock photography.

A floating "Last Minute Luxury" card surfaces this week's still-open premium slots with an animated arrow that activates on hover. It's a small touch but it does what every salon owner wishes their site did: monetize the empty Tuesday slot at 2pm. Below the hero, the services grid uses real prices and clearly named outcomes ("a balayage retouch you can wear for six months, not three") instead of vague packages.

A stylists block presents each artist with a curated three-image portfolio (before, process, after) and short, honest bios written like a recommendation from a friend. The booking form is intentionally short: service, stylist (or "first available"), preferred window, name, phone — no account creation, no marketing checkboxes, no "tell us about your hair history" essay field.

Note

Design system highlights

  • Stacked hero image system — three images at staggered scales with soft white borders
  • Last Minute Luxury card with hover-state animated arrow, surfacing the week's premium openings
  • Scroll-aware navbar with a subtle blur effect and dynamic shadow fade after the first 80px
  • Stylist portfolios as small triptychs (before, process, after) — the credibility unit that actually closes a salon booking
  • Soft ambient shadow system on cards — referencing fabric and skin rather than sharp app surfaces

Stack

  • TanStack Start with React 19 for SSR
  • Tailwind v4 @theme tokens for warm boutique color scoping
  • Framer Motion + AnimatePresence for hover state choreography on the Last Minute card
  • Deployed on Vercel

Want this for your salon?

The full system — navbar, hero, last-minute card, services grid, stylists with portfolios, transformations gallery, booking form, contact — is rebrandable in a single working day. We adapt the type and color, integrate your booking system (Fresha, Square, Glossgenius, or custom), and ship the production site in around two weeks. Start a conversation →