Design-MCP — Awwwards UI/UX Knowledge Base + MCP Server
An autonomous build: a data pipeline that cleans, chunks, tags, and embeds thousands ofpremium static websites into a vector database, plus a custom MCP server that lets anyAI coding agent semantically retrieve world-class UI components and adapt them into cleanReact + Tailwind.
How to run this project with Claude Code
This repo is set up to be built by an agent. Open it in Claude Code and type:
/start
The orchestrator reads .claude/state/progress.json,figures out the next incomplete phase, and dispatches the matching subagent. It loops:run phase → QA verifier gates it → mark done → next phase. Say /start again anytime toresume from where it stopped. Other commands: /status, /run-phase <n>, /verify.
Pipeline (one command, resumable)
npm install
cp .env.example .env # fill in keys
npm run pipeline # clean -> chunk -> tag -> embed -> upload
npm run server # start the MCP server on stdio
Architecture
Four phases, each owned by a dedicated subagent, gated by a QA verifier:
| Phase | Owner subagent | Output |
|---|---|---|
| 1. Clean + Chunk | data-pipeline-engineer |
clean component chunks |
| 2. Tag | data-pipeline-engineer |
.metadata.json per chunk |
| 3. Embed + Store | vector-db-engineer |
vectors in Mongo Atlas |
| 4. MCP Server | mcp-server-engineer |
search_premium_ui tool |
| —. Wire agent | integration-engineer |
client config + persona |
See docs/ARCHITECTURE.md for the full engineering blueprint andCLAUDE.md for the rules every agent follows.
Design principles
- Zero manual processing — no hand-cleaning of folders.
- Resumable + idempotent — every stage skips already-done work; re-runs are safe.
- Bounded concurrency — a worker pool (
src/lib/pool.ts) keepsmemory flat over thousands of files and respects LLM rate limits. - Adapt, don't copy — the agent rebuilds retrieved UI as modular React, never pastes.