huashu-design
Huashu-Design is an AI agent skill for creating high-fidelity design prototypes, slide decks, animations, and visualizations using HTML. It emphasizes brand-specific assets, real-world design standards, and iterative feedback, while strictly avoiding generic AI-generated design patterns.
Is huashu-design safe to install?
Review the source first: our audit of huashu-design's source files found 3 shell commands, 0 external URLs, file reads and writes (high risk). Every command and URL listed appears verbatim in the skill's source. The skill executes shell commands for image fetching and screenshot generation, and performs web searches to verify product facts. It also writes HTML, CSS, and Markdown files to the local project directory.
How we audit skills: our security review methodology.
Who is this skill for?
Managers and designers who need high-fidelity visual outputs like product mockups, presentation decks, or motion demos using HTML as the primary medium.
What can you do with it?
- Creating interactive high-fidelity product mockups
- Designing 1920x1080 HTML-based presentation decks
- Developing motion design demos for video materials
- Generating data-driven information graphics
- Exploring design variations for branding and UI
How good is this skill?
Quality score: 5/10. The skill documentation is highly structured, provides clear operational protocols, and includes specific anti-patterns to ensure high-quality design output. The workflow is logical and prioritizes factual accuracy and brand integrity.
What does the skill file contain?
# 花叔Design · Huashu-Design 你是一位用HTML工作的设计师，不是程序员。用户是你的manager，你产出深思熟虑、做工精良的设计作品。 **HTML是工具，但你的媒介和产出形式会变**——做幻灯片时别像网页，做动画时别像Dashboard，做App原型时别像说明书。**根据任务embody对应领域的专家**：动画师/UX设计师/幻灯片设计师/原型师。 ## 使用前提 这个skill专为「用HTML做视觉产出」的场景设计，不是给任何HTML任务用的万能勺。适用场景： - **交互原型**：高保真产品mockup，用户可以点击、切换、感受流程 - **设计变体探索**：并排对比多个设计方向，或用Tweaks实时调参 - **演示幻灯片**：1920×1080的HTML deck，可以当PPT用 - **动画Demo**：时间轴驱动的motion design，做视频素材或概念演示 - **信息图/可视化**：精确排版、数据驱动、印刷级质量 不适用场景：生产级Web App、SEO网站、需要后端的动态系统——这些用frontend-design skill。 ## 任务路由：一张表定入口 收到任务先扫一遍这张表，确定走哪条线再开工（多信号同时命中按行序叠加）： | 任务信号 | 入口 | |---------|------| | 提到具体品牌/...
Frequently asked questions
Does this skill work for building production-ready web applications?
No. It is designed for high-fidelity design outputs like prototypes, decks, and demos. Production-level web apps or systems requiring backends should use the frontend-design skill.
How does the skill handle design requests without specific style references?
It enters a 'Design Direction Consultant' mode, where it automatically generates three distinct design variations based on different logic (random style, real-world benchmark, and top-tier designer philosophy) for the user to choose from.
What is the 'Core Asset Protocol'?
It is a mandatory requirement when designing for a specific brand or product. The skill must acquire official logos, product images, and UI screenshots before starting the design to ensure brand recognition.
How does the skill avoid 'AI slop'?
It enforces strict design constraints, such as using real images instead of generic SVG illustrations, avoiding overused gradients or emoji icons, and prioritizing brand-specific specifications over default AI aesthetic patterns.
Related skills
frontend-design
618.4KAI agents tasked with designing and building web interfaces who need to produce unique, high-quality visual identities rather than generic, templated designs
The frontend-design skill provides guidance for creating distinctive, intentional visual designs for web interfaces. It instructs the agent to act as a design lead at a small studio, focusing on avoiding templated defaults by making deliberate choices regarding typography, color palettes, layout, and motion. The skill emphasizes a structured process of brainstorming, planning, and self-critique before writing code.
brainstorming
256.4KDevelopers and project managers who need to define requirements, architecture, and design for software projects before writing code
A structured brainstorming framework that guides users through project exploration, design proposal, and specification before implementation. It enforces a strict design-first workflow, requiring user approval for designs and documentation before transitioning to the writing-plans skill.
simple
221.4KDevelopers and project managers who need a fast, lightweight decision-making process for feature design or component creation
A structured brainstorming framework for architectural and creative tasks that guides users from discovery to decision-making through a defined process flow.
emil-design-eng
114.3KDevelopers and designers building user interfaces who want to improve the feel and responsiveness of their software
This skill provides design engineering guidance based on Emil Kowalski's philosophy for UI polish, component design, and animation. It includes specific frameworks for animation decision-making, CSS transition techniques, and component interaction patterns.