AI Skill MartBrowse skillsPromptsProgramsLearnWhat is a Skill?
 
← Back to list

Huashu Design Philosophy Consultant

A design consultant skill that interviews you, proposes three contrasting design directions by named designers, builds visual demos, and then critiques the finished work.

Design & UIIntermediate★ 2,240⑂ 308AI score 9/10Last updated: Nov 9, 2026

What it does

  • Clarifies the brief: asks up to three questions (audience, core message, emotional tone, output format) and restates the need in 100–200 words like a studio consultant.
  • Proposes three directions: pulls from a library of 20 design philosophies across five schools (information architecture, kinetic poetics, minimalism, experimental avant-garde, Eastern philosophy) and forces each option to come from a different school, always naming the designer or studio (e.g. "Kenya Hara-style Eastern minimalism").
  • Generates visual demos in parallel: spawns three background agents that build single-page HTML mockups using your real content, screenshots them with Playwright, and shows all three side by side.
  • Writes AI image prompts: structured as [design-philosophy constraints] + [content description] + [technical parameters], with HEX codes, ratios and space allocation.
  • Runs a design critique: scores philosophy consistency, visual hierarchy, detail execution, functionality and originality out of 10, then lists Keep / Fix items graded ⚠️ critical, ⚡ important, 💡 polish, plus three 5-minute quick wins.
  • Enforces finished output: no emoji icons, no gray "image goes here" placeholders — use Lucide/Phosphor/Heroicons/Tabler, hand-written SVG, real or Unsplash/Pexels imagery, or AI-generated art.

Who it's for

  • Anyone shipping landing pages, app screens, decks, PDF reports, posters or covers who can't decide on a visual direction.
  • Non-designers (PMs, marketers, founders) who need to present credible style options to clients or stakeholders.
  • Developers using Claude Code for UI who also want an honest quality review loop.

Examples

  1. "Recommend a design direction for my SaaS landing page" → three clarifying questions → Pentagram editorial + Field.io particle + Kenya Hara negative-space options, each rendered as an HTML screenshot.
  2. "Use A's palette with C's layout" → a blended demo is generated and re-screenshotted for comparison.
  3. Paste a finished slide cover and ask for a review → five-dimension scorecard plus severity-graded fixes with concrete pixel/color values.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/alchaincyf/huashu-skills/HEAD/huashu-design/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on AI Skill Mart.
Copy the huashu-design folder from the GitHub repo alchaincyf/huashu-skills into my ~/.claude/skills/alchaincyf-huashu-design/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/alchaincyf/huashu-skills.git && mkdir -p ~/.claude/skills && cp -r huashu-skills/huashu-design ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open your terminal.
  2. Clone the repository: git clone https://github.com/alchaincyf/huashu-skills.git
  3. Create the skills folder if needed: mkdir -p ~/.claude/skills
  4. Copy the skill in: cp -r huashu-skills/huashu-design ~/.claude/skills/
  5. Confirm the references/ files (design-styles.md, scene-templates.md, critique-guide.md) came along.
  6. For the demo-screenshot step, install Node.js and run once: npx playwright install chromium
  7. Restart Claude Code and ask something like "suggest design directions for my landing page" to trigger the skill. Note the SKILL.md is written in Chinese and bakes in the author's taste rules (e.g. no neon/dark-blue palettes) — edit them if they clash with your brand.
View source on GitHub ↗License: MIT