Keystack · tenant app · matched to the live staging build

Keystack, as a new tenant actually finds it.

Every screen here was rebuilt against keystack-web-staging.vercel.app — I signed up, walked all seven surfaces, and copied the real labels, states and numbers out of the running app. Not the ideal product, not the old mocks. Where the build is blocked, the mock is blocked.

The honest first-run story is short: you sign up, you hire, and then you hit two walls. Those walls are the majority of a new tenant's experience right now, so they are designed here as first-class screens rather than error states.

The two walls
Wall 1 — pending_approval

Every agent you hire lands in pending_approval. Only an EmuBrain operator can clear it, on emubrain.com — a surface the family cannot reach. Nothing in the tenant app moves it.

Wall 2 — provider_not_connected

A brand-new org has both providers disconnected. Four of the five agents need Anthropic, one needs OpenAI. Chat fails until the right key is connected. This wall the family can clear themselves.

The flow, screen by screen
01 · SIGN UP

Sign uplight theme — the real signed-out screen

The five fields staging actually requires: organisation name, your name, email, password, confirm. Any one missing and it rejects. You are returned signed in immediately — email verification does not block use. Toggle the rejected state to see the validation.

Open →
02 · TEAM · WHERE YOU LAND

Your teamthe real numbers a new org sees

Service OK, 5 available agents, 0 hired, 0 work orders, and "No agents hired yet." Both walls are stated here up front, because a new owner should learn what stands between them and a working agent on the page they land on — not three clicks later.

Open →
03 · CATALOGUE · HIRE → WALL 1

Catalogue — the five archetypeshire one and watch the first wall appear

Exactly the five staging serves, with their real providers: Project Coordinator, Code Reviewer / QA, Researcher and Content & Marketing on anthropic; Software Engineer on openai. Press Hire and the agent lands in pending_approval, with the operator surface named.

Open →
08 · ACCOUNT · WALL 2

AI connectionsboth providers not_connected

The second wall, and the one the family can actually clear. Toggle "Anthropic connected" to see which agents come unblocked — and which still don't.

Open →
07 · CHAT · BOTH WALLS AT ONCE

Agent chatprovider_not_connected

Where the two walls meet. The real failure, the real status line, and a preview of what the same screen looks like once it's unblocked.

Open →
04 · TASKS

Taskswork orders

The real form — title, request, priority, agent. The Agent select has nothing in it but "Unassigned", because nothing is hired or approved yet.

Open →
05 · CHILDREN

Children"No child profiles yet."

Profiles, assigned agents and child spaces — empty on day one.

Open →
06 · GALLERY

Galleryoutputs

Nothing can appear here until a work order is completed by an approved agent — which needs both walls cleared first.

Open →
How this was grounded

Walked, not guessed

I opened staging behind the 2026 gate, created a real account, and toured all seven surfaces in the running app: Team, Catalogue, Tasks, Children, Gallery, Chat, Account. Copy, field labels, empty-state sentences, status wording and the stat numbers are taken from what the app rendered, not from an earlier mock or a spec.

Two things worth knowing about the current build's own presentation, found while walking it: the signed-out screens are light and the signed-in app is dark — the body still computes the light token set while the shell paints dark, which is the theme-token mismatch flagged in the earlier visual audit. And on the live catalogue, all five agent cards reuse the same two stock portraits (three share one, two share the other), which reads as a bug rather than a roster. I've used neutral monograms here instead of repeating that.

Flags