跳到主要内容

Agent Skill · v0.6.0 · MIT

# 把设计做出来,也把判断留下来。

Ultimate Design 是给 AI Agent 用的设计工作流:收到模糊需求时先理顺目标和内容,做完后对着真实渲染结果复查,最后把 DESIGN.md 契约留给下一位接手的人。

看它怎么工作

一次运行 · 五阶段

## Request Anchor

写清这次要解决什么、谁来用、什么不能丢。后续细节不能盖住原始诉求。

## Content contract

先排信息层级与必须准确的句子,再开版式。CONTENT.md 成为页面文案的唯一来源。

## Direction

选定色彩、字体、密度与参考策略,并写进 DESIGN.md 的 taste dials。

## Artifact

落到真实页面或材料,带上 data-ud-check 语义区,方便渲染审计对位。

## Rendered review

对着真实渲染修问题,把未解决风险写清楚,再交给下一位接手的人。

35

个知识概念

7

个知识域

19

份分支参考

11

个内置脚本

12

个完整案例

3

个宿主

为什么需要它

## 一张"看起来完成"的页面,往往只完成了一半。

画面做出来以后,真正的问题才露出来。

01

原始诉求被后续细节盖住了。

02

内容和版式一起开工,重要的话没有位置。

03

交付只剩截图,没人知道为什么这样取舍。

它留下什么

## 每一次运行,留下三件能继续用的东西。

Request Anchor

### 这次到底要解决什么

谁来用,什么不能丢。三行锚点记录把原始诉求钉住。

    Audience: agent developers evaluating install
    Job: judge capability in ~60s, then copy a command
    Must keep: countable inventory, bilingual switch

DESIGN.md

### 内容顺序与视觉方向

假设和待确认项写进契约,下一位接手的人不用猜。

    colors:
      primary: "#DF3A22"
      surface: "#10120E"
    taste: studio desk at night
    exceptions: Google Fonts for display only

Rendered review

### 对着真实页面复查

截图与批判发现成对出现,修完再交付。

    FINDING: hero claim competed with stat strip
    FIX: moved stats below the fold rule; claim dominates once
    STATUS: resolved before handoff

工作方式

## 先把事情说清,再把画面做对。

### 需求锚点条目

    - Original ask: showcase page like the reference site
    - Latest override: real demo gallery, six agent-designed pages
    - Success: name 3 outputs + 5 steps; copy install + prompt

### 信息层级清单

- 1. Claim + run record
- 2. Inventory proof
- 3. Method, library, range
- 4. Install and delivery

### Taste dials 摘要

    visual variance: 7
    information density: 6
    motion depth: 2
    brand distinction: 8
    direction: studio desk at night

### 带 data-ud-check 的片段

    <section data-ud-check='demo-gallery'>
      <!-- live iframe plates -->
    </section>

### 验证清单

- 契约校验 (strict contract)
- 渲染复查 (375 / 768 / 1440)
- 双语核对 (semantic parity)

知识库

## 35 个概念,按需加载,绑定到决策。

每个被激活的概念,都要绑定一条具体决策、一个制品目标和一条验证钩子;贡献结束就退场。

搜索知识库

54 项中的 54 项

没有匹配的条目。换个关键词,或清除筛选。

案例画廊

## 十二个完整页面,十二种设计语言。

每个案例都由安装了本技能的 Agent 按完整工作流设计——契约、实现、批判、渲染复查。缩略图是案例页的实时渲染(缩放的 iframe),不是截图;所有品牌均为虚构。

营销页 EN

### Finlytics

深色数据感

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

品牌官网 中文

### 山声茶事

东方编辑感

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

产品界面 EN

### TaskFlow

冷静系统感

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

预约落地页 中文

### 毛茸茸研究所

活泼圆润

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

HTML Deck 中文

### 2026 Q2 增长复盘

汇报叙事

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

作品集 EN

### GRID&NOISE

新粗野主义

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

会议活动 EN

### SYSTEMA

瑞士国际主义

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

电商产品页 EN

### Maison Ombre

静奢极简

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

硬件产品页 EN

### FIELD-7

工业功能主义

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

独立刊物 中文

### 街巷

新闻纸编辑

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

数据报告 中文

### 拾光书房

数据叙事

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

展览海报 中文

### 新厅美术馆

包豪斯几何

查看页面
看契约

由安装本技能的 Agent 设计,契约随附

模式与路线

## 默认直接做;要对齐时再对齐。

### 默认 (YOLO)

不盘问用户,从现有材料推断,先交出完整的第一版。

### --pro

受众、信息重点、品牌气质、验收标准先对齐,再开始做。

### Portable Specialist

多域高风险工作时,Integrator 分发工单,专家返回结果包,最终制品只有一个执笔人。

- Build 做出来
- Audit 只诊断
- Redesign 保内容换结构
- Study 提取可迁移机制

怎么开始

## 装进宿主,再说你要的结果。

    npx ultimate-design-skill@latest --target codex

    npx ultimate-design-skill@latest --target claude-code

    npx ultimate-design-skill@latest --target pi-agent

### 普通模式

    $ultimate-design 帮我把这份研究做成一个便于阅读的网页。先处理内容和设计方向,再实现、复查并修掉明显问题。

### --pro 模式

    $ultimate-design --pro
    我要做一个面向投资人的产品官网。先和我确定受众、信息重点、品牌气质和验收标准,再开始实现。

交付时看什么

## 交出去的,不只有一个链接。

- 需求和取舍写在 DESIGN.md。
- 参考资料有来源和用途。
- 页面、幻灯片或图形按实际尺寸检查过。
- 未解决的风险被如实写下。

去 GitHub 看仓库

本页由 Ultimate Design 的方法自举完成:契约在 docs/DESIGN.md,内容源在 docs/CONTENT.md,交付前经过契约校验与浏览器渲染复查。

docs/DESIGN.md · docs/CONTENT.md