Agent-Skills-Hub web-ux-architect

Name: web-ux-architect
Author: 0x-Professor

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

install

source · Clone the upstream repo

git clone https://github.com/0x-Professor/Agent-Skills-Hub

Claude Code · Install into ~/.claude/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/0x-Professor/Agent-Skills-Hub "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/web-ux-architect" ~/.claude/skills/0x-professor-agent-skills-hub-web-ux-architect && rm -rf "$T"

manifest: skills/web-ux-architect/SKILL.md

source content

Web UX Architect

Objective

Read

project-config.json

and generate information architecture artifacts for page routes and wireframe structure.

Required Workflow

Read
```
project-config.json
```
from prior
```
web-stack-planner
```
output.
Generate a full sitemap with top-level and nested routes.
For each page, create a wireframe spec table with layout zones:
- header
- hero
- content
- sidebar
- footer
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/
Produce:
- ```
sitemap.md
```
- ```
wireframes.md
```
- ```
ux-report.json
```

Execution

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

References

```
references/tools.md
```