Hairstyle Try-On

See braids, locs, silk press and any hair colour on your own face before a six-hour appointment. Every style on every hair type, from 1 to 4C.

Comment

Inspiration

Six hours in the chair is a long time to find out you don't like it. Knotless braids, locs and silk presses cost $150 to $400 and most of a day, and the photo people book from is almost always someone else's hair: a different face, and usually a different hair type. Most try-on tools are built and demoed on straight hair, and they are weakest on coils. We wanted one selfie to answer "does this suit me?" before anyone pays.

What it does

  • Every style, on every hair type. 18 styles across braids, twists, locs, curls and waves, each photographed on every hair type it suits (1 to 4C). Knotless on 4A and knotless on 4C are separate choices, and search finds "locs 4c" directly.
  • One selfie. Before you upload, the photo screen shows real examples of what works and what to avoid (hats, turned heads, backlight), instead of an error afterwards.
  • Only the hair changes. Your face, skin tone and background stay as they are. You choose whether to keep your own colour or take the colour from the style.
  • Hold to compare. Press and hold any result to see your real hair in exactly the same frame.
  • 31 colours, shown on curls and coils, and you can recolour any look you've made without changing the cut.
  • Copy a style you've seen. Add any hairstyle photo and it goes onto your face.
  • Save and share. Saved looks stay on your phone for your stylist. Shared copies carry a small watermark; your saved copy never does.
  • No account, no password. Photos are deleted from our storage within 72 hours and are never used for training.

How we built it

  • App: Expo (React Native, TypeScript, expo-router).
  • Server: NestJS, Prisma and PostgreSQL on Railway. Photos go straight from the phone to Cloudflare R2 through pre-signed uploads and are deleted within 72 hours.
  • Generation: image-editing models through Kie.ai. Each style has a reference photo per hair type, so the model is shown what the style looks like on that texture.
  • Monetisation: the RevenueCat SDK powers the paywall and the Hairstyle Pro subscription (weekly and annual). RevenueCat webhooks tell our server who has subscribed, and the server checks credits before every generation, so the app never holds a model API key.
  • Also: DeviceCheck keeps free looks from being farmed, and the share watermark is applied on the server.

Challenges

  • Getting coils right. Textures from 1 to 4C need their own references, and a single "knotless braids" photo produced the wrong result on most hair.
  • Keeping the face untouched. Skin tone, face shape and background must survive every edit, so every style prompt is written and tested for that.
  • Honest waiting. A generation takes 15 to 50 seconds, so the app shows the real steps and a time estimate. A look that fails is never charged.

Accomplishments we're proud of

We shipped on the App Store on 28 September, with real purchases through RevenueCat, and made a catalogue in which the model on the tile has the same hair type as the person using it.

What's next

  • Braiders and stylists: free client codes and printable cards (sign-up is live at hairstyle.piedrops.com/braiders).
  • More content: more styles per hair type, and short-form videos made from real app use.

Design: what to look for

  1. The catalogue is organised by hair type, not by model. On the All styles screen, every style appears once per texture it suits: "Knotless box braids 3 / 4A / 4B / 4C". Each tile is photographed on that texture, so the picture you choose from already looks like your hair.
  2. Colour is shown on textured hair. On the Hair colour screen, the 31 swatches are photographed on curly and coily hair, because a shade reads differently there than on the straight hair most swatches use.
  3. Guidance comes before the upload. On "Add your photo", real example photos of what works and what to avoid replace a validation error after the fact.
  4. Before and after share one frame. On any result, press and hold: the original cross-fades in the same frame, so the hair is the only thing that moves. There is no slider to fiddle with.
  5. An honest wait. The generating screen shows the actual steps (reading your hair and face, matching the style to your hair, keeping your skin tone and background) and a time estimate, over a blurred copy of your own photo.
  6. Colour is a choice. "Keep mine / From style" sits on every style and on copied references, because the most common question is "but in my colour?"
  7. The visual language: a dark, editorial interface so the photographs carry the colour, a serif (Fraunces) for style names, a real photograph on every card, and one warm accent reserved for the next action.
  8. The paywall: a before-and-after hero on the same face, two plans with the annual per-week price, "Cancel anytime", and Terms, Privacy and Restore in plain view.
  9. Nothing to sign up for. You go from a selfie to a result without an account.

Who it helps

  • The people it's for. Black women, and anyone with type 3 to 4C hair, are regularly shown hairstyles on hair that isn't theirs, and beauty technology has historically worked worst on textured hair. The catalogue is photographed on every hair type from 1 to 4C, and colours are shown on curly and coily hair, so the person using it sees their own texture.
  • Money and time. Protective styles cost $150 to $400 and four to eight hours, and a style that doesn't suit you is expensive to undo. Two free looks let anyone check before paying.
  • Braiders and stylists. Many are independent, often home-based, businesses. Free client codes and a printable card let them show a client the exact style on the client's own face before a long appointment, so both agree on what they're making.
  • Privacy by design. There's no account. Photos are deleted within 72 hours and never used to train models, which matters for a community with good reason to be wary of face data.
  • Feasibility. It is live on the App Store today, a look costs a few cents to generate, and two looks are free for everyone.

Built With

Share this project:

Updates

Submission history