プロトタイプが閉じたデザインを切り開く

12月12日、名古屋にて WCAN 2015 Winter が開催されました。今年はスクリーンが 32:9 という超ワイドスクリーンがある会場でした。今までにないスライドデザインで困難なところが幾つかありましたが、良い経験をさせてもらいました。会場や観客に応じてスライドデザインは工夫していますが、その大切さを改めて痛感したイベントでした。

登壇内容も含め、イベント全体に関するレポートを参加した方々が公開しています。ぜひこちらも参考にしてください。一緒に登壇した佐藤歩さん（@ahomu）の「HTML6 でも CSS4 でもない Web 技術のゆくえ – WCAN 2015 Winter に登壇してきました」も必読です。

• WCAN 2015 Winterに参加してきました – LOGzeudon
• WCAN 2015 Winterに参加しました – focusmark.jp
• WCAN 2015 Winterに参加しました。 セミナー – ウェブDeBLOG
• WCAN2015winter 参加レポート #wcan – ふにろぐ

例年 WCAN では、コンテンツをテーマにした講演を続けていましたが、今回はプロトタイプを取り上げました。プロトタイプはこのサイトでも 長年執筆し続けていますし、3 年前になりますがデジタルハリウッド大学院で講師をした経験もあります。本イベントで話した「あたかもプロのようにプロトタイプを活用する方法」は今で得た知識と経験を 50 分にまとめた集大成版ともいえる内容でした。

どのように理解を共有するか

Webサイトやアプリが完成するまでの過程で、理解を共有するために様々なモノを作ります。利用者は何を考え、どのように製品・サービスと関わるのかを共有するためにペルソナやカスタマージャーニーマップを用いることがあります。また、ユーザーケースをまとめたり、データのモデリングをすることも開発に関わる課題を共有するためのツールです。プロトタイプも理解を共有するために用いますが、他のツールと同様、使い方を謝ると手間が増えたり、誤解を招くことがあります。

デザインとひとことで言っても様々な課題がある

ひとつの手法で多くの課題を解決しようとすると、コミュニケーションに摩擦が生じることがあります。例えば Web デザインで用いられているデザインカンプは、デザインの様々な課題を一度に解決しようとしていることがあります。操作性とビジュアル言語は別々で解決するべきですが、それをデザインカンプという『一枚の絵』で表現すると、以下のような問題が生じます。

• 幾つかの課題を一度に解決しようとするので制作時間がかかる
• 多く積み上げたものを提出することで、出戻りした際のリスクが高くなる
• 優先的に解決したいことがあっても目立つところの話になってしまう

デザインに関わる様々な課題を共有・解決したあとに、「最終的な全体の雰囲気の確認」としてデザインカンプを用いるのであればうまく機能するかもしれません。今のデザインに必要とされるコントロールでも紹介したように、デザインカンプが抱えていた様々なデザインの課題を切り分けて、手法に落とし込む必要があるでしょう。

多くの課題を一度に解決しようとすることで、ミスコミュニケーションが発生するのはデザインカンプだけのことではありません。ここ 1, 2 年で、多機能なプロトタイプツールがたくさん使える状態になりました。手軽にプロトタイプが作れる環境は整ったものの、ただ作るだけだとデザインカンプと同じ問題に遭遇します。

そもそもチームメンバー又はクライアントとデザインの何を共有しようとしているのでしょうか。「デザインを共有」ではあまりにも範囲が広すぎるので分解が必要です。作るための目的が明確でないと、適したプロトタイプツールを選ぶことも、使いこなすことも難しいでしょう。

デザインのブラックボックス化を避ける

プロトタイプを作る目的は大きく分けて 3 つに分類することができます。共有するための目的がどの部類に近いかを考えることで、適切なツールを選ぶことができるようになります。

例えばアニメーションを誰かと共有したい場合、私は 5 つのツールから状況に適したものを選ぶようにしています。例えば SVG/CSS であれば技術検証に向いていますし、Principle のようなアプリを使う場合はアイデアの共有に最適です。スピードだけを考えるとペーパープロトタイプも良さそうですが、紙ではアニメーションを伝えるときに重要な動きや感覚を共有するのは困難です。

アニメーションを誰と共有するのか、その共有を通して何を達成しようとしているのか。そして、それを達成するための最短距離はどれか。「これだけ覚えておけば大丈夫」というオールマイティなプロトタイプツールはありませんが、状況や目的に合わせて早く共有するためのツールはたくさんあります。

プロトタイプをたくさん作るようになって学んだことは、早く伝えるためなら特定の手段に固辞しないことです。プロトタイプは本物に近い『デモ』を作り込む場ではなく、少しでも早くデザインを外で共有するためにあると思っています。

デザインは専用ツールで作る必要があることから、ブラックボックスになりやすいです。何がどうなっているのか、外側からは何も分からない。けど、いつの間にかだいたい完成したものをデザイナーが提出してくるという場合が多々あります。これだと出戻りのリスクが高くなるだけでなく、思考プロセスが解らないので、何のためにそういうデザインになっているのかの知るためのコストが高くなります。ある程度完成するまで見せないのではなく、デザインを組み立てるプロセスをひとつひとつ見せていく。ブラックボックス化しているデザインを開くためのツールとしてプロトタイプがあります。

まとめ

今の開発スピードにデザイナーがついてくためにも、早く作って共有する癖をつけ始めたほうが良いでしょう。幸い早く作れるツールは年々増えていますし、デザイナーが納得できるクオリティを早く共有できるものも出てきました。ツールは出揃いつつあるので、あとはデザイナーがプロトタイプを作るために考え方の変換が必要になります。未完成のものを共有することは恥ずかしいことでもないですし、スキルがないわけでもありません。

たとえ視覚的なところの話だけだとしても、デザインをデザイナーひとりで抱えるには難しい課題がたくさんあります。プロトタイプをコミュニケーションツールとして活用することで、デザインに関わる課題を共有しやすくなるはずです。数多く存在するプロトタイプツールを選ぶ際、何を共有するのか、それを誰と共有するのかを考えてみるとで、自分の環境で最適なものを選びやすくなるでしょう。