A designer built a file-based context system for Claude Code that stores research synthesis, product metrics, stakeholder feedback, and design decisions in structured markdown, then automated recurring workflows with custom Skills. The result: a single command called /explore takes a problem ticket and produces data-grounded HTML prototypes without manual context reassembly each session. This is not visual generation or vibe-coded UI. It is AI doing the retrieval and reasoning work so the designer can focus on judgment.
The architecture is specific and replicable. A MEMORY.md file acts as a living index pointing Claude to the right document at the right time. A CLAUDE.md file customizes Claude Code behavior per project. Design tokens stored as CSS variables keep prototypes consistent with the real product. MCPs connect Linear, Figma, and Figma Console so live project context flows in without manual copy-paste. The designer runs Claude Code via Terminal in Cursor or Warp, watching every file the agent touches to catch hallucinations before they compound.
The full walkthrough uses Beacon, a fictional local discovery app, to demonstrate the setup end to end, from folder structure to prototype output. The GitHub repo is linked in the original. What makes this worth reading in full is not the conclusion but the Skills definitions, especially design-partner, and the specific MCP configuration decisions that took trial and error to get right.
[READ ORIGINAL →]