Design Systems by Figma

Design systemsというFigmaが公開しているwebサイトがあります。

デザインシステムについての情報のまとめサイトといった体で、なかなか面白い記事が揃っています。

A Figma publication for design systems creators, designers, developers, and managers

リアルタイムに共同で編集できるSketchといった感じでユーザ数を増やしているFigma。デザインツールを作る会社が積極的にデザインのプロセスについて研究している様子は、本当にユーザに向けてものを作っている感じがして尊敬できます。

Contributeのためのフォームも用意されているのでアイデアがあれば送ってみましょう。

参考：SketchとFigmaの比較記事（バイアス強め）

デザインシステムの歴史的瞬間（Key moments）として下記の4つが挙げられています。

1977 A Pattern Language

町・コミュニティ、建物、構造・施工・インテリアに関するデザインパターン253種類を羅列した歴史的名著。オブジェクト指向プログラミングのデザインパターンの元になった本でもあります。高いですが、有名な本なので大学や地元の図書館に置いてあるかもしれません。

2005 Designing Interfaces

ウェブやモバイルなどデザインに使えるパターンをまとめた本。今読むと懐かしさしかない。

2013 Atomic Design

UI をモジュール化された階層として組み立てていく方法について体系的にまとめたもの。細かな原子（atom）から分子（molecular)を作り、さらに大きな組織（organism）を作り、といった具合。色々なところでなんとなく実践されていた方法をうまくまとめたのでみんなが膝を打った。

2014 Material Design

Googleのマテリアルデザインも5周年。ここからデザインシステムやガイドラインに対する注目度が一気に上がった気がします。モーションデザインを体系的に取り込んだのもマテリアルデザインが最初だと思います。 去年大きなリニューアルが行われ東京でもイベントが開催されました。

こうしてみるとUIデザインも多探り状態から随分体系されてきた気がします。今のアメリカの学生が受けている教育などを見ると、就職してすぐに役立つような実践的な手法やプロセスが教えられていてちょっと前とは隔世の感があります。とりとめなくなりましたが以上。