Close

カテゴリー

デザイン システム テンプレート

著者: InVision

プロのサポートを受けて統合されたデザイン システムを開発して、デザイン チームを拡張

テンプレートを使用する
デザイン システム テンプレート

組織が拡大するにつれ、ブランドやデザインも進化させる必要が出てくることがよくあります。デザイン システムを開発することで、組織全体にわたって設計プロセスを早め、不統一をなくし、デザイン負債を減らすことができます。InVision デザイン システム テンプレートは、デザイン方針の定義に必要なツールを提供し、コンポーネントを記録し、デザインや執筆などのルールとベストプラクティスを明確化します。すべてのデザイン システムにとって最適な出発点です。

デザイン システム テンプレートの使用方法

ステップ 1. デザイン方針を定義する

デザイン方針は、デザイン システムの基盤です。新しい製品、特徴、機能を開発する際の指針となる価値であり、独自のデザインと印象の形成に影響します。具体的な方針、組織独自の視点を反映した方針、デザイナーが実践でき、専門的判断でもって敵対関係や対立を解決できる方針を選択します。

ステップ 2. 視覚的言語を説明する

デザイン方針が決定したら、視覚的言語の要素に移ります。これらには、カラー パレット、タイポグラフィ、サイズやスペースのルール、アイコンやイラストのライブラリがあります。デザイン要素ごとに、デザイナーが適用すべきルールを一覧にして、「良い例と悪い例」をいくつか含め、要素が実際にどのように使用されるのかを示します。

ステップ 3. 記入ルールを作成する

視覚化できたら、次は言葉に移ります。文書スタイルや文体は組織によってさまざまです。大文字の使用、句読点、数字の規則でさえ、デザイン チームによって異なる場合があります。重要な記入ルールをページに記載したり、ブランド名を辞書に追加したり、上部に早見表を作成してよくある質問に回答したり、重要な表記規則をデザイン チームに通知したりします。

ステップ 3. 記入ルールを作成する

ステップ 4. ベストプラクティスを構築する

デザイン チームにとって、何が役立ち、何が不要かを理解できました。次のセクションでは、アクセス性、ブラウザー サポート、モバイル デザインなどのベストプラクティスを記入します。これはデザイナーにとって、美しく包括的な実証済みのデザインの作成に役立つ早見表となります。

ステップ 5. コンポーネントを文書化する

さあ、これからが本番です。各コンポーネントのコード スニペットをデザイン システムに貼り付け、このセクションの表を使用してさまざまな設計コンテキストの変更方法を説明します。このセクションは、組織の開発者が設計を正しく一貫性をもって実装するために重要です。したがって、十分に注意を払い時間をかけてください。

ステップ 5. コンポーネントを文書化する

InVision は、世界最高レベルのカスタマーエクスペリエンスを実現するためのデジタル製品デザインプラットフォームです。

  • Content design glossary template

    アトラシアン

    Content design glossary

    Teach writers how to use product names, industry terms, and other content with an A-Z guide.

  • Customer interview report template

    アトラシアン

    顧客インタビューレポート

    顧客インタビュー ピラミッドを使って情報を役立てよう

  • Design component template

    Tony Starr

    リード コンテンツ デザイナー
    アトラシアン

    デザイン コンポーネント

    この便利なテンプレートを使用し、デザイン システムでコンポーネントを文書化します。