PPTからプロトタイプ設計まで：Guizang PPT SkillとHuashu Designの使いどころ

Sat, 09 May 2026 08:34:23 +0800

最近、中国語圏の開発者が作った2つのデザイン系 Agent Skill は、並べて見る価値があります。ひとつは歸藏による guizang-ppt-skill、もうひとつは花叔による huashu-design です。

どちらも従来の意味での「デザインツール」ではありません。設計プロセス、審美上の好み、チェックリスト、エンジニアリングテンプレートを、Agent が実行できる Skill として記述したものです。UI を開いて要素を少しずつドラッグするのではなく、Claude Code、Codex、Cursor のような Agent に要件を渡し、決められた流れに沿って HTML、PPT、アニメーション、プロトタイプを生成させます。

この種のプロジェクトの価値は、AI にランダムに発想させることではありません。「どう作れば見苦しくならないか」をプロセス化している点にあります。

guizang-ppt-skill：雑誌風Web PPTに特化

歸藏の guizang-ppt-skill は位置づけが明確です。単一ファイルの HTML 横スクロールPPTを生成し、視覚の基調は「デジタル雑誌 x 電子インク」です。汎用デザインフレームワークというより、登壇用に用意されたレイアウトシステムに近い存在です。

リポジトリの README では、主な機能として次のものが挙げられています。

単一ファイル HTML 出力。ビルドもサーバーも不要で、ブラウザから直接開ける。
横方向のページ移動。キーボード、ホイール、タッチスワイプ、下部ドット、ESC インデックスに対応。
Ink Classic、Indigo Porcelain、Forest Ink、Kraft Paper、Dune を含む5種類のテーマカラープリセット。
オープニングカバー、章区切り、データ大見出し、左テキスト右画像、画像グリッド、Pipeline、サスペンス質問、大きな引用、Before/After 比較、テキスト画像混在など10種類のページレイアウト。
テンプレート、コンポーネント説明、レイアウト骨格、テーマ設定、品質チェックリストを内蔵。

オフライン共有、業界内の社内発表、少人数イベント、AIプロダクト発表、demo day、そして強い個人スタイルを持つプレゼン資料に向いています。一方で、大量の表データ、研修教材、複数人での共同編集にはあまり向きません。

このプロジェクトの良いところは、割り切りです。すべてのデザイン場面を覆おうとせず、「雑誌風PPT」という場面を狭く定義しています。テーマ色はプリセットから選び、レイアウトにも明確な骨格があります。その制約が、むしろ Agent の脱線を減らします。

意見、業界観察、プロダクト発表の内容をプレゼン deck にまとめる機会が多いなら、かなり実用的です。

インストールコマンドも単純です。

`1`	`npx skills add https://github.com/op7418/guizang-ppt-skill --skill guizang-ppt-skill`

huashu-design：より包括的なHTMLネイティブ設計ワークフロー

花叔の huashu-design はカバー範囲がより広いです。目標は PPT だけを作ることではなく、HTML をネイティブなデザインキャンバスとして扱い、Agent に納品可能なデザイン資産を生成させることです。

リポジトリの README では、次のような機能が挙げられています。

クリック可能な App または Web プロトタイプ。
HTML スライド、および編集可能な PPTX エクスポート。
プロダクト発表アニメーション、MP4、GIF、音楽付きバージョン。
複数方向のデザイン案の横並び比較。
インフォグラフィック、データ可視化、PDF、PNG、SVG エクスポート。
哲学的一貫性、視覚階層、実行品質、機能性、革新性を含む5次元の専門家レビュー。

中心にある考え方は、Agent にまずブランドと素材を理解させ、その後で高忠実度のデザインを出させることです。プロジェクトでは Core Asset Protocol が強調されています。具体的なブランドを扱うときは、記憶に頼って推測するのではなく、logo、製品画像、UI スクリーンショット、配色、フォント、ブランドガイドラインを先に確認します。

これは重要です。AI が生成したデザインの多くは「デザインっぽく」は見えますが、特定の実在する製品やブランドには見えません。huashu-design はこの問題を前段で解決しようとします。まず本物の素材を見つけ、それからデザインする、という流れです。

インストールコマンドは次のとおりです。

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

より包括的なデザイン納品をターミナル内で進めたい人に向いています。製品プロトタイプ、発表アニメーション、プレゼン資料、インフォグラフィック、デザインレビューを、ひとつの Agent ワークフローに載せて処理できます。

両者の最大の違い

簡単に言えば、guizang-ppt-skill はより狭く、より安定したプレゼン deck 生成器です。huashu-design はより広く、より包括的な HTML ネイティブ設計システムです。

PPT だけを見るなら：

guizang-ppt-skill は雑誌感、リズム、版面、単一ファイルのブラウザ発表をより重視します。
huashu-design は汎用的なデザイン能力、編集可能な PPTX、ブランド素材、エクスポート経路、レビュー工程をより重視します。

全体的なデザイン能力を見るなら：

guizang-ppt-skill は境界が明確で、スタイルのある横型プレゼンを素早く作るのに向いています。
huashu-design はより総合的で、製品やブランドのデザインタスクをプロトタイプ、アニメーション、スライド、インフォグラフィックに分解するのに向いています。

この2つのプロジェクトは、Skill の書き方としても異なる型を示しています。前者は高度に収束したテンプレートと審美上の制約の集合に近く、後者は小さなデザインチームのワークフロー説明書に近いものです。

なぜこの種のSkillが重要なのか

Agent でよくある問題は、「できるが、安定しない」ことです。同じ要件でも、あるときは良い出力になり、別のときは紫のグラデーション、角丸カード、偽物のアイコン、もっともらしい空文句へ流れてしまうことがあります。

Skill の意義は、そこに安定性を補うことです。次のようなものを固定化できます。

再利用可能なテンプレート。
実行可能なチェックリスト。
明確な審美上の好み。
よくあるミスを避けるルール。
出力形式と検証フロー。
いつ質問し、いつそのまま作業を始めるべきか。

これは、単に「もっと高級感を出して」と書くよりはるかに信頼できます。

特にデザインタスクでは、審美は一文の prompt だけで安定して再現できるものではありません。本当に役に立つのはプロセスです。まず素材を確認し、方向性を決め、構造を組み、視覚表現を作り、最後に出力を確認する。この流れを Skill として書くことで、Agent は一回きりの画像生成器ではなく、協働できる実行者に近づきます。

使い分けの提案

ひとつのテーマをオフライン登壇や共有用の deck にしたいだけなら、まず guizang-ppt-skill を試すとよいでしょう。出力の境界が狭く、単一ファイル HTML なので配布やプレビューもしやすいです。

Agent により包括的なデザインタスクを任せたい場合、たとえば App プロトタイプ、発表アニメーション、ブランド化されたスライド、エクスポート可能な PPTX、インフォグラフィックなどであれば、まず huashu-design を見るとよいでしょう。ワークフローは長めですが、複数回の反復と納品物の出力が必要なタスクに向いています。

すでに自分の Codex や Claude Code Skill を書いているなら、この2つのプロジェクトはいずれも参考になります。

「狭い場面をどう安定させるか」を学びたいなら、guizang-ppt-skill。
「複雑なワークフローをどう実行可能なプロトコルに分解するか」を学びたいなら、huashu-design。

まとめ

歸藏と花叔の2つのプロジェクトに共通しているのは、「デザイン能力」を一回の prompt から、繰り返し実行できるプロセスへ変えていることです。

guizang-ppt-skill の重点は雑誌風 HTML PPT で、強くスタイル化されたプレゼンに向いています。huashu-design の重点は HTML ネイティブ設計システムで、プロトタイプ、アニメーション、スライド、インフォグラフィック、レビューまでをカバーします。解決しているのは「AI はデザインを生成できるか」ではなく、「AI は安定した方法に沿って納品可能なデザインを生成できるか」です。

これは Agent ツールのエコシステムにおいて、重要なオープンソースプロジェクトの一類型になるかもしれません。コードテンプレートだけでなく、人間の経験、審美、仕事の進め方を Skill としてパッケージ化するものです。

参考リンク：