Crystal - Instagram Carousel Creator

Crystal went from a Notion brief to a working Beta in about seven weeks, from early August to the end of September 2026. It turns camera-roll photos and one line of context into a finished Instagram carousel.

I led it end to end: research, flows, UX and UI, and the build itself, working with Claude Code.

The work ran in five stages, each one feeding the next and being rewritten by it:

Groundwork in Notion — problem, desk research, competitors, personas, brief, kill criteria.

Flows in FigJam — eight user flows with their branches, drop-offs and edge states.

Wireframes — greyscale screens to settle hierarchy and one-handed reach.

Hi-fi designs — 55 screens across eight flows, 21 of them edge or error states.

Prototyping with Claude Code — from a pipeline prototype to a SwiftUI app with a real backend. The name changed twice on the way: Roll, then Ketchup, then Crystal.

Notion held the project record from day one, and it still does. I used my standard project template: problem, research, competitors, personas, ideation, brief, style, flows, wireframes, testing, deliverables.

• Problem. Solo creators know they should post consistently, but every carousel means opening a design tool and making thirty small decisions. So they post irregularly, and nothing looks like the same brand.

• Success, stated up front. Photos to a posted, on-brand carousel in under 90 seconds — and again the next week without being prompted.

• Desk research, labelled as desk research. Competitor teardowns, App Store reviews and category reading. No primary research yet, and the page says so, so it isn't mistaken for validated insight.

• The gap. Text-first AI generators (PostNitro, Predis) own brand consistency but ignore your photos. Photo-first apps (SCRL, Inrousel) own your photos but forget your brand. Nobody holds both.

• Personas and jobs to be done. Six segments, four JTBD statements, with solo business creators posting weekly as the target and photo-dumpers as the free tier.

• Brief. Positioning, free vs paid, MVP scope, pricing and known risks.

Before drawing a single screen, I mapped every journey in FigJam: where it starts, where it branches, and where people are likely to drop off. The same map was written up as FLOWS.md in the repo.

Greyscale wireframes fixed the structure before any colour or photo could distract from it.

The visual language started as a first pass in Claude Design, whose token section became design.md in the repo. I then refined the screens in Figma against those tokens.

I prototyped in code from the second week, because the riskiest question — are the slides good enough to post? — could only be answered by real output on real photos. Claude Code did the typing; I owned the architecture, the design rules and the judgement calls.

Scripts for TestFlight builds, signing, App Store Connect and an App Store review account, plus a Next.js waitlist site at mycrystal.app. The repo carries its own design documentation — FLOWS.md, SCREENS.md and design.md — so every build decision points back to a flow, a screen ID or a token.