NOTE 007 / 2018年
小さな部品から影響範囲を考える
画面を小さな単位に分け、道具の選定と結びつける考え方です。
Atomic Design は、画面を原子、分子、有機体といった単位に分けて考える方法です。名前を覚えることより、どの単位で再利用するかを決めることが大切です。
技術選定では、小さな部品ほど影響範囲が広くなります。ボタンや入力欄の設計を先に決め、その上に画面を組み立てると、後から変更しても全体が崩れにくくなります。
押さえたい点
- 01再利用する単位を決める
- 02小さな部品から設計する
- 03変更の影響範囲を考える
参考資料
外部サイトが開きます。内容は各サイトの管理下にあります。
- Nuxt 入門 外部サイトnuxt.com
- Nuxt モジュール 外部サイトnuxt.com
- Nuxt の描画 外部サイトnuxt.com
- Vue.js ガイド 外部サイトvuejs.org
- Firebase ドキュメント 外部サイトfirebase.google.com
- Firebase Hosting 外部サイトfirebase.google.com
- Cloud Firestore 外部サイトfirebase.google.com
- デザインを学ぶ 外部サイトweb.dev
- MDN Web Docs 外部サイトdeveloper.mozilla.org
- web.dev 外部サイトweb.dev
- W3C WAI 外部サイトw3.org
- GitHub Docs 外部サイトdocs.github.com
- Chrome for Developers 外部サイトdeveloper.chrome.com