海外の動向からみるデザインツールの現在

デザイナーとツールは切っても切り離せない関係です。ときにはデザイナーのスキルはツールの熟練度や使い分けの仕方で決まることもあります。長く使い続けたいですが Web やアプリのデザインは、テクノロジーと密接に繋がる仕事であるが故に、いつの間にか新しいツールが主流になることがあります。

特にここ 10 年でデザインの仕事は大きく変わりました。今でも Web デザイン、アプリデザインにおいて Adobe 製品は多大な影響力をもっていますが、それがほぼ唯一の選択肢だった頃と今は違います。また、今まで以上にデザインにスピードと柔軟性が求められているので、Adobe 以外のツールも必要になってきています。

では実際、世界のデザイナーはどのようなツールを使っているのでしょうか。ニューヨークのデザイナー Khoi Vinh さんが、The Tools Designers Are Using Today でまとめています。世界の Web / アプリデザイナー 4,000 人の声が集まったツールの『今』を示す調査結果です。

以下気づいた点と、私が使っているツールなどを紹介します。

目立つSketchの成長

UI デザインは Photoshop より Sketch のほうが使われているようです。特にスタートアップでは人気で、ワイヤーフレーム制作だけでなく、アイデア出しも Sketch が使われていることがあります。しかし、「使われている」というだけで、まだメインツールとして使われ始めたばかりというのが現状。特に比較的大きなデザイン会社だと Windows ユーザーも少なくないので Photoshop に頼っているところが多いようです。

私は今でも Photoshop / Illustrator は使っていますが、最も開いているデザインアプリは Sketch です。このサイトの記事の挿絵も Sketch で描いています。

不満がないわけではありませんが（特にテキスト周辺）、とにかく早いのと、豊富なプラグインと素材集をつかって効率的に形作ることができます。あと CSS で出来る装飾しか Sketch で作れないという機能制限も良いところ。Photoshop だと Web で再現するのが難しい繊細な表現が作れてしまいますが、Sketch であればコードとして生成できるものしか作れないので現実のものに近くなります。

意外とシンプルなファイル管理

Git でも使ってファイル管理をしているのかと思えば、人気なのは Dropbox。インストール後何も操作しなくて良い手軽さと、簡易バージョン管理が付いているのが魅力なのでしょう。GitHub のようなサービスは大企業からフリーランスまで利用者が増えているようですが、バイナリデータのバージョン管理がコードのようにいかないのが Dropbox が選ばれている要因かもしれません。

デザイナー向けのバージョン管理といえば Pixelapse や Pics.io がありますが、あまりに特化し過ぎていて開発者には少し遠い存在になっています。結局、開発寄りの組織であれば Git を使っているところが多いので、その環境にデザイナーが『合わせる』といったところは少なくありません。

個人プロジェクトでも Git を使うようにしていますが、デザインアセットに関してはバージョン管理というより単なる保管場所になっているのが現状です。Sketch にバージョン管理機能がありますが、ファイルサイズが膨れ上がる可能性があるので注意が必要です。

WebであればなるべくHTML/CSS

肩書きがデザイナーという方を対象にした調査ですが、「HTML/CSS」と応える方が多いのが印象的です。ワイヤーフレーム、インターフェイスデザインで上位にランクしているだけでなく、プロトタイプ作成では 38% でトップです。Bootstrap のような強力なツールだけでなく、Jetstrap のようにコードの知識なしでも模索ができるツールも豊富にあるのがデザイナーが HTML/CSS を選ぶ理由でしょう。

デザイナーがコードを書けなくてもエンジニア視点のコミュニケーションを学ぶことで円滑に進めることができます。しかし、レスポンシブデザインやパフォーマンスを考慮したデザインを考えるとなると、Web ブラウザでデザインしたほうが、ユーザーが見る画面と同じわけですから、現実味が増します。また、ちょっとした微調整を開発者に指示するより、値を書いたほうが早いわけです。

フロントエンド技術は専門性が高くなってきているので、ますます分業が進むのかと思いきや、海外では開発者とデザイナーが重なり合う部分が多いように見えます。私がアメリカのデザイン会社に勤めていた頃も、ビジュアルデザインだけでなくコードも書いていましたが、当時とあまり変わらないかもしれません。

混戦状態のプロトタイプ制作

Web であれば「HTML/CSS」が人気ですが、それ以外のツールは混戦状態。inVision が 16% とリードしているものの、10% 以下で無数のプロトタイプツールが並んでいます。「他のツール」と答えている方が 30% もいることを考えると、皆プロトタイプツール選びに悩んでいることを物語っています。

意外と健闘しているのが Keynote。私自身、アプリのプロトタイプを Keynote で作ることがありますが、調査結果でも上位にランクインしていました。iOS アプリであれば Keynote は再現性が高いですし、共有も比較的しやすいのも魅力です。ただ、Keynote だけを使うということはほぼなく、調査結果でランクインしている他のツールも使っています。最近であれば Principle や Flinto for Mac のようなアニメーションに特化したアプリも使い始めています。

注目が集まるプロトタイプですが、デザインの模索ができるワークフローに変えなければ機能しません。ツールを取り入れただけでは、かえって負担になることがあります。それを物語っているのか、プロトタイプツールを使ってないと応えた方は 36% もいます。ツールには興味があっても取り入れ方が分からないのでしょう。プロトタイプを活用したデザインプロセスはまだ始まったばかりです。

まとめ

回答者の 6 割近くがアメリカとイギリスのデザイナーなので、調査が偏っているところはあります。しかし、デザインツールが大きく変わってきているのは、日本にいても分かります。時代や環境に合わせて柔軟にツールを選ぶのも、デザイナーに必要とされる能力です。

もう少し詳しくデータをみたい方は、ぜひ The Tools Designers Are Using Today をご覧ください。企画をした Khoi Vinh さんによれば、この調査は毎年やる予定なので、次回は参加してみてはいかがでしょうか。