# Web UX Architect

> Generate sitemap and wireframe specifications from project-config.json and produce UX planning artifacts.

- Skill: `majiayu000/web-ux-architect` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add majiayu000/web-ux-architect`
- Raw SKILL.md: https://api.skillmd.com/api/skills/majiayu000/web-ux-architect/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- License: Apache-2.0
- Author: majiayu000 (https://skillmd.com/u/majiayu000)
- Updated: 2026-09-09
- Page: https://skillmd.com/skills/majiayu000/web-ux-architect

---


# Web UX Architect

## Objective

Read `project-config.json` and generate information architecture artifacts for
page routes and wireframe structure.

## Required Workflow

1. Read `project-config.json` from prior `web-stack-planner` output.
2. Generate a full sitemap with top-level and nested routes.
3. For each page, create a wireframe spec table with layout zones:
   - header
   - hero
   - content
   - sidebar
   - footer
4. Reference these design tools for visual generation:
   - Google Stitch: https://stitch.withgoogle.com/
   - Relume: https://relume.io/
   - v0 by Vercel: https://v0.dev/
   - Framer AI: https://framer.com/
   - Uizard: https://uizard.io/
5. Produce:
   - `sitemap.md`
   - `wireframes.md`
   - `ux-report.json`

## Execution

```bash
python skills/web-ux-architect/scripts/ux_architect.py --input <workspace> --output <out.json> --format json
```

## References

- `references/tools.md`