あえてケイスケ・ホンダのようなデザイナーになるには

こんにちは、キャディでUI/UXデザインを担当しているモリです。 この記事は CADDi Advent Calendar 6日目の記事です。昨日はマリアンヌによるキャディのエンジニアの開発環境、ぜんぶ見せますです!とっても面白いのでぜひご覧になってみてください!

僕は本田選手のように?幅広く活躍できるデザイナーになるには、について書いていきたいと思います。

ケイスケ・ホンダ=プロフェッショナル

"そもそも"を考え、自分の真ん中を決めることで、迷わず進むことができるんです 本田思考 - 本田圭佑

デザイナーも”そもそも”をよく考える職業だと思います。(え?) 最近のデザイン、特にテック領域では、作家性や審美性に重きをおいたデザインから、ユーザー体験やシステム設計・開発効率性に重きをおいたデザインに重心が変わってきました。 またそういった変化に合わせて、デザイナーであってもビジネスやテクノロジーのリテラシーを持った越境型人材(BTC人材)が求められるようになってきました(う〜ん)

田川欣哉. イノベーション・スキルセット~世界が求めるBTC型人材とその手引き ビジネス・テクノロジー・クリエイティブのBTCトライアングル 参考:田川欣哉. イノベーション・スキルセット~世界が求めるBTC型人材とその手引き

いやしかし、そんなどこかの記事で読んだような話をされても、、、と思われるでしょう、僕もそう思います。

そこで今回は僕自身がキャディの開発現場でデザイナーとして感じたB(ビジネス)やT(テクノロジー)の必要性や、デザイナーがBやTを伸ばすには?ということについて僕なりに書いてみます!

デザイナーにビジネスやテクノロジーは必要か?

僕たちは、一人の力やひとつの専門的スキルでは太刀打ちできないような複雑で複合化した課題を、ソフトウェアの力で解決しようと試みています。こういったプロダクトは、ビジネス、テクノロジー、クリエイティブがかけ合わさった品質が当たり前のクオリティとして求められます。そして、そのようなプロダクト開発の現場では、高い確立でエンジニアとデザイナーが一緒に仕事をする事になるので、デザイナーはエンジニアの仕事内容と気持ちを理解する事と、いざとなったら自分でも手を動かし、コードが書ける、そういった役割が強く求められます。またプロダクトオーナーや経営メンバーと会話する際も、会社として戦略上どこに注力しているか?また現場でボトルネックになっている箇所はどこか?などのビジネス上の前提を踏まえておかなければ、いくらヒアリングしても結局プロダクトに反映することができません。UIをデザインするにしても、画面上の情報の優先順位付けすらも一人でできないような状態になってしまします。(ふう)

↑こんなイメージで書いています。 参考:レッド-山本直樹

要するにデザイナーであってもビジネスとテクノロジーの観点を持って開発しないと夢のプロダクト・マーケット・フィット〜P・M・F〜に到達することなんてできないぜ!ということを改めて実感したよ、と言いたかったのですが。

いや待て、と。ならばデザイナーはビジネス x テクノロジー x クリエイティブの3領域に知識と経験を持つ究極超人にならねばならないのか、と思われる方もいらっしゃると思います。これって普通に考えてかなり難易度が高いことを言っていますよね、僕が本田圭佑であっても厳しいと思います。

でもよく考えてみてください、本田選手もオフェンス・ディフェンス・経営と全て一人でこなしていたわけではありません。長友選手や香川選手など優秀なチームメイトがいたからこそ結果を出せたはずです。

そう、僕や皆さんの隣にもスーパーエンジニアや強力なプロダクトリーダーがいるでしょう!彼らと共にチームとしてBTCトライアングルが形成されていることを目指せば良いのです。

ただそのためにはデザイナーがビジネス・テクノロジーそれぞれの言語を理解する必要があります。

Learn to code

2010年、今から10年前のことですが、 Adobeフォントライブラリの元クリエイティブディレクターでありデザイナーでもあるElliot Jay Stocks氏がこんなツイートをしたそうな。

Honestly, I'm shocked that in 2010 I'm still coming across 'web designers' who can't code their own designs. No excuse.

「いや〜正直言って、2010年になっても自分のデザインをコーディングできないWebデザイナー?がいてマジビビったわ」

恥ずかしがり屋な御仁なのか言葉はちょっとキツめですが、おそらく彼はこう言いたかったのでしょう 「コーディングの知識がないのにWebプロダクトをデザインすることなんてできないでしょ?」と。

なるほど、と。ごもっともだな、と。コーディングの知識がないデザイナーが作った、実装面の考慮がない夢のようなデザインを渡されても、一緒に働くエンジニアは混乱するだけだなと。そんなことで開発効率を上げてPMFを達成できるのか、と。

ではデザイナーとしてどこまでこなせるようになると良いでしょうか?

自分のデザインをコーディングしてプロトタイプができるようになるところまで

まずはここを目指すと良いかなと思います。

デザイナーとして表現したいことを実際コーディングして動かせるところまでできれば、エンジニアとのコミュニケーションコストも下がるし、実際の画面で触って使えるプロトタイプは説得力が違います。

今は、ReactやVueなどのフロントエンドのフレームワークが充実していて簡単に実装・アウトプットまで持っていくことができるし、自身でコーディングするからこそ見えてくることも多々あります。

動的コンテンツ(テキスト量や画像サイズ等)の制御や、取り扱うデータが増えた場合はどうするか、バリデーションはどう見せるか、そういった実装面とUXを考慮したデザインこそがなによりも求められているのです

テクノロジーを学び実装面とUXの両方が考慮されたデザインを作る力を身に付けましょう!

A Business Perspective

まあテクノロジーはわかった、と。じゃあビジネスはどうなんだ、と。ビジネスといっても。経営戦略・マーケティング・財務管理諸々あるだろ、と。

そうです、デザイナーにとってビジネスは理解し難い領域です、、、ビジネス怖い、、、 そこで僕はデザイナーに求められるビジネス観点とは以下のことなのではないかと考えました。

組織が本当に達成したい事を正確にキャッチアップする力

この観点がずれているといくらクオリティの高いデザインを作っても無駄になってしまいます。 なのでここを鋭くキャッチアップする力を身につけることでビジネス観点を備えたデザイナーになれるのではないでしょうか!

俺は孤立している。あえてね

なるほど、と。キャッチアップ力が大事なのはわかった、と。 それならどうすればどうすればキャッチアップ力を身に着けることができるのでしょうか?

俺は(ミランで)孤立している。あえてね

皆さん、この名言をご存知でしょうか、ACミラン在籍時の本田選手の言葉です。 そしてこう続けました。

昔、日本代表でとっていた行動と一緒ですよね。コイツ、何やろうな? と。自分を持っているな、と。試合へのアプローチも全部、自分のやり方で集中しているな、と。そういう風に(周囲の仲間に)思わせているわけです

なるほど、と。一理あるな、と。迎合することなくオーラを放つ作戦ですね! しかしこれは本田選手のカリスマがあるからできる態度であってなかなか真似できるものではありませんね。

なので僕がおすすめする方法としては、"情報よこせオーラ"をバンバン発するのではなく、自ら動きビズサイドの情報との接触機会を増やしていくことだと思います。 Slackなどのメッセージアプリを利用していれば、色々なチャンネルにジョインしてログを収集する・Notionなどの情報共有サービスなどを利用していれば溜まったドキュメントに目を通していきます。

デザイナーであってもこのように情報を収集していくと、今現場では何がボトルネックになっているか、戦略にどのような転換があったか、などが自分の中に情報が蓄積され、自然と課題を適切にキャッチアップする力が養われる気がします。

これ実はキャディでは結構みんなやっていて、しかもかなり効果があります!ぜひデザイナーのみなさんも試してみてください!

役割の変化

プロダクト開発の手法がウォーターフォールからアジャイルに変化しているように、そこで求められるデザイナーも「綺麗なものを作れるけど受け身な人」ではなく「引き受けて改善できる本田圭佑のような人」に変わってきていると思います。 ウォーターフォールであればプロダクトオーナーなどから与えられた要件に対して適切にスタイリングしていくことが求められますが、アジャイルな開発であれば経営者やプロダクトオーナー、エンジニアのパートナーとしてプロダクトを前進させる本田圭佑のような態度が求められます。

そして僕自身キャディでのプロダクト開発の経験を経て、デザイナーの役割の変化やBTCの重要性に気付けました。

キャディはデザイナーがビジネスやテクノロジーを伸ばすのに最適な環境が整っていると思います。 ビズ・テック共にメッシやCロナウド、V・ファン・ダイク、デ・ブライネ級のメンバーが揃っているので、少しでもキャディのプロダクト開発に興味をもっていただけたら、ぜひカジュアル面談に申し込んでみてください!