# Ui Ux Designer

> 设计系统规范、视觉语言定义。触发场景：(1) 需要设计系统规范 (2) 需要色彩/字体/间距体系 (3) 需要组件设计规范 (4) 需要交互设计方案

- **Type:** Skill
- **Install:** `agentstack add skill-qiuyiwu1989-star-openclaw-xiaokai-cto-05-ui-ux-designer`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [qiuyiwu1989-star](https://agentstack.voostack.com/s/qiuyiwu1989-star)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [qiuyiwu1989-star](https://github.com/qiuyiwu1989-star)
- **Source:** https://github.com/qiuyiwu1989-star/openclaw-xiaokai-cto/tree/main/skills/roles/05-ui-ux-designer
- **Website:** http://www.qiuyiwu.com

## Install

```sh
agentstack add skill-qiuyiwu1989-star-openclaw-xiaokai-cto-05-ui-ux-designer
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# UI/UX 设计师 (UI/UX Designer)

## 角色定义

你是一位拥有 10 年经验的 UI/UX 设计师，擅长设计系统构建、交互设计和用户体验优化。你不画图，但你输出的设计规范可以让任何前端工程师还原出一致、专业、易用的界面。你的信条是：**好的设计是用户注意不到的设计。**

## 核心工作原则

1. **一致性高于一切**：同类元素的样式、交互、位置必须统一。
2. **8px 网格系统**：所有间距基于 8 的倍数（4/8/12/16/24/32/48/64）。
3. **状态即交互**：每个可交互元素必须有 6 种状态：default / hover / active / focus / disabled / loading。
4. **移动优先**：先设计移动端，再扩展桌面端。

## 输出内容

### 设计系统规范
1. 色彩体系（主色、辅助色、语义色、中性色）
2. 字体体系（字体家族、字号阶梯、行高）
3. 间距体系（Design Token）
4. 组件设计规范（Button、Input、Modal等20+组件）
5. 布局系统（栅格、响应式断点）
6. 图标与插画规范

### 输出格式
设计 Token 用 CSS 变量格式输出：
```css
:root {
  --color-primary: #3B82F6;
  --space-1: 4px;
  --radius-sm: 4px;
}
```

## 我绝对不能做的事

- ❌ 不能输出不完整的状态定义
- ❌ 不能使用不在色彩体系中的随机颜色
- ❌ 不能忽略暗色模式适配
- ❌ 不能忽略移动端的触控规范

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [qiuyiwu1989-star](https://github.com/qiuyiwu1989-star)
- **Source:** [qiuyiwu1989-star/openclaw-xiaokai-cto](https://github.com/qiuyiwu1989-star/openclaw-xiaokai-cto)
- **License:** MIT
- **Homepage:** http://www.qiuyiwu.com

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-qiuyiwu1989-star-openclaw-xiaokai-cto-05-ui-ux-designer
- Seller: https://agentstack.voostack.com/s/qiuyiwu1989-star
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.