experience-system-blueprint

エクスペリエンスシステムの設計図スキル

使用する場面

• ブランド戦略に基づいた、拡張性の高いデザインシステムを作成するとき。
• ブランドコンセプトをプロダクト、ウェブ、イベントの各チームに引き継ぐとき。
• 一貫性とアクセシビリティの観点から、顧客接点を監査するとき。

フレームワーク

1. システムの原則 – デザインの指針、アクセシビリティ基準、インクルーシブな取り組み。
2. コンポーネントライブラリ – ヒーローセクション、CTA、モーションの挙動、環境要素のモジュール。
3. 感覚仕様 – ビジュアル、モーション、音声、触覚のガイドラインと、推奨例・非推奨例。
4. チャネルへの適応 – チャネルやデバイスに応じたコンポーネントの柔軟な適用方法を示すマトリクス。
5. QA と測定 – 実行の忠実度と効果を追跡するためのチェックリストと計測用フック。

テンプレート

• 原則 → コンポーネント → チャネルの対応関係を示す設計図デッキ。
• 仕様、トークン、使用ルールをまとめた Figma/Notion ドキュメント。
• 公開前の実装をレビューするための QA ワークシート。

ヒント

• チームが正式なシステムを把握できるよう、設計図をバージョン管理します。
• 後からの改修を避けるため、アクセシビリティのベストプラクティスを早い段階で組み込みます。
• すぐに使えるツールキットには、design-multi-channel-brand-experience コマンドを組み合わせます。

---