今流行のAtomic Dsignってなに?
2020/03/08
結論。パーツの最小単位からデザインしていくUIデザイン手法
Atomic Design(アトミックデザイン)は、原子(アトム)から始まる5段階に分類できます。
Lv1 原子
Lv2 分子
Lv3 生体
Lv4 テンプレート
Lv5 ページ
という内訳になってます。
詳しく観ていきましょう。
Lv1 原子
Lv2 分子
Lv3 生体
Lv4 テンプレート
Lv5 ページ
という内訳になってます。
詳しく観ていきましょう。
Atomic Designを詳しく見てみよう。
例えば、このページでいうとこういう内訳になります。
Lv1 原子
最小単位です。言い換えるとパーツ。
Lv2 分子
小さなひとかたまりの部品。言い換えるならコンテナのようなもの。
Lv3 生体
ヘッダーやフッター、記事一覧など、ある程度まとまったセクション単位。
Lv4 テンプレート
中身が入っていない状態のあらゆる集合体。ほぼページ。中身が入れば完成。
Lv5 ページ
ここが最終的な完成。
この記事を書いた人
ミワタ
UXデザイナー
ミワタ
UXデザイナー