50 Popular Apps Reverse-Engineered into Claude-Readable Design Specs: Key Patterns for UI Cloning
u/meliwat spent weeks reverse-engineering 50 popular apps into structured markdown design specs and fed them to Claude to rebuild the UIs. The difference between near-perfect clones and drifting outputs came down to a few concrete practices observed at volume.
What Made Claude Nail UI Clones
- Exact values, not ranges.
#1A1A1Aworks. "dark gray" produces five different grays across five screens. - State coverage up front. Listing every state (empty, loading, error, filled) stopped Claude from inventing its own.
- Spacing as a scale, not per-element pixels. A 4/8/16/24 spacing system produced more consistent layouts than annotating every gap.
- Navigation as a graph. Explicit screen-to-screen transitions killed the "where does this button go" guessing.
What Didn't Help
Longer prose. Past a point, more words made the output worse, not better. Keep specs concise.
Available Resources
The entire collection is open-sourced on GitHub at github.com/Meliwat/awesome-ios-design-md. Each app ships with 3 spec depths: quick reference, standard build, or full pixel-level clone. All markdown, MIT license, no dependencies.
Community Question
The author asks: if you've done UI cloning with Claude, what patterns have you found that are missing from this list? Which apps are worth adding next?
📖 Read the full source: r/ClaudeAI
👀 See Also
Quick-Question Plugin Automates Unity Development with Claude Code
A developer has released quick-question, a macOS plugin for Unity 2021.3+ that automates compilation, testing, and cross-model code review when using Claude Code. The tool includes 20 slash commands and uses a 'Tribunal' pattern where Codex and Claude review each other's findings.
IronBee: Open-source verification layer for Claude Code and Cursor
IronBee is an open-source verification layer that forces AI coding agents to test changes in a real browser before completing tasks. In testing, it caught bugs in 82% of Claude Code sessions that would have shipped without verification.
MCP as Observability Interface: Connecting AI Agents to Kernel Tracepoints
The Model Context Protocol (MCP) is emerging as the interface between AI agents and infrastructure telemetry, with Datadog shipping an MCP server and Qualys flagging security concerns. The article explores two approaches: wrapping existing platforms or building MCP-native observability that connects directly to kernel tracepoints.
SkyClaw Adds Encrypted Chat-Based API Key Setup for AI Agents
SkyClaw implements AES-256-GCM encrypted key ingestion through chat, intercepting key commands at the system layer so the LLM never sees API keys and using one-time key encryption so messaging platforms only see ciphertext.