方向性を定める
ターゲット層、ビジュアルの参考資料、フォーマット、制約条件を記述します。
要件定義から結果まで。
一貫性のあるパックを作成する
デザインアセットと再利用可能なスタイル情報を同時に生成します。
エクスポートを確認
書き出したファイルとアウトプットチェックを確認し、細部の調整が必要な部分を改善します。
デザインパックはクリエイティブな成果物です。実際に動作するプロダクトも必要な場合は、ウェブサイトまたはアプリのビルドを選択してください。
ビジュアルの方向性から再利用可能なデザインシステムへ。
アイデンティティ、コンポーネント、そしてデザインを次のプロジェクトへ運ぶファイルを確認しましょう。
ビジュアル言語を見つける
アイデンティティをアイデアに合ったものにする。
ターゲット層、キャラクター、デザインが機能すべき場面を記述してください。AIはそのブリーフをもとに、ブランドアイデンティティ、インターフェースシステム、イラストセットなど、サポート対象のデザインパックを作成します。パレット、タイポグラフィ、その根拠を一緒に確認し、各要素に統一感があるか見てみましょう。
- ビジュアルの参考資料と実務上の制約をAIに伝えます。
- マーク、書体、パレットを一つのアイデンティティとして確認します。
- アセットを本番に取り込む前に、方向性の変更を依頼します。
システムを構築する
細部を連携させる。
インターフェースデザインパックでは、再利用可能なトークンが色、書体、余白、コンポーネントスタイルをつなげます。レンダリングされたコンポーネントシートには、各状態にあるコントロールが表示されます。プラットフォームはトークン構造、コントラスト、コンポーネントの一貫性をチェックし、デザインレビューではパックがブリーフにどれだけ応えているかを検討します。
- ボタン、フィールド、その他の再利用可能なコンポーネントを確認します。
- デフォルトの見た目に加え、フォーカス、無効、エラーの各状態を確認します。
- 共有トークンを使って、同じスタイルを実装まで引き継ぎます。
作業を先に進める
デザインの裏側にあるアセットを保持します。
パックの概要を開き、リンクをたどって成果物にアクセスしてください。ブリーフの内容に応じて、ベクターマスター、ラスター書き出し、コンポーネントシート、デザイントークン、ブランドブックなどが含まれます。編集可能なFigmaエクスポートが有効化・接続されている場合は、そのエクスポートが完了すると生成されるハンドオフリンクを使用してください。
- ファイル一覧と各成果物の用途を確認してください。
- 再利用可能なアセットとトークンをデザインまたは開発のワークフローに取り込みましょう。
- ファイルや連携が納品済みとみなす前に、エクスポートレポートを確認してください。
ワークフロー
作業を連携させておく。
求める結果を説明する
対象読者、希望する出力、制約事項を説明します。進める前に方向性を調整してください。
作業内容を確認する
生成されたファイル、利用可能なプレビュー、その出力に関連するチェック項目を確認します。
次のバージョンを作成する
変更を依頼し、そのプロジェクトがサポートするエクスポートまたは納品ワークフローを利用します。
次に何ができるかを見てみましょう。
すべてのビルダーを見る
AI ウェブサイトビルダー
ランディングページ、ストアフロント、コンテンツサイトを作成します。対象ユーザーと体験を説明すると、確認・改善できます。
AI Website Builderを見る
AI アプリビルダー
必要な用途に合わせてWeb、モバイル、デスクトップアプリを構築します。体験をプレビューし、改善して、適切なパッケージを準備します。
AI App Builderを見る
AI ゲームビルダー
ゲームのアイデアをプレイ可能なプロジェクトに変えます。ルール、キャラクター、世界観を形作り、体験をテスト・改善します。
AI Game Builderを見るよくある質問と回答
始める前に、少しだけ整理しておきましょう。
デザインパックには何が含まれますか？+
パックには、ブランドアセット、アイコン、パレット、タイポグラフィ、イラスト、コンポーネントシート、対応する3Dアセットを含めることができます。パックに含まれる成果物はブリーフによって決まります。
デザインブリーフには何を含めればよいですか？+
対象読者、雰囲気、ビジュアルリファレンス、想定フォーマット、既存のブランド制約について記述してください。アセットの利用場所を指定することで、その文脈に合わせてパックを作成できます。
使用する前にデザインをプレビューできますか？+
パックには概要が含まれ、成果物の内容に応じてコンポーネントシートも含まれます。導入前に、ビジュアルアセット、再利用可能なトークン、関連するコンポーネントの状態を確認してください。
デザイン検証では何をチェックしますか？+
チェックでは、記載されたファイル、デザイントークン、関連するコントラストのペア、コンポーネントの状態、対応するエクスポートを検証します。デザインレビューでは、パック全体の一貫性とブリーフへの準拠も考慮されます。
アセットをエクスポートできますか？+
パック用に生成されたファイルを確認してダウンロードしてください。対応する成果物には、要求に応じた画像、PDF、3Dエクスポートが含まれます。実際のファイルは選択したアセットと利用可能なワークフローによって異なります。
デザインパックには実際に動作するウェブサイトやアプリが含まれますか？+
デザインパックはクリエイティブアセットと再利用可能なデザイン情報を提供します。実際に動作する製品が必要な場合はWebsite BuilderまたはApp Builderを選択し、そのビルドのブリーフにデザインの方向性を含めてください。
何をつくりますか？
ビルドを作成するか、専門チームに次のタスクを任せましょう。