「たたき台」を作る人が一番えらい

この記事を読んで猛烈に共感し、僕も考えていることを書きたいと思いました。
記事に敬意を込めて「たたき台」という表記も合わせて書きたいと思います。

「ラフ案」ではない「たたき台」

デザインにおけるたたき台というと「ラフ案」とか「ドラフト」のような用法の言葉です。実際作っているものもそれに近いですが、僕が意味合いとして大事にしたいと思っていることは少し違います。

よくプロのデザイナーは8割まですぐ完成させ、残りの2割に時間をかけると言われます。「自分の思う完成形に至る途中だけど確認出しする」というイメージです。
この意味で使うたたき台はまさしく「ラフ案」ということです。

少し違う、というのはデザインを見てもらう理由が「確認してもらう」ではなく「意見をもらう」というところにあります。

「確認してもらう」と「意見をもらう」のどこに違いがあるのかというと、 相手にデザインを変えてもらうという意識 を強く持っている点です。

改善を前提とする制作フローの中でのデザインカンプ

ピクセルパーフェクトなカンプをつくる時代から、リキッドデザインやレスポンシブデザインという閲覧環境に適した表示を作る時代へ移り変わり、デザインカンプの意味も変わってきました。

制作フローも、すべてのページをしっかり決めてから進めるような手堅いものから、MVPやスクラムと呼ばれるようなミニマムで価値が伝わるものを作るところから始める方法が主流になりつつあります。

そういった中で重要なのは 「デザインに対して意見をどれだけ出してもらえるか」 ということなのかなと考えています。

もちろんそれだけが大事ということではないです。
他にもポイントはいろいろあるんですが、改善を前提とするプロダクトを作る時には意識して損はない視点だと感じています。

どう作ればいいのだろう

では具体的に「上手にたたかれる」デザインはどのように作れば良いのでしょうか。

1.意見を丁寧に取り込む

まずは意見を出しやすいツールを使いましょう。

僕はFigmaを利用しています。コメント機能はもちろん、修正がリアルタイムで反映されるのが良い意味で“やってる感”を感じてもらえるのでとても気に入っています。
作ったデザインにコメントを入れてもらいます。疑問や質問なども積極的に書いてもらいます。

大切なのは、出してもらったコメントを放置しないことです。
自明であったり、確認だけのコメントであっても打ち合わせやSlackでのやり取り内で話題に上げ、どのように解決するかを丁寧にコミュニケーションすることで「自分の意見が聞こえている」という認識をチーム全体に持ってもらいます。

2.疑問をパターンで解消する

「〜が伝わりづらいかもと思いますが、どうでしょうか？」
↑よくあるコメントです。

「え、じゃどうすればいいの？修正すればいいの？しなくていいの？」
デザイナー視点だとこう思いがちですが、こういう疑問系コメントは考えられるパターンをささっと出してしまうと話が進むことが多いです。

デザイナーで先に考えて結論が出ていることが多いと思いますが、
その過程の検討案をパターンとして見せる、というイメージです。

見せ方と意図をセットにするとより選びやすく、選択に納得感が生まれます。

例)
見せ方A : 1つ1つの情報量は多く、魅力的に見えるがスペースを広く取ってしまう見せ方
意図A　 : リッチにコンテンツを演出し、期待感を醸成して遷移させる

見せ方B : コンパクトな情報量・見た目にして一覧性を担保する見せ方
意図B　 : タイトルのライティングを工夫して、短くてもたくさんの情報があるコンテンツ量を魅力的に見せる

↑は適当な説明ですが、なぜその見た目になっているかを説明できれば、うまくパターンがはまらなかったとしても話し合う前提を作ることができます。

3.専門知識でブロックしない

コメントをするのは、主にはデザイナー以外の職種の人だと思います。
当然分からないことや、実際に手を動かしていれば自明なことも多くあります。
フォントサイズや色、UIなど、ある程度セオリーが決まっているものであればなおさらです。

そういったマナー、前提を覆してしまうようなコメントも基本的には歓迎します。
崩れてしまうのであれば崩れてしまう見た目を作ったり、既存のアプリケーションを引き合いに出して説明します。

GoogleやFacebook、Twitter、Instagramなどよく使われているサービスでどのように解決しているか、言語化して説明するとチーム全員のデザインリテラシーが向上します。

「なぜこうなっているのか/いないのか」を共有することは、ローンチ後の継続した改善でも非常に意味を持ちます。デザイナーだけが持っている専門知識を共有していきましょう。

4.最初からすべてを解説しない

少し細かなテクニックです。
「言語化が大事」とだけ考えると、最初からFigma上に説明テキストを大量に入れたり、パターンを全部出してしまったり、先回りしてそこから選んでもらうようなこともできてしまいます。

ただ、これはあまり良くないと思っています。
あくまで目的は「デザインに参加しやすいたたき台を作ること」なので、最初からすべてを解説してしまうとそのプロセスは失われてしまいます。

現状の問題点を挙げつつ、あえてその問題すべてを解決しない粒度で案を作り、そこから肉付けしていくというやり方がおすすめです。
もちろん最終的に問題点は解決されるべきですが、その解決の瞬間を共有しながら進めるとデザイナー以外もデザインの意図について説明できるようになっていきます。

5.スキルを活かしてスピーディーに良いものを

ここまでの1~4と矛盾しそうですが、最終的にデザインの品質に責任を持つのもデザイナーの役割です。
コメントしてもらうためのデザインはスピーディーに作りつつ、コメントを反映しきった最終的なデザインデータはしっかり見直してディティールを深めます。

コンポーネントやデザインガイドラインと矛盾しないか、実装しやすいルールになっているか、そういった最終的な“上がり”を高めるために見直すことがとても重要です。

ビジュアルで世界観を見せつけるようなクリエイティブには向かない手法だと思います。
ウェブサービスやある程度大きな組織のコーポレートサイトなど、組織やチームの中で行う制作においては面白いやり方だと思うので、試してみてはいかがでしょうか。

コメントを示すピンがたくさん立っていると、みんなでやっている感があって僕は楽しいです。