制作者が自分の価値や課題を伝える方法

2017年2月25日、東京の東京ガーデンテラス紀尾井町で Inside Frontend が開催されました。単なる小手先のテクニックではなく、複雑な課題にどのように取り組んだら良いのかという考え方も学べる 1 日でした。また、大企業で働くエンジニアが多数登壇していたころから、チームでどのように開発するのかといった話も聞くことができました。当日の様子は #insideFE まとめを見ると分かりますが、中級者以上の内容を聞ける集まりではあるものの、雑談もできる良い雰囲気のイベントでした。たくさんのツイートが流れ続けていたところもエンジニアのイベントらしいなと思いました。

人は変化を好まないという事実

今回はフロントエンドエンジニアの前で登壇するという理由から「フロントエンドの課題を啓蒙する方法」という題名にしたものの、話の内容はデザイナーでもディレクターでも共通するものだと考えています。ツールだけでなく、コミュニケーション手段も充実してきているとはいえ、デザインと実装の間を埋めるのは簡単なことではありません。また、ひと昔のようにデザイン素材を実装側に渡せば済むわけにはいかなくなりました。

• 情報が流動的に動いた場合の見た目や振る舞い
• タップやスワイプといったインタラクションの動作
• アニメーションや画面遷移のニュアンス
• 同じ画面でも状態によって切り替わる場面の処理

デザイナーがデザインしているときに、これらをすべて考え抜いて作るというのは極めて難しいですし、実装しなければ分からないこともあります。デザインと実装の境目が曖昧になってきたからこそ、お互いの強みを活かしてひとりでは出来ないものを作れることが理想的です。

頭ではそう思っていたとしても、人は楽をしたいと考えますし、現状維持で上手くいくことを先に考えてしまいます。1 年前に Service Worker, Flexbox、位置情報など今使える技術を利用して、利用体験を上げることができることを提案しましたが、デザイナーが技術を知ることで今までにないデザイン提案ができるはずです。ただ、技術を知らなくても、いつものように無難な Web サイトは作れてしまいます。逆もしかりで、デザイナーが拘っている部分を実装しなかったとしても、Web サイトは完成してしまうわけです。

自分の仕事やキャリアに直結しないものは消極的に受け止めてしまうことがあります。新しいアイデア、聞き慣れないアプローチを聞くと最初は違和感を感じるのはそのためかもしれません。実はお互いにとってプラスになることが多いわけですが、伝え方が『俺にとってのメリット』に聞こえてしまうことで相手に伝わらないということはあると思います。

聞き手のマインドセットを理解する

提案する相手にもメリットがあるようにしなければ興味を示してくれません。人は変化を好みません。エディタひとつにしても、変えることが難しいと思いますし、乗り換えする際は、他に大きなメリットを感じた時、もしくは今使っているエディタが使えなくなったときという外圧からの変化だと思います。

これはフロントエンドの新技術の導入でも良いですし、デザインの手法でも良いと思います。そのとき、ただ概要や自分視点のメリットを語るのではなく、聞き手のマインドセットを整理してみるとどのように提案すれば良いのか次第に見えてきます。

• 重荷 : 聞き手の課題であったり、仕事で気になっていることは何か。その人の上司から課せられた仕事は何か。
• 恩恵 : 提案しているものを採用することで、聞き手の直接的なメリットは何か。その人の日々の仕事やキャリアにプラスになるか。
• 優先順位 : 聞き手が仕事において大事にしているコトや価値観は何か。

「デザイナーがデザインシステムに参加するための課題と対策」で、デザイナーにとってデザインシステムが遠く感じてしまう理由として、デザイナーの仕事場はデザインツールの中にあることを指摘しました。つまり、コードで作られているデザインシステムだけでは恩恵も感じなければ、重荷に感じてしまう可能性があります。そこで、デザインツール上でデザインシステムが作れる環境を整えたり、参加しやすいツールで始めているのは手段です。そうすることで、重荷を和らげることになりますし、相手のスキルアップに繋がるような提案にもなると思います。理想のデザインシステムとは程遠いかもしれませんが、第一歩を踏み込むことができなければ完成形に辿り着かないわけです。

Inside Frontend では、デザインシステムを例にして重荷・恩恵・優先順位について考えてみましたが、これは他のことにも言えます。デザイン側もどうしても実現したい表現があった場合「ここはコダワリがあるから」だけでは通じないわけです（もちろん、それで通じ合える仕事環境にすることが理想ではありますが）。デザイン批評とは、言い換えればデザインを伝える能力のことです。直感や感性は重要ですが、それだけでは伝わらない場合もあるわけです。伝わらないからといって「あいつは分かってない」と一蹴するのではなく、聞き手のマインドセットに注目して提案してみると良いでしょう。

AMAの機会は増やしていきたい

今回のイベントの一部は AMA (Ask Me Anything / 何でも聞いてください) 形式で行われました。私の担当も AMA で、30 分を参加者からの質問に答える時間として割り振りました。質問と答えは GitHub で公開されているので、興味がある方はぜひご覧ください。

2 年くらい前から質問に答える形式に興味があって、イベントを開催したり、Facebook Live などを使ってカジュアルに発信したりしています。セミナーやワークショップは知識や手法の概要を学んだり体感するには優れていますが、個々が抱えている課題にピンポイントに答えることができません。時々、イベント参加者からのアンケートで「具体性がなかった」という反応をいただくことがありますが、その人の現場のことを知らないまま話しているので、その人のとっての具体性を提供するのが難しいです。

実はどの現場でも同じように使える手法やスキルは「話せる」「伝える」みたいなソフトスキルくらいしかないと思っています。「Web サイトを作る」とひとことで言っても、受注なのか内製なのかで随分違いますし、組織の規模によって適応できるアプローチが異なります。ツールや手法が自社で採用できない場合（そもそも必要がないのに採用しようとした場合も含）、組織の大きさや成熟度、そして周りとの関係性を考慮していなかったということも少なくありません。

AMA をはじめとした質疑応答形式は、質問者の文脈を理解することができるので、その人に合う戦術・手法を提案できるのが魅力です。今回は前提を共有するために情報共有から始めましたが、できれば AMA 的なものはどんどん増やしていきたいですし、参加者へ真の価値を提供できる機会になると考えています。

まとめ

作ることが好きだからこそ、デザイナー、デベロッパーという仕事についていると思いますが、時には 営業モードに頭を切り替えて自分達の仕事の今後を伝えていかなければならないタイミングがあります。もちろん、今日話したことをひとりでする必要はありませんし、組織の規模によってはプロダクトマネージャーやディレクターを巻き込んで進めることができます。もちろん、協力者にもある程度の説得は必要なので「これ良いんです、やりましょう！」以上のことを伝えなければ響きません。

面倒と感じるかもしれませんし、もっと簡単な方法はないのかと感じた方もいると思います。正直、難しいですし、時間もかかります。しかし、聞き手のマインドセットを整理することで技術や手法を最大限に活用した仕事環境を少しずつ作ることができます。啓蒙というのは、そういう地道なところからスタートすることでしょうし、そういった活動がいずれ言葉がなくても通じる関係へと繋がるのだと思います。