グロース ハッカー アワード2017
そのデザインの意図は、本当にユーザーに伝わっているだろうか？ 受賞グロースハッカーによる改善事例解説
2017年3月14日。Kaizen Platform, Inc.は「21世紀の新しい雇用と働き方の創出」をテーマに『グロース ハッカー アワード 2017』を開催した。本ブログでは、その内容をセッションごとにお伝えしていく。
今回は、受賞グロースハッカーによる改善事例解説の様子をレポートする。登壇いただいたのは、自動車・バイク部門賞：岡村しんし氏、求人部門賞：北古賀紀行氏、スマートフォン賞・不動産部門賞：淵上喜弘氏、オープンオファー賞：宝寿原（ほうすばら）実加氏の4名だ。
司会であるKaizen Platform, Inc.の岡本葵（まもる）が、UI改善において特に優秀な成績を収めたグロースハッカーの方々に、そのノウハウを伺った。
どういった視点でグロースハックを行っていますか？
司会：グロースハッカーの方々が、普段どういった視点でグロースハックを行っているかを、事例を通じてご紹介させていただければと思います。
まずは、中古車買取のガリバーの査定ページを改善された岡村さんにお聞きします。3つのデザイン案のうち、中央のものは1年間、ずっとコンバージョンレートがトップのデザイン案として使われていたものですよね。これをさらに改善したのが右側のデザインですが、こちら、どのような工夫をされたのでしょうか？
岡村さんのデザイン案：中古車買取のガリバーの査定ページ。真ん中のデザインは、以前、がっちりマンデー！！で紹介されたこともある改善案。放送された番組はこちら今回、解説された事例は、さらにその上をいく改善成果を実現。
岡村：このデザインでは、サービスへの“スムーズな導線”と、ユーザーに行動を起こしてもらう“動機付け”に注目してデザインしました。
真ん中のデザインは、ファーストビューの右側に申し込みフォーム、左側にボタンが2つあるため、導線が3つになっていて、次に何をアクションするのか、少しわかりにくいのではないかと考えました。その仮説から、左側の2つのボタンを画面の下に移動し、ファーストビューでは申し込みのフォームだけが見えるようにして“スムーズな導線”を実現しました。
もう1つ、ユーザーの“動機付け”を実現するための方法として、ユーザーにとってのベネフィットをファーストビューで入れることにしました。画面の左側にあったボタンを画面の下に移動したことで空いたスペースに「4つの理由」というユーザーベネフィットの訴求メッセージを入れました。
司会：ユーザーが迷わないようにあえて選択肢を減らし、そして、ユーザーにアクションを取ってもらうための訴求点を明確にアピールしたと。これらが重要なポイントだったわけですね。
北古賀さんのデザイン案：スタッフサービス・エンジニアリング技術者向け派遣求人サイト
司会：続きまして、北古賀さんが制作されたデザイン案ですね。これは、スタッフサービス・エンジニアリングの、技術者向け派遣求人サイトの応募フォームですね。これはどのような点に着目して改善されたのでしょう？
北古賀：改善前の案は、フォームがどんと置かれているだけで、サイト訪問者がちょっと入力をためらうような雰囲気がありました。そのため、その雰囲気を払拭することと、ユーザーの気持ちを後押しするようなコンテンツを追加してみようと思いました。具体的には、ユーザーに安心感を与えるために笑顔のモデルさんの写真を使い、スタッフサービス・エンジニアリングの特徴とメリットを記載しています。
司会：確かに、これだけでグッと雰囲気が良くなりますね！ 写真を使う際のコツのようなものはありますか？
北古賀：人物の写真を入れる場合ですと、2つのパターンがあります。まずは、サイトを訪問するユーザーと近い写真を使うパターン。例えば若い女性向けだったら、若い女性の写真。年配の方向けだったら、年配の方の写真を使うということです。もう1つのパターンは、ジャンルに関係なく女性の方が笑っている写真を使うこと。それらは、経験上とても効果があります。
プレス席の記者のみなさま。超有名サイトの舞台裏とその改善効果に釘付け。
淵上さんのデザイン案：大東建託のいい部屋ネットのスマホ用検索一覧画面
司会：次は、これは淵上さんの担当された大東建託のいい部屋ネットのスマートフォンサイト検索一覧ページですね。このデザイン案はどういったところがポイントになったのでしょうか？
淵上：このページの場合、流入経路がほとんど検索エンジン経由でした。検索してページを訪問したユーザーは、「何か良い物件ないかな」というぼんやりとしたニーズしか持っていません。だからこそ、詳細な情報を伝えるというよりは、情報を“わかりやすく”伝えることが重要になってきます。
しかし、変更前のデザインでは物件一覧の写真が小さかったり、情報が順位付けされていなかったりして、初めて訪問した人にとって、わかりやすい画面にはなっていませんでした。このデザインでは、ユーザーの「もっと物件を探したい」という要望を引き出すことができないと思ったんです。その対策として、画像をかなり大きくし、ユーザーにとって重要な情報をより目立たせるようにデザインしました。
受賞者の解説中は、会場の大きなスクリーンにビフォア・アフターの画面が投影されていた。
司会：淵上さんの中では、このデザイン案は自信がありましたか？
淵上：ありましたね。以前、別の会社の不動産サイトの改善案を作ったことがあったのですが、その際にも「視覚に刺さる情報を表に出す」というデザイン変更が効いたんですよ。各業界で、勝てるデザインの型があるので、それを知っていると、高い確率で改善案を出せるのだろうと思います。
宝寿原さんのデザイン案：goo自動車&バイクのスマホ用の自動車詳細ページ
司会：次は、宝寿原さんが担当されたgoo自動車&バイクのスマートフォンサイトの自動車詳細ページです。宝寿原さんは、どのようにしてこのページの改善ポイントを見つけたのですか？
宝寿原：私が最初に気になったのは、変更前のデザインはファーストビューの一番目立つところに「電話ボタン」があるという点です。スマホで調べものをするのは、電車で移動中だったりとか、寝る前にお布団の中で見たりという場面が多く、実は電話をかけにくい状況なのではないかと考えました。
司会：宝寿原さんはペーパードライバーで、車には詳しくないのに、どのようにしてユーザー目線での問題点を見つけられたのですか？
宝寿原：たまたま私の夫が、ネットで車を買ったことがあるといっていたのを思い出して、どのようにして、車を探したのかを聞いてみました。すると、気に入った車が見つかっても、すぐに電話をするのは、ハードルが高く、フォームから問い合わせをしたいという答えが返ってきました。それを聞いて、自分の仮説に自信が持てましたね。
電話をかけるボタンを下に移動したことで、空いたスペースに、メールでの見積り依頼のボタンを配置し、色もページの中で目立つように明るめの色にしました。
普段、結果を出す上で大事にしていることはなんですか？
司会：みなさんのノウハウ、本当に参考になりました！ 続いては、結果を出すうえで大事にされていることをお伺いできればと思います。
岡村：私は、「テストを回した後に、何が良かったのか悪かったのかを振り返れること」を意識して改善案をデザインしています。あれもこれもと色々な変更をやってしまうと、改善効果が高いデザイン案が作れた場合でも、何が効いたのか、作った本人もわからないケースも多いんです。それはすごくもったいないので、テスト後に振り返りができるようにデザインを作るように心がけています。
あとは、普段の生活で目にするデザインにダメ出しをするというのをよくやっています。例えば、トイレの男女のアイコン。たまに、わかりにくいところってありますよね。単にわかりにくいと思うだけではなくて、自分なりに「こうしたらわかりやすくなる」と考えるようにしています。これを日常的にやっていることで、考察力が身につくと考えています。
北古賀：私は制作の原点に立ち返ることが大事だと思っています。誰に何を伝えたいのか、ユーザーは何を期待してそのサイトに来ているのか。そこがブレていると絶対に駄目なんです。そのために、ユーザー目線を持つことが重要になってきます。
ユーザー目線を持つために、自分自身がそのサイトを最初に使ったときに感じた“違和感”を覚えておくようにしています。その感覚を元に、改善案を導き出すというパターンが多いですね。
宝寿原：私はフリーランスでデザイナーをしているのですが、その前は、ソフトウェアのUIのデザインをしていました。当時、ユーザーが迷わずに使えるUIとはどうあるべきなのかを、いつもメンバー同士で議論していました。
その経験から、ユーザーにとってストレスがないページにするにはどうしたらいいかを考えるクセがついたのだと思います。当時に培った、「ユーザーの目線に立ってページ全体をチェックし、仮説を立てて検証する」という習慣は、今でも大いに役立っていると思います。
淵上：私は最近、スマートフォンページのデザイン改善をよく手がけています。スマートフォンの場合はPCよりもユーザーフレンドリーなデザインを作るのは難しいと思っています。
スマートフォンは画面が小さいので、全ての情報を表示することができないので、ユーザーにとっての情報の順位づけをし、要素を“引き算”することを重視しています。
お客様または後輩グロースハッカーにアドバイスはありますか？
司会：最後になりますが、これからグロースハック活動を始めるお客様や後輩グロースハッカーにアドバイスがあれば、ぜひ一言ずつお願いします。
岡村：常に、新たな切り口を探していくことが大事だと思います。先入観を捨てて、さまざまなパターンの仮説を試してみる。それによって、自分自身のスキルの幅も広がりますし、思いもよらなかったような結果が生まれることもありますから。
北古賀：デザインを変えすぎないことです。先ほどの岡村さんの話にもありましたが、デザインを手当たり次第にどんどん変えていって良い結果が出たとしても、いったいなにが効いたのかわからなくなってしまいます。だからこそ、まずはデザインのテーマを明確に決めた方がいいと思います。
宝寿原：私は、課題を見つけるときにスマホのサイトならば実際に自分のスマホで見たり、改善対象となるページの前後のページもチェックしたりしています。あとは、ラウンドが始まった後に、他のグロースハッカーさんが制作したものがどのような点で優れているのか分析することも、きっと自分自身の糧になると思います。
淵上：「自分が考えたUIは、実はユーザーにちゃんと伝わっていない可能性もある」ということを常に考えておかなければいけないと思います。例えば、「このアイコンは、誰から見ても“メニュー”だとわかるだろう」と思って設置したものが、ユーザーにとってはわかりづらいケースもある。いっそのこと、「メニュー」という文言を書いてしまった方がわかりやすいことだってあるんです。
「ユーザーがそのデザインを見たときに、本当にグロースハッカーが意図する内容が伝わるか。伝わるのならば、それはどうしてか」という根拠を、自分自身でしっかり持っておく必要があると思います。
司会：みなさん、本当に貴重なお話ばかりでした。これにて、トップグロースハッカーのインタビューを終了させていただきます。ご清聴ありがとうございました！
イベントの全てを動画でご覧いただけます。
当アワードは、Web業界で働くためのオンライン動画学習サービス – Schoo（スクー）で生中継されました。その放送動画はスクーのサイトでご覧いただくことができます。現在、スクーの会員でない方は、無料会員に登録すると入会特典で1本動画を観ることができます。
