gsd-ui-review
Executes a structural visual review of frontend code against six quality pillars.
Install
mkdir -p .claude/skills/gsd-ui-review && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/12873" && unzip -o skill.zip -d .claude/skills/gsd-ui-review && rm skill.zipInstalls to .claude/skills/gsd-ui-review
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Retroactive 6-pillar visual audit of implemented frontend codeKey capabilities
- →Conduct a retroactive 6-pillar visual audit
- →Produce UI-REVIEW.md
- →Assess implemented frontend code
- →Grade visual quality per pillar
- →Work on any project
How it works
This skill performs a retroactive 6-pillar visual audit of implemented frontend code and generates a UI-REVIEW.md document with a graded assessment.
Inputs & outputs
When to use gsd-ui-review
- →Review frontend visual quality
- →Perform UI audit
- →Validate UI implementation
- →Check frontend standards
About this skill
<codex_skill_adapter>
A. Skill Invocation
- This skill is invoked by mentioning
$gsd-ui-review. - Treat all user text after
$gsd-ui-reviewas{{GSD_ARGS}}. - If no arguments are present, treat
{{GSD_ARGS}}as empty.
B. AskUserQuestion → request_user_input Mapping
GSD workflows use AskUserQuestion (Claude Code syntax). Translate to Codex request_user_input:
Parameter mapping:
header→headerquestion→question- Options formatted as
"Label" — description→{label: "Label", description: "description"} - Generate
idfrom header: lowercase, replace spaces with underscores
Batched calls:
AskUserQuestion([q1, q2])→ singlerequest_user_inputwith multiple entries inquestions[]
Multi-select workaround:
- Codex has no
multiSelect. Use sequential single-selects, or present a numbered freeform list asking the user to enter comma-separated numbers.
Execute mode fallback:
- When
request_user_inputis rejected (Execute mode), present a plain-text numbered list and pick a reasonable default.
C. Task() → spawn_agent Mapping
GSD workflows use Task(...) (Claude Code syntax). Translate to Codex collaboration tools:
Direct mapping:
Task(subagent_type="X", prompt="Y")→spawn_agent(agent_type="X", message="Y")Task(model="...")→ omit (Codex uses per-role config, not inline model selection)fork_context: falseby default — GSD agents load their own context via<files_to_read>blocks
Parallel fan-out:
- Spawn multiple agents → collect agent IDs →
wait(ids)for all to complete
Result parsing:
- Look for structured markers in agent output:
CHECKPOINT,PLAN COMPLETE,SUMMARY, etc. close_agent(id)after collecting results from each agent </codex_skill_adapter>
<execution_context> @D:/code/Project/tablez-demo2-allByAi/.codex/get-shit-done/workflows/ui-review.md @D:/code/Project/tablez-demo2-allByAi/.codex/get-shit-done/references/ui-brand.md </execution_context>
<context> Phase: {{GSD_ARGS}} — optional, defaults to last completed phase. </context> <process> Execute @D:/code/Project/tablez-demo2-allByAi/.codex/get-shit-done/workflows/ui-review.md end-to-end. Preserve all workflow gates. </process>When not to use it
- →When `request_user_input` is rejected in Execute mode and a default cannot be picked
Limitations
- →Codex has no `multiSelect` for user input
- →Model selection is per-role configuration, not inline
How it compares
This workflow provides a structured, graded visual audit across six pillars, which differs from a manual or ad-hoc review process.
Compared to similar skills
gsd-ui-review side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| gsd-ui-review (this skill) | 0 | 4mo | No flags | Beginner |
| visual-verdict | 0 | 3mo | No flags | Intermediate |
| paper-parity | 0 | 3mo | No flags | Intermediate |
| verify-bulk-action-bar | 0 | 3mo | Review | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
More by AdityaArote
View all by AdityaArote →You might also like
visual-verdict
xz1220
截图与参考图对比的结构化视觉 QA 判定
paper-parity
GLaDO8
Use when comparing or recreating this repo's UI in Paper MCP and fixing parity issues against the live rendered site.
verify-bulk-action-bar
junnv93
BulkActionBar 패턴 SSOT 검증 — count chip aria-live, role=toolbar, Esc clear, indeterminate Radix, focus management, IME guard. 일괄 작업 UI 변경 시 트리거. canonical = components/common/BulkActionBar.tsx (도메인 무관 generic), components/approvals/BulkActionBar.tsx는 approvals 특화 wrapper.
campusway-frontend-quality
md-muntasir-shihab
CampusWay frontend quality workflow for Vite React and Tailwind with optional Next.js surface. Use when: improve UI, refactor components, fix layout, optimize bundle, enforce design consistency, prepare frontend PR.
preview-data-generator
rshankras
Generate sample data and a multi-variant #Preview matrix for SwiftUI views — empty/loading/error/loaded states, light/dark, Dynamic Type, locales/RTL, and devices. Use when the user says "add previews", "sample data for previews", "preview my view in different states", "preview data", "prototype thi
ui-ux-pro-max
nextlevelbuilder
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient.