こんにちは、デザイナー・ブロガーの
ゆっきー（@elcielo_design）です。
今回は、デザインシステムの
参考になる本をまとめた記事になります。
この記事の目次
デザインシステムの書籍・本
この記事では、デザインシステムを
学べる本を紹介していきます。
特に、次のような人は読んでみて下さい。
- デザインシステムの参考書が知りたい。
-
プロダクトやUI/UXデザインを学びたい。
-
Webデザイナーを目指している。
また、デザイン書籍等を1ヶ月無料で読むなら、
Amazonの「Kindle Unlimited」がおすすめ。
デザインシステムの書籍・本まとめ
「デザインシステムの書籍・本の一覧」
| 系統 | 書籍名 |
| デザインシステムの作り方 | ちいさくはじめるデザインシステム 「だれでも・効率よく・迷わずに。」を 実現するデザインシステムの作り方 |
| デジタルプロダクトのための デザインシステム実践 |
Design Systems デジタルプロダクトのための デザインシステム実践ガイド |
| Figmaを使った デザインシステム |
Figma for デザインシステム デザインを中心とした プロダクト開発の仕組み作り |
| グリッドシステム | グリッドシステム グラフィックデザインのために |
下でそれぞれ詳しく紹介しています。
ちいさくはじめるデザインシステム
「だれでも・効率よく・迷わず。」を
実現するデザインシステムの作り方
人事・労務領域の業務アプリケーションSaaSを
提供しているSmartHRのデザインシステムの
立ち上げ前から、現在までの取り組みを
ケースとして扱いながら、デザインシステムの
構想・構築・運用について、一般論を含めて
解説した本。
| タイトル (書籍名) |
ちいさくはじめるデザインシステム 「だれでも・効率よく・迷わずに。」を 実現するデザインシステムの作り方 |
| 価格 | ¥2,860 (税込) |
| 発売日 | 2023/3/15 |
| 特徴 | ・Smart HR Design System運営チームが 明かすデザインシステムの構想・構築・運用の プラクティス。 |
| 内容 | 1 デザインシステムについて考えよう (デザインシステムとは / 誰のためのデザインシステム？｜ プロダクト ほか) 2 デザインシステムを作るコツとステップ (デザインシステムをはじめる3つのステップ / デザインをみんなのものにする3つのステップ) 3 デザインシステムに何をどうまとめる？ (イントロダクション / 運営理念 ほか) 4 デザインシステムを続けやすくしよう (デザインシステムの運用 / 外部サービスとツール ほか) 5 デザインシステムの正解は1つじゃない (となりのデザインシステム ほか) |
| おすすめの人 | ・デザインシステムの作り方を学びたい人 |
| その他 |
Design Systems
デジタルプロダクトのための
デザインシステム実践ガイド
「デザインシステム」とは、デザインの
原則、概念、ガイド、コンポーネント等、
デザインに関するあらゆるルール (法則) を
定めたもののことです。
この本ではそのデザインシステムについて
基本から応用まで学ぶことができます。
| タイトル (書籍名) |
Design Systems デジタルプロダクトのための デザインシステム実践ガイド |
| 価格 | ¥3,080 (税込) |
| 発売日 | 2018/12/25 |
| 特徴 | ・AirbnbやTED等の欧米のデザイン主導型 企業で導入されている、成功する DesignOpsの実践手法の本。 ・前半の基本編では、デザインシステムの 基礎であるパターンについて解説。 ・後半の応用編では、デザインシステムを 確立及び維持するための実用的な手順と テクニックが書かれている。 ・Webサイトを事例にしているので、スマホ アプリにはそのまま直ぐには適用できない。 |
| 内容 | 1章 デザインシステム 2章 デザインの原則 3章 機能型パターン 4章 認知型パターン 5章 言語 6章 システムの属性 7章 計画と実践 8章 機能型パターンのシステム化 9章 認知型パターンのシステム化 10章 パターンライブラリ |
| おすすめの人 | ・デザインシステムとは何か知りたい初心者 ・実際にデザインシステムを作成したり 運営するデザイナー |
| その他 |
Figma for デザインシステム
デザインを中心とした
プロダクト開発の仕組み
Figmaを使ったデザインシステムの
構築方法が学べるチュートリアル本。
| タイトル (書籍名) |
Figma for デザインシステム デザインを中心とした プロダクト開発の仕組み作り |
| 価格 | ¥3,080 (税込) |
| 発売日 | 2024/4/5 |
| 特徴 | ・「デザインシステムとは何か」から始まり、 実践を通して「どのように作るのか」を 学べる。 ・具体的な作例を用いて段階的に構築。 ・本書で解説する機能を使いこなせば、 既存のデザインプロセスを改善できる。 |
| 内容 | 1 デザインシステムを知る 2 プロフェッショナルなFigma 3 デザインシステムをはじめる 4 デザイントークン 5 タイポグラフィ 6 デザインシステムの拡充 7 パターンライブラリ 8 実装コードとの連携 |
| おすすめの人 | ・Figmaをを使ったデザインシステムを 学びたい人 ・デザインシステムに興味があるけど 何から始めてよいか分からない。 ・Figmaの初歩的な操作方法を理解していて、 次のステップアップをしたい人 |
| その他 |
グリッドシステム
グラフィックデザインのために
統制の取れたデザインを作るための
最も簡単な方法の1つが「グリッドシステム」
この本では主に欧米文の印刷物を対象として
グリッドを用いたテキストや
図版の組版について解説しています。
「デザインシステム」の本ではないですが、
グリッドはグラフィックデザインだけでなく
デザインシステムといった幅広い概念の中で、
レイアウトやパーツを定義する時にも使います。
なので、デザインシステムの基礎と言える
グリッドシステムについての本もおすすめ。
| タイトル (書籍名) |
グリッドシステム グラフィックデザインのために |
| 価格 | ¥7,150 (税込) |
| 発売日 | 2019/11/9 |
| 特徴 | ・ヨゼフ・ミューラー = ブロックマンによる 「Grid systems in graphic design」の全訳 ・現代グラフィックデザインの基本書として 最重要著作の一冊。 ・ビジュアルコミュニケーションの歴史的 視野のもとグリッドシステムの方法と思想を 解説をしている。 ・全184ページ、357の豊富な具体例や図版を 交えていて分かり易い。 ・グリッドシステムによる組版設計を実践、 探求してきた白井敬尚氏による日本語版 デザインで翻訳刊行。 ・原書の仕様を反映した上製本。 |
| 内容 |
|
| おすすめの人 | ・統制の取れたUIデザインを作りたい人 |
| その他 |
まとめ
以上がデザインシステムの参考になる本でした。
この記事では、ジャンル別で本の内容を
紹介してるので、それに目を通してみて
自分に合う本を見つけて下さい。
なお、イラストやデザイン関連の書籍は、
下の記事に一通りまとめています。
