作業の進め方
Baoyu Design は、HTML デザイン成果物を作るための幅広いオーケストレーションスキルです。エントリーは、ワイヤーフレーム、アプリ画面、図、ドキュメント、スライドなどの成果物を専門の組み込みガイドへ振り分け、共通のメソドロジーがデザインプロセスを提供します。
際立った特長は、デザインコンテキストを明示することです。ローカルの Figma ファイル、リポジトリの参照、既存の HTML/CSS をインポートワークフローへ振り分けたり、プロジェクトをコピーしたデザインシステムに紐づけたりできます。成果物は、バラバラの HTML ファイルにならず、アセットやプロジェクトメタデータとまとめて管理されます。エクスポートの範囲は限定されています。PowerPoint エクスポートは、対応するスライド構造で作成されたスライドに適用され、任意の HTML には適用されません。
期待できる成果物
- アセットをコピーして含めた、自己完結型の HTML デザイン成果物
- design-system のバインディングとアセットメタデータが記録されたプロジェクト
- 専用ワークフローが適用できる場合の、対応するスライドまたはアニメーションのエクスポート
ブリーフからレビューまで
- 01コンテキストを整える
レシピを選ぶ前に、成果物の種類、忠実度、ブランド参照、既存のデザインシステムを確認します。
- 02適切な経路を読み込む
すべての環境に同じプレビューツールがあると想定せず、該当する組み込みガイドと、エージェント環境向けのツールリファレンスに従います。
- 03デザインシステムを紐づける
既存のシステムを使う場合は、プロジェクト内にコピーをインポートしてバインディングを記録します。新しく作成する場合は、コンパイル、チェック、プレビューのワークフローを使います。
- 04構築してプレビューする
HTML と参照アセットを一緒に保ち、結果をローカルで配信し、実際のプレビューで確認してから納品とします。