Fix App That Looks Good But Does Not Work
The systematic recovery flow for beautiful-but-broken AI builds: audit honestly, then fix by functional priority.
Add this plan to a project to track work and checks.Open workspace
The route
6 steps to Done
- 01
Run a brutal functional audit
Get the honest map: what works, what is fake, what is broken.
Preview prompt + verify gate ▾Hide ▴
Audit this app feature by feature with zero optimism. For every feature/screen: perform its primary action for real, then refresh and check persistence. Classify each as WORKS (action real + persists), FAKE (UI responds but nothing real happens), or BROKEN (errors/dead). Produce the table: feature -> action tested -> observed result -> classification. Do not skip auth, forms, filters, or buttons in modals.
- ✓Every feature was action-tested, not eyeballed
- ✓Persistence checked with refreshes
- ✓The table covers all screens and modals
- 02
Prioritize the fix order
Fix what matters most first - the app's core promise.
Preview prompt + verify gate ▾Hide ▴
From the audit, produce a fix order. Rank FAKE and BROKEN items by: (1) is it the app's core value action, (2) does it block other features, (3) how visible is it to a new user. Output a numbered fix queue with a one-line fix plan per item (what real implementation is needed). Core value actions come first, cosmetics last.
- ✓Core value action is ranked first
- ✓Each item has a concrete fix plan
- ✓Cosmetic issues are ranked last
- 03
Fix the core value action
Make the single most important feature real, end to end.
Preview prompt + verify gate ▾Hide ▴
Implement fix #1 - the core value action - completely. Requirements: the real operation (backend endpoint, database write/read, state update) not a simulation; loading and error states; persistence proven by refresh; edge case handling for empty/invalid input. Show exactly what changed and demonstrate the working result with evidence.
- ✓The core action performs its real operation
- ✓Result survives refresh
- ✓Errors are visible on failure
- 04
Work through the fix queue
Convert every remaining FAKE and BROKEN item to WORKS.
Preview prompt + verify gate ▾Hide ▴
Work through the remaining queue in order. For each item: implement the real behavior, wire persistence, add loading/error states, then verify with the same action+refresh test used in the audit and update its classification. Report progress as an updated table after each batch. Do not mark anything WORKS without the refresh test.
- ✓Items fixed in priority order
- ✓Each verified via action + refresh
- ✓The table is updated with evidence per item
- 05
Add the missing states layer
Sweep the whole app for loading, empty, and error gaps.
Preview prompt + verify gate ▾Hide ▴
Do a states sweep across the app. Requirements: every async operation gets a loading indicator and a disabled trigger; every list gets an empty state; every failure path gets a visible UI error (no console-only); every form gets validation feedback. Output the list of gaps found and filled.
- ✓All async actions show loading
- ✓All lists have empty states
- ✓All failures render in the UI
- 06
Final honest re-audit
Close the loop with the same brutal audit that started it.
Preview prompt + verify gate ▾Hide ▴
Re-run the full functional audit from step 1 with identical rigor: every feature action-tested, refreshed, classified with evidence. The goal is zero FAKE and zero BROKEN. Include a two-account data isolation check if the app has users, and a 375px mobile pass on the main flows. Fix anything that fails and re-audit until clean.
- ✓Same rigor as the first audit
- ✓Zero FAKE or BROKEN remain
- ✓Mobile and isolation checks done