Inspiration

"A little shorter" can mean different things to a customer and a stylist. A mirror or reference photo does not resolve that uncertainty for someone who cannot inspect it visually. We wanted to make the decision understandable before the haircut starts.

Before the Cut is designed for blind and low-vision adults. The customer decides what matters: length, fringe, ear coverage, color, texture, upkeep and how the stylist should communicate. Their instructions stay central throughout the consultation.

What it does

The app combines real YouCam hairstyle previews with a written salon plan. The recorded example has three outputs on a fictional portrait. Each has a reviewed description that uses familiar landmarks such as ears, jaw, forehead and shoulders. Customers can read it, use their screen reader or press Listen.

The example also calls out differences between the preview and the customer's preferences. A bob adds a fringe despite a no-fringe preference. A shoulder cut exposes ears that the customer wants covered. Choosing either picture as a reference never overwrites those instructions.

The customer reviews and approves one exact version of the plan. If a stylist changes shoulder length to jaw length, the app clears that approval and presents the old and new instructions together. A stylist can propose changes through a plan-only link but cannot approve on the customer's behalf. The customer can download a plain-text brief with its version and approval status.

How we built it

YouCam Hair Style Virtual Try-On v2.1 generates the hairstyle previews. The server uploads the permitted photo, submits the selected template, polls the task and serves the result through an owner-checked route. The three sample outputs are unchanged real API results; the repository includes their template IDs, task references and image hashes.

The app uses React, TypeScript and Vinext on Cloudflare Workers, with D1 for consultation state and R2 for images. Plan updates use revision checks so a stale browser cannot silently replace a newer plan. Preview requests reserve units before the provider call, deduplicate repeated requests and respect a fixed demo allowance.

Keyboard controls, labeled fields, optional read-aloud, larger text and higher contrast are part of the consultation. Stylist links expire after 24 hours, can be revoked and do not grant photo access.

We implemented this application with the help of Codex.

Challenges we ran into

A hairstyle template name is not a reliable description of the generated image. The actual bob included a fringe, and another result exposed the ears. We inspected the outputs and described those visible changes instead of reading a template label as if it were the result.

Automatic descriptions for new uploads need a separate vision-service connection. That connection is optional and is not enabled in this deployment. The app says so and keeps the recorded example available. It never substitutes a sample description for a personal result. A stylist can describe a new result during the consultation.

The other hard part was preserving approval correctly. Selecting a reference, editing a detail or reverting an earlier edit must require review whenever the plan changes. We tied approval and stylist read-back to the exact revision rather than a permanent checkbox.

Accomplishments that we're proud of

The working prototype keeps the customer's written choices intact even when a generated picture differs. A later edit visibly removes the earlier approval. The output is a versioned salon brief that the customer and stylist can discuss before cutting.

Ten domain tests and twenty HTTP checks passed. They cover approval changes, repeated edit/revert cycles, stale writes, role restrictions, session separation, link revocation, photo permission and removal. We also checked the Chrome keyboard flow and completed live YouCam generation, including a new request on the hosted app for this demo. The public repository's verification workflow passed.

What we learned

Generating an attractive hairstyle is only one part of the decision. The useful question is whether the customer understands the difference and agrees to the actual instructions. Descriptions need uncertainty, and approval needs a version.

What's next

Test with blind participants and professional stylists. Can a participant compare the options, notice a shoulder-to-jaw edit and correct or reject it without sighted help? Evaluate the wording, camera setup, screen-reader behavior and a wider range of hair textures. Connect and evaluate automatic image comparison before claiming independent use for new photos.

This is a communication prototype. We have not completed blind-user or stylist testing, and we do not claim haircut accuracy, adoption, measured time savings or accessibility certification. A simulation cannot establish shrinkage, feasibility or maintenance.

Try it

What we learned

What's next for Before the Cut

Built With

Share this project:

Updates

Submission history