見出し画像

『ちいさくはじめるデザインシステム』に関わったので読んでくれ

こんにちは。例によってごぶさたしております、関口です。
超・久々に出版関係のお知らせがあり、いち個人として記事をしたためています。

  • 共著が出たので知ってほしい、買ってほしい

  • デザインシステムの運用についてがっつり扱った日本語書籍

  • ちいさくはじめて、おおきく捉えることもできる懐の深い内容

つまり HYPER GOOD なのでぜひ手にとってみてくれよな! というのが本記事のすべてです。


共著が出たので買ってほしい(率直)

このたび 2023年3月15日、BNNさんから書籍『ちいさくはじめるデザインシステム』が刊行されました。めでたい。ほんとうにめでたい。

書籍『ちいさくはじめるデザインシステム』が木のテーブルに二冊置かれたイメージ写真。奥に電子版が表示されたiPadも見える


シーンに貢献するための、デザインシステム「青本」

これは、本記事執筆時点ではまだ珍しいと言っていい、デザインシステムについて日本語でまとめた商業出版本です。青いです。わかりやすい。いいね。

現在僕が所属しているSmartHR社デザインシステム関係メンバーが共著に並び、同社のケースを “ひとつの事例” として軸に据え、ときに生々しく具体的に、ときに俯瞰して概念をまとめた、「デザインシステムをつくり運用する」ことにフォーカスした書籍です。

SmartHR Design Systemの事例をベースにしてはいますが、初期構築期・拡大期など、読む方の様々な状況をふまえて、好きなところを読んで広く応用していけるように編集されています。
デジタルプロダクトのデザイナーはもちろん、それ以外のデザインに関わるメンバー、ライティング、または、デザインへのコミットが求められているが意義がわからん…といった分野の方にも参考にしていただける、多様な観点が盛り込まれたものになっていると思います。


複数の専門家・メンバーによる共著

僕の関わりについては、書籍企画の構想や超草案、座組みづくりのフェーズが主体でした。構成・執筆といった書籍制作の主なフェーズは、あぐりさんを始めとした、領域を横断した有志メンバーの活躍によって推進されました(僕の担当ページもあるよ)。それにより、デザインシステムの意義や可能性の広さがよくわかるものになっています。
いやあしかしよく出たなあ…ほんとに…みなさま、おつかれさまでした…!

下記のnote記事で「はじめに」全文や、編纂にあたっての背景などが公開されていますので、ぜひ読んでみてくださいね。(2023/03/17 追記)

また本書は、充実した内容の「人が見えるコラム」と、「具体的実例と汎用的知識との往復」も、特徴的な部分だと思っています。よろしければこちらも素敵な記事なので、ぜひ読んでみてください。(2023/03/17 追記)


みどころを紹介する

実際どうなのよ、青本

内容については「ご自身で読んでいただいたほうが早くて正確」なので多くは語らないのですが、それでは宣伝にならない・・・

ので。ここはひとつ。僕の視点から「実際にできあがった書籍を手にとってみて、改めて目に止まったところ」を写真でご紹介してみたいと思います!(実際、どこも良くて紹介しきれないんです…)

  1. 目次から内容の全体感を紹介

  2. 装丁など見栄えの紹介

  3. 気になったトピックをランダムに紹介

そんな構成で、たっぷりチラ見せ(?)してみたいと思います。

ご興味もっていただけた方は、ぜひ『ちいさくはじめるデザインシステム』、読んでみて(というか買って)くださいね! 何気なくめくったり貸し借りしやすい単行本と、参照性・可搬性のあるKindle版があります!!!

それではどうぞ。




自宅テーブルの上で、パラパラと書籍をめくり、僕の視点から何気なく目に止まったところを撮ってみた写真を羅列していきます。


1. 目次と全体感

1章「デザインシステムについて考えよう」、2章「デザインシステムを作るコツとステップ」、3章「デザインシステムに何をどうまとめる?」、4章「デザインシステムを続けやすくしよう」、5章「デザインシステムの正解は1つじゃない」
目次。1章に根幹となる考え方を。2章は実例を踏まえつつプロセスを紹介。3〜4章で具体的な手法を多面的に紹介し、5章では世の中の事例について掲載しています


2. 装丁や本自体の様子

カバーの様子。マットな質感の紙に、微妙な質感変化が工夫されています。ブルー、きれいですね
帯。「だれでも・効率よく・迷わずに。」を実現するデザインシステムの作り方 。これ以上ない帯文!
こちらもカバー表面、縦書きの書籍タイトル。類書が並ぶなかでは特徴的な書影ですね! 最小限の要素で構成されています
Kindle版はリフロー形式。手持ちのiPadで閲覧してみましたが、表示調整できるのはいいですね〜
カバーを外した本体表紙。日本語タイトルもなく極端に要素が少ない! デスクに置いてもノイズにならない選択肢
すべて欧文で、あえて弱いコントラスト比になっていることで柄のよう。青い物体のように見えます
扉のレイアウトと本文の様子
要所要所には、ていねいに図解も入っています


3. トピックいろいろ

5章「となりのデザインシステム」。複数の異なる組織にアンケートを実施、回答いただきました。大変興味深いです
4章の冒頭文。デザインシステムをどう続けるか
3章の一節「デザインレビュー」。レビューは超・重要です。存外これに触れている本は多くないのでは
3章デザインパターンの一節「よくあるテーブル」。命名の重要さよ
コラムが大変充実しているのも実は見どころです。これは「組織への浸透」について
3章の「文字コンテンツ」について。「誰でも書けるからこそ、指針が必要になる」いい見出し
3章「タイポグラフィ」。プロダクトの文脈で「ウェブデザインの95%はタイポグラフィ」という言葉が引用されています
3章「デザイン原則」。まず、デザイン原則の機能や必要性について示されています
コラム「運営理念の言語化」。思想や哲学のないデザインは空虚です。はい、そう思います(私です)
3章「イラストレーション」の、楽しさに流されない、という印象的な見出し
3章「色」では、不確定な色という要素を合理化する価値の、福利についても
同じく「色」では、カラー定義の方法論や決めどころにも触れられています。難しいですよね
3章「ロゴ」では、ロゴにガイドラインを設ける目的・スタンスの重要性から、具体例までを
3章冒頭イントロダクション。べき論で語るものではないよ、という考え方
2章冒頭。「運用の壁」として、着手と浸透についてステップ式で示されていきます
1章の一節。機能し続けるデザインシステムを作るためには、そもそもデザインシステムの「システム」について考える必要がある
1章の構成。デザインシステムとは/誰のためのデザインシステム?(プロダクト・コミュニケーション)/デザイナーだけのものではないデザインシステム
3章「コンポーネント」では早すぎる抽象化問題と実際の再利用性について
3章デザインパターン。SmartHRにおける考え方の整理と「パターン」の捉え方について
3章「用字用語」では、そもそもの前提からしっかりと解説



さあ、読みたくなっただろう(なりませんか?)

ここまで目を通してくださった方は、かなり書籍について気になっている状態ではないでしょうか! いや、そのはずだ!

https://www.amazon.co.jp/dp/4802512481/

そうでなくても、もし何かの機会に思い出したらぜひ「青本」、目を通してみてくださいね。我々の経験が知識となり、だれかの知恵として活かされたなら、それが何よりうれしいです。

我々の活動は完成することなく、常にワークインプログレスで進んでいます。そして、あらゆる方のナレッジがオープンに共有され、われわれ全体が少しでもよりよくなる、そんな世界を願っています。

それではまた。





著者:大塚亜周 、 稲葉志奈 、 金森 悠 、 samemaru 、 圓山伊吹 、 植田将基 、 関口 裕 、 8chari 、 後藤拓也 、 小木曽槙一 、 桝田草一
編者:大塚亜周 、 稲葉志奈

ブックデザイン:市東 基(Sitoh inc.
レイアウト:次葉
編集:石井早耶香、村田純一(BNN


※2023/03/17 改訂

この記事が気に入ったらサポートをしてみませんか?