huashu-design SKILL.md skillA

huashu-design from mxyhi/ok-skills is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.

Install it, pinned
mdr add mxyhi/ok-skills/huashu-design@v3.0.0

Pins v3.0.0 in mdr.lock. Pin the fingerprint instead.

Audit grade
A, 17 of 17 checks passed
Kind
SKILL.md skill
Repository
mxyhi/ok-skills
Path
huashu-design/SKILL.md
Versions recorded
7
Latest version
v3.0.0, committed Oct 18, 2026
First version recorded
Jun 7, 2026
Size
15,558 bytes
Repository stars
504
License
Apache-2.0

花叔Design——用HTML做高保真原型、幻灯片、动画、可视化与专家评审。任何新设计100%先出三个方向初稿给用户选(指定风格/品牌也不豁免),选定后才执行。触发词:做原型、PPT、幻灯片、动画、设计风格、评审、做个HTML页面、UI mockup、导出MP4/GIF、做个好看的。生产级Web App/需后端的系统不适用。.

Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.

What the file says

# 花叔Design · Huashu-Design

## 你是谁

**你是设计师,不是写HTML的程序员。** HTML只是你的媒介,就像别人用Figma、
用AE、用InDesign——工具不定义你,交付标准才定义你。

那个标准是:**产出要让人认不出是AI做的。** 不是「AI做得还行」,
是别人看到会问「这哪个工作室做的」。你有能力达到——现在的模型可以调用任何一位
顶尖设计师、任何一家顶级工作室积累的方法和品味,**限制通常不在能力,
在于有没有先认定自己要做到那个水准**。

还有一件事要先认清:**你有自己的默认审美。** 不加约束时你会滑向暖奶油底、高反差衬线标题、
陶土色点缀、全大写小标签、01/02/03 编号——那是 Claude 自己的配色,也是 2026 年 AI 生成页面
最常见的几类样子之一。它本身不丑,但它和题材无关地出现,所以读起来就是「AI 做的」。
每一次都要从题材里重新长出设计,而不是回到这个家。

### 你不是一个人,是一个工作室

| 角色 | 他负责什么 | 缺了会怎样 |
|---|---|---|
| **艺术总监** | 定方向、判品味、砍掉不够好的 | 做出「都还行」的平庸作品 |
| **品牌研究员** | 找到真实资产(logo/产品图/UI),理解品牌气质 | 凭想象画品牌,一眼假 |
| **视觉设计师** | 版式、色彩、字体、层级 | 元素堆在一起,没有秩序 |
| **动效设计师** | 时间、缓动、节奏 | 动画生硬,像PPT切换 |
| **前端工程师** | 把设计精确实现出来 | 稿子好看,做出来走样 |
| **文案** | 每一句话都为设计服务 | 用 Lorem ipsum 或「标题文字」占位交付 |

**媒介变了,主导角色就要换**——做幻灯片时别像网页,做动画时别像Dashboard,
做App原型时别像说明书。开工前先想清楚:这次谁主导。

### 你可以想多久

**想多久都行。** 设计的质量高度依赖探索的广度——你在脑子里过了多少个方案、
否掉了多少个,直接决定最后那个有多好。「One thousand no's for every yes」:候选要多,交付要少。

## 适用范围

用 HTML 做视觉产出:交互原型、设计变体探索、1920×1080 的 HTML deck、时间轴驱动的动画与视频、
信息图与可视化。生产级 Web App、SEO 网站、需要后端的系统不走本 skill。

## 开工三件事(每个设计任务都做,几秒钟)

下面所有命令里的 `$HD` 是**本 skill 的根目录**(这份 SKILL.md 所在的目录),不是用户的项目目录——
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add mxyhi/ok-skills/huashu-design@sha256:63cbc2ffcfd99f7b

The line at the top of this page pins the label v3.0.0, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.

Badge

mdr badge

[![mdr](https://markdownregistry.com/badge/art_s5eltmuecj3peuoj.svg)](https://markdownregistry.com/a/art_s5eltmuecj3peuoj)

6 badge image fetches in 30 days. What the badge shows.

Versions

The registry has recorded 7 versions of this file, between Jun 7, 2026 and Oct 18, 2026, about one every 22 days. Its first recorded version is graded B and its latest A.

versioncommittedcommitsizeaudit
v3.0.0 latest2026-10-18 91a194f 15,558 BA view · diff
git:20260918.7933c152026-09-18 7933c15 65,262 BB view · diff
git:20260831.85325692026-08-31 8532569 64,048 BB view · diff
git:20260815.7a428622026-08-15 7a42862 61,576 BB view · diff
git:20260723.3b299db2026-07-23 3b299db 59,229 BB view · diff
git:20260706.087b8692026-07-06 087b869 53,731 BB view · diff
git:20260607.4701b762026-06-07 4701b76 62,359 BB view

Audit of the latest version

A  17 of 17 checks passed. Fixed automatic checks with no AI involved, so the same checks give the same answer every run.
  • pass: Frontmatter block present
  • pass: Frontmatter declares a name
  • pass: Frontmatter declares a description
  • pass: Size between 200 bytes and 200 KB (15558 bytes)
  • pass: No zero-width or bidi control characters
  • pass: No instruction hidden inside an HTML comment
  • pass: No link to an exfiltration or paste host
  • pass: No credential-shaped string
  • pass: No instruction to send local credentials anywhere
  • pass: No text hidden with inline styles
  • pass: No prompt-injection phrasing
  • pass: No curl or wget piped into a shell
  • pass: No recursive delete of root, home or parent
  • pass: No instruction to read or print local credentials
  • pass: No base64 blob over 200 characters
  • pass: No link to a raw IP address
  • pass: No script tag

Source

GitHub

mxyhi/ok-skills · 504 stars · license Apache-2.0 · pushed 2026-10-18 · branch main

API

GET https://markdownregistry.com/api/v1/artifacts/art_s5eltmuecj3peuoj
GET https://markdownregistry.com/api/v1/resolve?ref=mxyhi/ok-skills/huashu-design
GET https://markdownregistry.com/api/v1/blob/63cbc2ffcfd99f7b8acb6ff92adbbbba4bfaeec84373703d81df6a6fc6055a23

Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.

Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.

More from mxyhi/ok-skills

AGENTS.md AGENTS.md file
mxyhi/ok-skills · AGENTS.md
git:20260925.7de4640 · audit A · 504 stars
agent-browser SKILL.md skill
mxyhi/ok-skills · agent-browser/SKILL.md · Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages…
git:20260831.972d952 · audit A · 504 stars
ai-elements SKILL.md skill
mxyhi/ok-skills · ai-elements/SKILL.md · Build AI chat interfaces using ai-elements components — conversations, messages, tool displays, prompt inputs, and…
git:20260314.07e5678 · audit A · 504 stars
autoresearch SKILL.md skill
mxyhi/ok-skills · autoresearch/SKILL.md · Autonomous iteration loop: modify, verify, keep/discard against any metric
v2.2.2 · audit A · 504 stars
ax SKILL.md skill
mxyhi/ok-skills · ax/SKILL.md · Use the ax CLI instead of curl + throwaway parsing scripts whenever you fetch a URL, explore an unknown web page, or…
git:20260731.b493166 · audit A · 504 stars
better-icons SKILL.md skill
mxyhi/ok-skills · better-icons/SKILL.md · Use when working with icons in any project. Provides CLI for searching 200+ icon libraries (Iconify) and retrieving…
git:20260415.87a17fa · audit A · 504 stars
bopomofo-rescue SKILL.md skill
mxyhi/ok-skills · bopomofo-rescue/SKILL.md · Detect and recover text that was accidentally typed with the Taiwanese Bopomofo / Zhuyin (注音) keyboard while the input…
git:20261018.2c986bf · audit A · 504 stars
browser-trace SKILL.md skill
mxyhi/ok-skills · browser-trace/SKILL.md · Capture a full DevTools-protocol trace of any browser automation — CDP firehose, screenshots, and DOM dumps — then…
git:20260517.ccd356a · audit A · 504 stars
codebase-design SKILL.md skill
mxyhi/ok-skills · codebase-design/SKILL.md · Shared vocabulary for designing deep modules. Use when the user wants to design or improve a module's interface, find…
git:20260831.e7f2564 · audit A · 504 stars
deep-research SKILL.md skill
mxyhi/ok-skills · deep-research/SKILL.md · Professional deep research report generation — multi-agent collaboration with parallel chapter writing, automatic…
v6.0.0 · audit A · 504 stars
diagnosing-bugs SKILL.md skill
mxyhi/ok-skills · diagnosing-bugs/SKILL.md · Diagnosis loop for hard bugs and performance regressions. Use when the user says "diagnose"/"debug this", or reports…
git:20261009.b4e20e9 · audit A · 504 stars
domain-modeling SKILL.md skill
mxyhi/ok-skills · domain-modeling/SKILL.md · Build and sharpen a project's domain model. Use when discussing codebase terminology, writing or editing a GLOSSARY.md…
git:20260930.4ade426 · audit A · 504 stars

Every file in mxyhi/ok-skills

Other files named huashu-design

huashu-design SKILL.md skill
hhu3637kr/skills · huashu-design/SKILL.md · 当用户需要用 HTML 交付高保真视觉产出时使用:交互原型、设计 Demo、HTML 幻灯片、动画 Demo、设计变体、移动应用 mockup、可视化、导出 MP4/GIF,或请求设计风格、配色、视觉方向、设计评审。不要用于生产级 Web…
git:20260616.4e81a9c · audit B · 146 stars
huashu-design SKILL.md skill
tekkiiiii/the-agency · skills/huashu-design/SKILL.md · 花叔Design(Huashu-Design)——用HTML做高保真原型、交互Demo、幻灯片、动画、设计变体探索+设计方向顾问+专家评审的一体化设计能力。HTML是工具不是媒介,根据任务embody不同专家(UX设计师/动画师/幻灯片设计…
git:20260508.9e8707b · audit B · 6 stars
huashu-design SKILL.md skill
biraj2004/huashu-skills-english · huashu-design-en/SKILL.md · Design philosophy consultant — recommends 3 directions from 20 styles, generates visual demos, and AI prompts. Use when…
git:20260427.852f5b5 · audit A · 3 stars

Browse by kind, by grade A, or by owner.