デザインプロセスなど まとめ @siporin_

デザインの構造 ※業界によって使う用語が違ったりするので、要素の関係性について表現の仕方は様々です。 TC Design Guideline 2. Design Concept 3. Style Guide 4. Component Library UI UX Design System @siporin_

デザインシステムとは デザインシステムとは、プロダクトをより良いものとするた めのルールやツールが連携した形でまとめられたもの “ プロダクトをより効率的でまとまりのあるものとして進めるため、個人、チーム、または組織に よってビジュアルスタイル・コンポーネント・およびその他の懸念事項のライブラリをコードおよび ツールとしてドキュメント化したもの。 “ 引用: Defining Design Systems / EightShapes @siporin_

デザインシステムの構成要素 hI Design Guideline - 上位概念である原E CI Design Concept - デザインをする際に基本とする指T #I Design Style - 原則に基づいたルー8 I Component Library - ルールに基づいたツール @siporin_

デザインシステムの作り方 gB デザインコンセプトを定G SB 公開されているデザインガイドラインのルールに則りな がらデザインコンセプトに基づいたデザインガイドライ ン作' %B 公開されているデザインスタイルを参考に、デザインコ ンセプトに基づいたデザインスタイルを作' B デザインガイドラインや開発環境に適したコンポーネン トライブラリを選定 @siporin_

デザインガイドラインとは デザインガイドラインとは、色・文字・レイアウトなど様々 なデザイン要素について、ルールを綿密に定義したドキュメ ントのこと ※ガイドラインと一口に言っても、サービスやプロダクトのどこまで（情報設計やライティング、シ ステム設計など etc.）をフォローするのか、もしくは見た目のデザインだけなのか…など、ガイドラ インの定義は様々です。 @siporin_

デザインガイドラインを設計するにあたっての土台 一定のUXの水準を担保するために、ISO 9241-210（イン タラクティブシステムにおける人間中心設計）JIS規格等に 則って作成する必要がある。 この規格に基づいた「人間中心デザイン」という学問も存在 する。 @siporin_

デザインガイドラインの作り方 土台である規格や学問に則って作成することも大切だが、 ユーザーの期待値や体験は変化するものなので、常に仮説検 証を行い、最適なガイドラインに更新し続ける必要がある。 多大なリソースを割いて変化に対応し続けているガイドライ ンがいくつか公開されているので、そちらを活用する。 @siporin_

公開されているデザインガイドライン MaterialDesign @siporin_

公開されているデザインガイドライン HumanInterfaceGuideline @siporin_

デザインコンセプトとは デザインやスタイルなどに一貫性をもたせることで、商品・ サービスに「らしさ」＝ブランド力を与える。 @siporin_

デザインコンセプトを作成する手法01 マトリクス図- 自プロダクトが全体の中のどのあたりに位置するのかを知る 引用: デザインコンセプトとは何か？必要性と作り方、活用方法を解説 @siporin_

デザインコンセプトを作成する手法02 スライダー - 方向性を掴む・決める。一番最初の大まかな指針として使うのが良い。 引用: デザインコンセプトとは何か？必要性と作り方、活用方法を解説 @siporin_

デザインコンセプトを作成する手法03 マインドマップ - 一人で思考を整理するときに使う。 引用: デザインコンセプトとは何か？必要性と作り方、活用方法を解説 @siporin_

デザインスタイルガイド デザインシステムには含まれる原則やコンポーネントライブ ラリは含まれず、視覚的なルールのみをまとめたドキュメン ト。 @siporin_

スタイルガイドの作り方 デザインガイドラインに則り、デザインコンセプトを実現で きるように作成する。 多大なリソースを割いて作成されているスタイルガイドがい くつか公開されているので、そちらを活用する。 @siporin_

デザインスタイルの種類と歴史01 初代リッチデザイン - 影・光沢・立体感など細部のディティールを作り込んだデザイン @siporin_

デザインスタイルの種類と歴史02 フラットデザイン - 立体感や光沢感などの視覚効果を無くし、シンプルで平面的な概念 @siporin_

デザインスタイルの種類と歴史03 MaterialDesign - 現実世界に基づいた表現。2014年にGoogleが発表したデザインの概念。 アプリ開発であれば最新のMaterialDesign3を活用するのが主流 @siporin_

スタイルガイドの種類 ミニマルデザイン - 極力余計なものを排除し、ユーザビリティよりもシンプルさを最大限追求 @siporin_

コンポーネントライブラリ すぐに使えるカスタマイズ可能な再利用可能なコードコン ポーネントのオープンソースレポジトリを提供することで、 UIデザイナーやUXデザイナーがより迅速な開発と成長を実 現することを可能にするライブラリ。 @siporin_

まとめ デザインシステムを構築する要素ごとに、最新の仮説検証を もとに設計されている既存のガイドラインなどを土台とし、 オリジナリティを脚色していくことで、ユーザーにとっての 使いやすさを担保しながらもプロダクトらしさを表現してい く。 @siporin_