ui-design

Design practical user interfaces, flows, information architecture, layout systems, component states, and design tokens.

IndexedMIT★ 1

Install

Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.

npx agentmarket install skill/paishu-ai-ui-design

Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.

Get the weekly diff

The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.

About

Design practical user interfaces, flows, information architecture, layout systems, component states, and design tokens. Use for page design, UX redesign, dashboards, tools, mobile/web UI, interaction design, and before frontend implementation when visual or workflow decisions matter.

Use cases: design, frontend, productivity

Reviews

Write a review

No reviews yet. Installed it? Reviews come from verified installers only. How reviews work

Permissions

What this skill can do and what it asks for, from its SKILL.md. Checked Oct 25, 2026.

Tools: No tools found
Secrets: None asked for
Install scripts: None found

Network hosts it talks to 1

codeload.github.com · found in install command

Files it touches

~/.claude/skills/ui-design

What's inside

Skill name: ui-design
Description: Design practical user interfaces, flows, information architecture, layout systems, component states, and design tokens. Use for page design, UX redesign, dashboards, tools, mobile/web UI, interaction design, and before frontend implementation when visual or workflow decisions matter.
License: MIT
Instructions: 29 lines in SKILL.md · view on GitHub

Agent Skills spec issues

name: "ui-design" does not match folder "02-ui-design"

Files (1)

SKILL.md

SKILL.md (first lines)

# UI Design

## Workflow

1. Identify the primary user, job-to-be-done, and main workflow.
2. Define information hierarchy before visual treatment.
3. Specify layout, navigation, components, and interaction states.
4. Cover loading, empty, error, disabled, permission-limited, and success states.
5. Map responsive behavior across mobile, tablet, and desktop.

## Quality Bar

- Match the product type: tools and dashboards should be dense, calm, and scannable; marketing pages may be expressive.
- Use design tokens for color, spacing, type, radius, shadow, and motion.
- Do not rely on generic "modern" language; specify concrete UI decisions.
- Prefer familiar controls: tabs, segmented controls, switches, sliders, menus, and icon buttons where appropriate.
- Avoid decorative card-heavy layouts unless cards represent repeated items or framed tools.

## Handoff

Provide component hierarchy, key states, responsive rules, and implementation notes. Mention accessibility and i18n risks when they affect the design.

## Output Contract

- State the selected workflow, assumptions, and concrete deliverable.
- Include verification, limitations, or next-step handoff when relevant.
- If tool output, files, deployments, scans, or external actions are claimed, cite the command/tool evidence.

From PAISHU-AI/PAI-zong-NB-v5.8, MIT.

Signals

Stars: 1
Forks: 1
Open issues: 0
Last commit (this folder): Jul 18, 2026 (3 months ago)

From GitHub (fetched Oct 24, 2026).

Details

License: MIT
Repository: github.com/PAISHU-AI/PAI-zong-NB-v5.8
First seen: Oct 24, 2026
Last checked: Oct 24, 2026
Source: GitHub github-graphql

More from PAISHU-AI

Cite this page

ui-design skill. Agent Mart. https://agentmart.dev/skills/paishu-ai-ui-design (last updated 2026-10-24)