ItsssssJack/power-design

解決する課題

Power Design は、AI 生成のプレゼンテーションやウェブサイトが一般的で質の低い見た目になる問題を解決します。出力結果が特定のブランドアイデンティティと視覚的に整合しているだけでなく、ランダムなAI生成ではなく、客観的で研究に基づいたデザイン原則に基づいていることを保証します。

動作方法

これは Claude Code のスキルとして機能し、特定のワークフローに従います：

1. ルーティング：ユーザーはプレゼンテーションデッキかウェブサイトのどちらかを選択します。
2. ブランド抽出：Firecrawl を使ってライブ URL から「ブランドDNA」を抽出するか、72 以上の事前構築済みブランドシステム（例：Apple、Stripe、Linear）のライブラリから選択します。
3. ルール適用：20 の具体的なデザインルールを含む、2 つのコード化されたルールブックのいずれかを適用します——スライド用（Tufte や Duarte などの専門家に基づく）とウェブ用（WCAG 2.2 や Core Web Vitals などの基準に基づく）。
4. 生成：ブランドDNAと選択されたルールブックを組み合わせて、レスポンシブな HTML ファイル（slides.html または site.html）を生成します。

対象ユーザー

Claude Code のユーザーで、アクセシビリティ、パフォーマンス、視覚的デザインの厳格な基準を満たす、プロフェッショナルでブランドに沿ったランディングページやプレゼンテーションデッキを素早く生成したい方におすすめです。

特徴

• 二重出力パス：プレゼンテーションデッキと完全なレスポンシブウェブサイトの両方をサポート。
• 豊富なブランドライブラリ：72 以上の事前設定済みブランドスタイルを含む。
• 研究に基づく：タイポグラフィ、アクセシビリティ、UX 分野の業界リーダーから導き出された合計 40 のコード化されたルールを使用。
• ライブブランドスクレイピング：Firecrawl を通じて、任意の URL からデザイン要素を抽出可能。