Personal project
Second Voice AI
Choose a literary voice. See exactly what changes.
- Built with
- Next.js · React · TypeScript · Supabase · Groq
- Context
- Independent product · 2026
Behind the interface
Architecture & tools.
The browser owns the writing experience. The server owns validation, provider access and the spending decision. A durable operation key connects a request to its result.
- Interface
Next.js · React · TypeScript · Tailwind CSS · Framer Motion
Typed interaction states, responsive writing surfaces and edit transitions.
- Request boundary
Next.js server routes · Zod · Supabase Auth
Validate input and session access before a generation can reach the provider.
- Data & AI
Supabase · PostgreSQL · Groq
Keep the budget ledger and idempotent operations durable. Provider credentials and model policy stay on the server.
- Verification
Playwright · axe-core · Node.js test runner · ESLint
Exercise the writing flow, accessibility, request concurrency and ledger behavior.
- 01
Compose
Draft, author and tone in React.
- 02
Validate
Check the session and request on the server.
- 03
Reserve
Atomically reserve budget in PostgreSQL.
- 04
Generate
Call Groq, then save the result for replay.
A repeated operation can replay a completed result. An interrupted provider request keeps its reservation until it can be reconciled, preventing an automatic retry from silently spending twice.
The challenge
A rewrite is easy to generate and surprisingly hard to trust. The writer needs to understand what changed, keep their original draft, and remain in control when a request is slow or fails.
Decisions that shaped the product
Prepared comparison
Change the cadence. Keep the facts.
Original
Every winter, the harbor lights went dark. Elias kept the last lamp burning, though no ship had returned in twenty years.
Tolkien · Balanced
Each winter, darkness settled over the harbor. Yet Elias kept the last lamp burning, though twenty years had passed since a ship returned.
Both examples retain Elias, the last lamp, the recurring winter darkness and the twenty-year absence. Highlighting comes from a word comparison.
Keep the original close.
The draft and rewrite sit side by side on wider screens. On phones, they stack in reading order so the source and result remain visible without a hidden tab.
The tradeoff. The stacked phone layout is longer, but the relationship between source and rewrite stays visible and inspectable.
Make the change the reward.
The portfolio compares the submitted draft and result word by word. Added or replaced text is highlighted, and the original remains inspectable. Each prepared example identifies its voice and strength.
The tradeoff. Animation describes a completed result; it never pretends to show model reasoning.
Account for a request before it spends.
The server reserves budget before dispatch, replays completed operation keys, and retains uncertain reservations when a provider response is interrupted.
The tradeoff. A timeout cannot automatically trigger another potentially billable generation.
The outcome
An implemented writing experience with a live deployment, explicit request state, and tested spending and privacy boundaries. The portfolio offers authored examples and a word-level comparison in a smaller editorial workspace.
Deployment is not the same as production readiness. Live rewriting depends on the service’s access and quota controls. The portfolio’s labelled sample is a written example; it does not generate arbitrary text.
Next case study
F24