設計ガイドのテンプレート

概要は、主題の役割やドキュメントの内容の要約を書きます。基本的にタイトルを主語にして書きます。

descriptionに収まらない場合は、見出しなしでここに概要を書きます。

基本的な考え方

主題を定義するうえでの基本方針や原則を書きます。概要的な説明はここには書きません。

アクセシビリティ

主題全体に対するアクセシビリティの考え方として、強調して言及する場合に書きます。
要素に閉じている場合は、{要素名}のセクションに書きます。

ライティング

主題全体に対する文言の考え方として、強調して言及する場合に書きます。
要素に閉じていた内容は、{要素名}のセクションに書き、全体の文言のバリエーションはライティングパターンに書きます。

構成

主題を構成する要素の全体像と、それぞれの要素を説明します。テンプレは以下です。

{主題}は以下の要素で構成されています。
1. [要素名1](#ページ内リンク)
2. [要素名2](#ページ内リンク)
3. [要素名3](#ページ内リンク)

要素の全体を俯瞰する画像やComponentPreviewがあればここに埋め込みます。

{要素名}

要素の役割や、要素のみに関する余白、種類、文言のルールや制約を、よしなに子セクションを分けて定義します。

1つ要素の説明が長大になる場合は、それ自体を別のページにわけることを考えましょう。
要素内に閉じない、全体に関わるものはレイアウト種類などのセクションに書きます。

要素の画像やComponentPreview、スプレッドシートがあればここに埋め込みます。

レイアウト

主題を配置する際の余白のとり方や配置の制約を、よしなに子セクションを分けて説明します。
構成で定義した要素間の配置関係もここに含みます。

要素内に閉じたレイアウトは{要素名}のセクションに書きます。

レイアウト全体を俯瞰する画像やComponentPreviewがあればここに埋め込みます。

種類

主題全体のUIバリエーションを説明します。
種類やパターンごとに子セクションを分け、その種類になる条件や役割を定義します。

{バリエーション名}

どんなときのバリエーションか、などを書きます。
バリエーションごとのライティングルールがあれば、<blockquote>やスプレッドシートなどを含めてここで書きます。

バリエーションの画像や<blockquote>ComponentPreview、スプレッドシートなどがあればここに埋め込みます。

ライティングパターン

主題に種類がなく、ライティングルールだけ書きたい場合はここに書きます。
<blockquote>やスプレッドシートなども埋め込めます。

ライティングガイドラインから抜き出した<blockquote>やスプレッドシートなどがあればここに埋め込みます。

{その他のルール}

基本的に上記の項目に当てはめることを推奨しますが、主題がルールのみの場合など、これらに当てはまらない内容を説明する場合に使用する自由項目です。
よしなに子セクションを分けて書きます。

関連リンク

参考文献

© 2021, SmartHR, Inc.