なぜ多彩なデザインツールが出てきているのか

2010年代は『革命』

2000年代であれば、デザインツールは Adobe 以外の選択肢を考えることができませんでした。小さなツールは幾つか出ていましたが、仕事で使おうと思えるデザインツールはほぼ皆無。しかし、2010年に Sketch が登場して以来、状況が大きく変わり始めてきています。他に使おうと思えるものがなかった 2000 年代に対し、2010 年代は次から次と魅力的なツールが登場しています。今では「また出た」とウンザリしている方もいるかもしれませんが、2000 年代の静けさと比べると革命といって良いほどデザインツールが増えています。

こうした変化のなか、Adobe も Experience Designer という Creative Cloud には今までなかった種類のアプリを 2016 年にリリースしました。今までデザインツールを独占していた Adobe でさえ、2010年代に起こっている変化に対して何かしなければいけないという想いが強くなったのでしょう。現存ツールを強化するのではなく、まったく新しいツールをあえて作ったのは大きな意味があると思います。

そもそも、なぜ増えているのでしょうか？

ここ数年に起こっているデザインツールの変化を「プロトタイプブーム」と表現することができるかもしれません。プロトタイプツールは無数に存在しますし、「プロトタイプを作りましょう」といった論調もよく聞きます。しかし、様々なデザインツールが出てきている理由は、「プロトタイプを作る」という行為だけで片付けるのは安易です。

ツールはデザイナーの仕事を映し出す鏡ような存在です。ツールは、デザイナーがしたいこと、デザイナーがアウトプットするべきものを実現する存在だと思います。2000 年代、ツールに大きな変化がなかったのは、良くも悪くもデザイナーの仕事（役割）にそれほど変化がなかったからかもしれません。

今起きているデザインツールの多様化は、デザイナーの役割が大きく変わり始めていることに対する答えだといえます。つまり、従来のデザインツールでは、今のデザイナーに求められているアウトプットが難しいからこそ、新しいツールが解決のための提案をしているのだと思います。

ツールが解決しようとしている課題

では、具体的にデザイナーの仕事がどう変わったのでしょうか？ 今出回っているツールの機能に注目すると、デザイナーに課せられたテーマが浮き彫りにされます。今必要とされているツール、そして今後必要とされるツールは、以下の 5 つの課題に取り組んでいるように見えます。

1. デザインアセットの共有

デザインを作ったからあとはヨロシク… と、エンジニアに渡して終わりというわけにはいかなくなった今日のデザイン。単にデザインファイルを共有するだけでなく、どのような動きをするのか、どれくらいの寸法なのかも伝えなければいけません。画面としてのデザインだけでなく、部品をデザインして、それらの維持・管理も必要になってきました。

Web サイト向けのスタイルガイドはフロントエンド寄りですが、今はデザイン側でもスタイルガイドのようなものを作ることが必須になりつつあります。Craft を使えば、コードを書かないデザイナーでもパターンライブラリが作れるようになりましたし、Sketch のシンボル機能も 39 になってからようやく使えるレベルになってきました。寸法とアセットの受け渡しであれば Sympli も良い選択肢です。

2. よりオープンなコミュニケーション

コラボレーションにはリアルタイム性が不可欠です。メールのような非同期コミュニケーションでは、ちょっとした調整すら時間がかかってしまいます。デザインに関わる人たちが同じ考えをもっているか確かめながら進める場合、デザインがいつでも見れる状態であり、参加者がコメントがしやすいほうが進めやすくなります。

最近のデザインツールは「作れる」という部分だけでなく、「共有できる」という部分も強く押し出しています。単に画像をメールで添付して送るのではなく、実機で操作ができる状態で共有できるわけです。作ったものの共有だけでなく、作るプロセスにも共有の考えを取り込んでいるのが Figma。デザインプロセスをツールごと完全にオープンにすることで、デザインの参加の仕方が劇的に変わりそうです。

3. 可変デザイン

多彩な形状のデバイスが使われるようになり、可変でデザインを考えなければならないのにも関わらず、デザインツールの多くは固定の世界。Sketch のシンボル機能や、Fluid のようなプラグインを組み合わせることで、なんとなく可変デザインはできますが、スクリーンの大きさでどう変わるのかルール付けが難しいです。

Android Studio の Layout Editor、XCode の Interface Builder には可変で考えやすい機能が用意されていますが、デザイナーが扱うツールでも似たアプローチが必要です。Web デザインであれば Webflow が提案している可変デザインの機能も注目です。

4. データを使ったデザイン

アプリ / Web デザインにおいてダミー文字は禁じ手ですが、わざわざ本物に近いデータを用意するのに時間がかかるから諦めていた人も少なくありません。それでも以前はダミー文字でデザインの意図を伝えることができましたが、スクリーンサイズの多様化、文脈が複雑化してきたことによって、より本物に近いかたちで検証したいというニーズが高まっています。

Craft や Data Populator を使えば、JSON 形式のデータを読み込んでリアルタイムのデータを Sketch で表示させることができます。Sheetsu を経由させれば、Google シートと連携させた即席 API を用意することができます。こうしたデータの連携をする方法は今後ますます増えるはずです。

5. それなりのものを早く作る手段

癖はそれぞれありますし、不十分なことも少なくありませんが、最近のツールは 40, 50% くらいのものをとても早く作ることができます。早くそれなりのものが作れるように機能が絞り込まれていますし、星の数ほどある UI キットを使ってデザインすれば、1 週間待たないと何も見れないということもないわけです。

スタジオに籠ってひとりで戦うというのが従来のデザイナーの姿であれば、今はその逆です。今のデザインツールは、とりあえず何かアウトプットして、周りからフィードバックを得るための『軽さ』があります。Adobe XD も軽さ・速さを重視して、作り込みするための機能実装に消極的なのも、早く作ってとりあえず見せるという行為を助長させたいからかもしれません。

まとめ

様々なデザインツールが登場しているのと、デザイナーの仕事の仕方が変わり始めているのは、偶然の一致ではないと思います。デザイナーに求められているアプトプットや役割が変わってきているからこそ、ツールはそれに応える機能を実装していますし、それを受けてデザイナーも徐々に『最適化』を始めています。プロトタイプを作るという行為だけでは見えにくいですが、今のデザインツールが何を解決しようとしているのかに注目することで、今後のデザイナーの姿がボンヤリ見えてきます。

スピードと透明性が求められていますが、それは作り込みは必要とされていないわけではありません。むしろ、そこに関しては昔からあるツールが十分な役割を果たしていますし、これからも変わらないでしょう。だからこそ、今のデザインツールは『ビジュアルデザインを作り込む』という領域に深く入っていないのかもしれません。ただひたすら作り込むだけがデザイナーの仕事ではなくなってきているからこそ、他のツールが補うことになっているのでしょう。