The CollectiveのMultiplayerものづくり

Events



デザイナーの役割とともに進化するDesign Tools


前半の「The Role of Designers」の中で、Design Opsにも「ツール」が登場しました。ワークフローを考える上で、最適なツールの選定は欠かせない要素です。

デザイナーの役割が変化するのに合わせて、ツールも進化しています。特に最近は、デザインツールが急に増えてきたように感じます。デザイナーとしては、こんなに選択肢があることはとても嬉しいです。そんな我々デザイナーの注目を集めるために、ツール業界では熾烈なデザインツール戦争が起こっているといってもよい状況です。その中でも、この5つのプレイヤーが今最もポテンシャルがあり、多くのデザイナーに使われていると思います。

  • Sketch
  • Invision Studio
  • Figma
  • Adobe XD
  • Framer X

どのツールも、誰かと一緒にコミュニケーション・コラボレーションすることを前提に機能を進化させています。そのベースには、デザインは1人ではなく、チームでつくるものだという共通の思想を感じます。このプレイヤーの中でも、チームでコニュニケーション・コラボレーションできるデザインツールというのがFigmaです!Figmaでは、プロダクトを短期間で、簡単に、複数で一緒に作ることができます。

FigmaのKey Pointは3つ。

  • Web技術で作られているので、リアルタイムで更新される
  • 直感的な操作でデザイナーじゃなくても誰でもすぐ使える
  • 同時に、同じファイルで、複数で一緒にデザインを制作できるMultiplayer機能

これらの要素から、今現在、Design Opsの考え方にも最もフィットしているツールだといえると思います。

The Collectiveの課題


さて、やっと(笑)本題に入ります。私たちThe CollectiveがFigmaを利用して実践している制作プロセスの話をしたいと思います。そもそも私たちはデザインコンサルティング会社なので、クライアントと一緒にプロダクトをつくる、という制作プロセスが中心です。

そしてクライアント社内だけでなく、さらにその先にもクライアントの外部パートナーや株主、メディアなど関係者が存在します。弊社の社内より社外に関係者が多くいるため、デザインのプロセスがオープンであることが必要なのです。

また、このような状況であるために絶対に避けたいのは「関係者間の認識のズレ」です。デザイナーが作り込んで見せたものの、コミュニケーションと共有が足りなくて、相手が想定しているものとズレてしまう、デザインの現場ではよくあります。

つまり弊社の課題は、

ステークホルダーが多い仕組みの中で、みなが認識を合わせてスムーズに質の高いデザインを作るにはどうしたらのよいか?

であり、これに対してDesign Opsの考え方を利用し、私たちデザイナーがリーダーシップをとり、プロセスとツールを選んで導入することで、コラボレーションがスムーズに行えるフローを確立しよう!と考えました。

そして課題を解決するための必要条件として、3つの要素を洗い出しました

1.Real-TIme

時差なくスピーディーな対応ができる

2.Easy

学習コストを最小限に。誰でもすぐコツを掴める

3.Collaborative

オープンにして、みんなで一緒に作る

この3つを実現させた「Multiplayerものづくり」のワークフローを生み出しました。

Multiplayerものづくり


そもそも「Multiplayer」とはなにか?

いろんな場面で使用される言葉ですが、私たちが想定したのは「マインクラフト」というゲームでのMultiPlayerです。

マインクラフトはブロックで物を作るゲームです。1人で作った場合は、このような家が作れます。

確かに楽しいのですが、1人だとリソースも少なく、友達からアイディアや刺激をもらうこともないので、限界があります。しかしMultiPlayerで作ると、こんな大きな街が作れます。

みんなで作れば発想力が高まり、リソースもあるので協力して、短時間でも、質が高いものを作れるのです。こんなにも違いを生み出すことができる、これが「MultiPlayerなものづくり」です。

ツールとプロセス


私たちが使うツールは

  • DropboxPaper
  • Figma

のたった2つです。プロジェクト概要や仕様を書き出すのはDropbox Paper、デザイン制作やデザインに対するフィードバックは、Figmaを使用します。

どちらも共有することを前提に作られており、リアルタイムで更新されるのでいつでも最新版を確認できます。

またどちらも経験者(デザイナー・開発)でも初心者(ビジネス側)でも、使いやすく設計されているツールなので、学習しなくても誰でもすぐに使用できます。

この2つでReal-Time、Easyは実現しました。

さらにCollaborativeはFigmaでの共同制作、共同編集で実現しました。

当初1人でFigmaを使用していた時には他のツールと違いがあまり把握できなかったのですが、チームと一緒に使うようになって、1つのファイルを共同制作できることに皆が感動しました。

共同編集もできるので、役割を分担して作業することも可能です。例えば私がデザインを作り、社内の人間が文章を編集しながら、クライアントがデザインと仕様を確認することが日常になりました。

デザインツールとして、共同制作と共同編集ができるのは、非常に画期的です。

また、コメント機能でデザインに直接フィードバックを入力することで、Figma上でコミュニケーションが生まれ、問題を即座に解決することができます。

クライアントと打ち合わせができない場合でも、随時コメントでフィードバックをもらえるので、すぐに対応ができます。

さらに、FigmaはWeb技術で作られているので、リンクを教えるだけでFigmaを使っていない人も、ブラウザで、デザインの確認や編集ができます。デザインのデータ更新することなく、最新版のデザインがいつでも関係者の手元にある状態を作り出せます。

データへの書き出し作業も共有された側でできるので、デザイナーが毎回書き出す必要がなくなります。

例えばSketchの場合、デザインに対してフィードバックをもらうために、ZeplinかInvisionを使ってデザインファイルを共有します。共有したファイルはリアルタイムのものではないため、デザインを更新するたびにこの作業が発生します。

今もこのフローで作業しているデザイナーさんがいらっしゃるかもしれませんが、Figmaなら、この作業自体がもう必要ないのです!以上、たった2つのツールの導入で、Multiplayに必要な3つの要素を満たすワークフローを組んで、私たちはこんなに良い結果を手にすることができました。

まとめ


このようにThe Collectiveは実際に制作プロセスを改善して、アウトプットの質が高まり、量も増やすことができました。私たち自身も「DesignOps」というプロセスと、「Operations」の考え方の力を改めて理解したのです。

つまり、今のデザイナーは

最初に、個人中心の考え方から、組織のニーズを意識する考え方にシフトしなくてはいけません。

そして組織のニーズを満たす為に、DesignOpsなどの手法を理解して活用することで、組織全体のアウトプットの質と量を高め、その結果、良いプロダクトを生み出すことができます。

デザイナーのミッションは、良いプロダクトをユーザーに届けることです。

それを達成する為に、デザイナー主導でものづくりの現場を進化させることが、今のデザイナー求められている役割だと考えます。

私はそう思って日々実践しています。こういうデザイナーが世の中に増えていったら私も嬉しいですし、日々の生活は楽しく良いものになっていくと信じています。


イベントでは、デザインツールFigmaを選ぶにいたったデザイナーの環境や背景、思考などをこのようにお話しました。

「Figma」はもちろん「Design Ops」などもっと知りたい、と思った方は、お気軽にinfo@collective.tokyo までご連絡ください。

デザイナーの未来について一緒に考えていきましょう。