アプリデザインシステム基礎ボードとは何ですか？
アプリデザインシステムの基礎を定義するための柔軟な作業ボードです。概要、デザイン原則、ブランド基盤、カラー、タイポグラフィ、スペーシングとレイアウト、ボタンおよびフォーム要素、アイコンとイメージを含みます。このテンプレートは、チームがプロダクトデザインと開発において使用できる共有のビジュアルおよびインタラクションスタンダードを作成するのに役立ちます。
どのような問題を解決するのですか？
設計上の決定が画面ごとに行われ、共有された基準がない
視覚的およびインタラクションのパターンが時間とともに不一致になる
チームにブランド、UIルール、コンポーネントの基本的な部分を統一する場所がない
デザインと開発の間の引き継ぎが、共通のリファレンスがないと困難になる
利用方法
目的、範囲、所有権、対応プラットフォームなどを含む概要を定義する（10分）
プロダクト全体での意思決定を導くデザイン原則を捕捉する（10分）
個性、トーン、視覚的な特徴などのブランド基盤を文書化する（10分）
ブランド、中立色、背景、テキスト、状態の色の役割を持つカラースキームを作る（15分）
見出し、本文、ラベル、キャプション、ボタンのためのタイポグラフィスタイルを定義する（15分）
余白、パディング、グリッド、レスポンシブ構造のためのスペースおよびレイアウトルールを設定する（15分）
ボタンとフォーム要素について、階層、フィールドタイプ、状態、および使用ガイドを文書化する（20分）
アイコンや画像を、スタイル、サイズ設定、利用ルール、ビジュアルの一貫性を持つガイドラインで定義します (15m)
よくある落とし穴
すべてを一度に定義しようとする、適用するには曖昧すぎるルールを作成する、早期に多くの例外を追加する、実用的な使用ガイダンスがないスタイルガイドとしてシステムを扱うこと。
間違いを避ける方法
基本を重点的に始め、各スタイルやコンポーネントに明確な役割を与え、ガイドを実用的に保ち、システムが有効であることを保つために、実際のプロダクト画面に対して各セクションをレビューします。
使用できるMiroの機能
システムの各セクションを整理するためのフレーム、アイデアやルールのための付箋、スタイルトークンやUIの例のための図形、タイプスケールやカラーロールのためのテーブル、ステータスや優先順位のためのタグ、チームからのフィードバックのためのコメント、関連要素を結びつけるためのコネクタ、作業セッションのペースをとるためのタイマー。
よくある質問
Q: このテンプレートは誰が利用できますか？
A: プロダクトデザイナー、開発者、創業者、プロダクト マネージャー、デザインリード、または共有アプリデザインシステムを構築または改良しているチームに役立ちます。
Q: バーチャルと対面のセッションに対応していますか？
A: はい。チームはMiroでデザインシステムを直接構築することもできますし、会議室でボードをプロジェクターで表示し、メンバーと一緒に基盤をライブで定義することもできます。
Q: 何を持ち帰ることができますか？
A: 概要、原則、ブランド、カラー、タイポグラフィ、レイアウト、主要入力およびアクション、ビジュアルアセットガイダンスをカバーした明確なデザインシステムの基盤を持ち帰ることができ、チームで共有リファレンスとして活用できます。
