Huashu Design

# Huashu Design

Turns a one-line request in your AI agent into a finished design: a launch animation, a clickable app prototype, an editable slide deck, an infographic or a set of Xiaohongshu images. Works across agents.

Made by alchaincyf on GitHub. These notes are Mindket's, written from its README; the project's own files and license are in its repository.

## About

What it is: Huashu Design is an agent skill for design work. You type one sentence in your AI agent, and it builds a finished piece such as a product launch animation, a clickable app prototype, an editable slide deck or a print-quality infographic. The README puts a result at three to thirty minutes.

Who it suits: People who need design output but have no design team, and who are happy to direct an AI agent in plain language.

```table
Industry | Who uses it | How they use it | Example
Product and startups | Founders and product managers | Make a launch animation or a clickable app prototype from a single request | Asking for a pomodoro timer iOS prototype with four tappable screens
Presentations | Speakers and lecturers | Build an editable slide deck and ask for three style directions first | Requesting a talk deck on AI psychology with three looks to choose from
Social content | Content creators | Make sets of 3:4 vertical images for Xiaohongshu in one of eight layouts | Turning a topic into an image set from a layout sample
Web and exhibitions | Web designers | Create a web page from a one-line brief | An online exhibition site for a famous series of woodblock prints
Explainers | Teachers and trainers | Turn a piece of logic into a short animation exported as MP4 and GIF | A 60-second animation explaining a process
```

Anyone who prefers to work by hand in a design tool can skip it.

Where to use it:

- Claude Code, Cursor, Codex, OpenClaw and Hermes
- Any other agent that supports skills
- DSH, as a plugin on its desktop or web version

```table
Use case | Who | What they get back
Launch animation | Product teams | A product release animation
Clickable prototype | Product designers | An app prototype whose key screens respond to clicks
Slides | Speakers | An editable PPT file
Social image sets | Creators | 3:4 images, with checks on font size, overflow and text overlap
```

How to set it up:

- An AI agent that supports skills, such as Claude Code, Cursor, Codex, OpenClaw or Hermes
- Node, since the install command runs through npx
- Optional: Chrome or Edge on your computer, which the scripts borrow to export PDF

1. Run the install command in a terminal.
2. Look inside the install folder, for example the huashu-design folder under your Claude skills folder. It should hold the references, assets, scripts and demos subfolders, not only the skill file.
3. If only the skill file is there, your skills CLI is too old. Versions up to 1.5.15 copy just one file. Upgrade it and install again.
4. If it still looks wrong, clone the repository by hand into any skills folder.
5. For DSH, open the desktop app once and quit it fully before you use the command line. Reopen DSH afterwards so the plugin loads. Use the profile name web for the web version.

```bash
npx skills add alchaincyf/huashu-design
```

```bash
npm i -g skills@latest
npx skills@latest add alchaincyf/huashu-design
```

```bash
dsh plugin --profile desktop add github:alchaincyf/huashu-design
```

To remove the DSH plugin, run this.

```bash
dsh plugin --profile desktop remove huashu-design
```

How to use it: Talk to your agent in plain language and name the format you want. Give it your brand assets, such as a logo, a color palette and screenshots of your interface, and it reads the brand's feel. With none, it offers design directions instead. These are the source's own sample prompts.

```text
「做一份 AI 心理学的演讲 PPT，推荐 3 个风格方向让我选」
「做个 AI 番茄钟 iOS 原型，4 个核心屏幕要真能点击」
「把这段逻辑做成 60 秒动画，导出 MP4 和 GIF」
```

```table
Tool | What it does
Design directions | Renders six thumbnails, then builds three of them as real drafts from a style library with samples
ref_board.py | Captures an existing reference work into a board that the agent looks at before it designs
Design check | Measures facts only, for example catching two drafts that open with the same picture
Look ledger | Remembers how your earlier work looked, so projects stop resembling each other
```

Example: You ask for a pomodoro timer iOS prototype with four main screens that respond to clicks. The skill builds a prototype you can click through, rather than a set of flat pictures.

For newcomers and experts: A skill is a set of instructions and files that your agent reads. After you install it, you simply ask your agent for a design. A good first try is a short slide deck, because the skill offers three style directions for you to pick from.

Under the hood, it narrows six thumbnails to three real drafts, screenshots a reference work before it starts, and runs a check that only measures facts. The skill spans four subfolders with 99 referenced recipes, scripts and assets, so a partial install breaks it. Results also depend on the agent you run it in.

```flow
You write a one-line request
The skill reads your brand assets or offers directions
Six thumbnails narrow to three real drafts
The agent builds the draft you pick
A design check measures facts before delivery
```

Good to know:

- License: MIT. Since 2026-05-14 it is free for personal and commercial use, and the older terms no longer apply.
- The skill is more than one file, and a partial install is the most common fault.
- A skills CLI up to 1.5.15 copies only one file. The fix arrived in 1.5.19.
- On the DSH desktop app, editable slide files are made with the app's own Python.
- PDF export borrows Chrome or Edge from your computer.

## On GitHub, 14 November 2026

- Stars: 29,432
- Forks: 3,154
- Watching: 105
- Open issues and pull requests: 0
- Language: HTML
- License: MIT
- Topics: agent-skills, ai-design, animation, claude-code, claude-code-skills, claude-skills, codex, cursor, deepseek-harness, design, dsh-plugin, html

## Links

- Code: https://github.com/alchaincyf/huashu-design
- Releases: https://github.com/alchaincyf/huashu-design/releases
- Issues: https://github.com/alchaincyf/huashu-design/issues
- Star history: https://www.star-history.com/#alchaincyf/huashu-design&Date

## Intro videos

- 我逆向了Claude Design！一句话帮你生成任何出色设计，开源后狂揽GitHub 1.6万+stars！: https://www.youtube.com/watch?v=m-_BlUdcIvw

## Get the code

```
git clone https://github.com/alchaincyf/huashu-design.git
```

Then follow the setup in its README. Nothing in this kit runs by itself.

README.md  7 KB