ドキュメントのデザイン/公式ドキュメントやリリースノート

ツールのドキュメントやアプリケーションのリリースノートの中は、読みやすさを意識しているものが多く、デザイン的に良いと思うものがある。自分が良いと思ったものを集めて自分で作るドキュメントの参考にしたい。

VS Codeのリリースノート

こちらは Visual Studio Code のリリースノート。特筆すべき改善が一言でリストアップされていて、それぞれに短い説明がついている。それ以降は、全ての改善内容についてスクショ付きで詳しく説明されている。リリースノートの最後には関連するプルリクのリストが並ぶ。

ブラウザ版だとまた少し見た目が変わってきますが、アプリ上で見ることができる画像ののやつはデザインかっこよくて気に入っている。青系で暗い色をベースにしている(これはエディタで採用しているテーマに準拠しているだろうが。)

Firefoxのリリースノート

f

こちらは Firefox 105.0 のリリースノート。比較的シンプルな内容で、新機能と修正のそれぞれのサマリーが書かれている。白を基調にしていて、余白を大きく取ったデザインになっている。

Zoomのリリースノート

こちらは Zoom のリリースノート。クライアント版、intune版、outlook plugin版で大きく分けられていて、それぞれに New and enhanced features と Resolved Issues がある。新機能のほうは機能別にみじかい説明と一緒に箇条書きでリストされていて、使い方へのリンクがあるものもある。修正については簡単な一文のみで箇条書きされている。デザイン的には比較的シンプルで、装飾は最小限に抑えられている。

GitHub CLI のドキュメント

GitHub CLI のドキュメント も洗練された印象でかっこいい。フォントは "SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace となっていて、フォントカラーは地の文が #ffffff でリンクの青系の色が #79b8ff である。背景色は暗めの #0e1113 と明るめの #24292e のツートーンになっている。全体的に文字数が少なく、すっきりした印象のドキュメントである。ちなみにリリースノートは github 上にあるのでデザインは github に準拠している。

タイトルとURLをコピーしました