【engage】人の心を動かすUIデザインの工夫
こんにちは。UIデザイナーのマスダです。
今回は、engageのUIデザインに見られる工夫を、心理的な効果とともに考察していきたいと思います。
人の行動メカニズム
人は、なにかしらの情報をインプットして頭の中で判断してから行動を起こします。一見シンプルのように見えますが、頭の中での判断するときには、無意識のうちに周囲の状況や過去の経験などに影響を受けています。
無意識のうちに影響を受けて非合理な判断をしてしまう心理現象を「バイアス」と言います。
バイアスの種類にもいろいろとあります。
例えば、人は無意識のうちに相手を気にしてしまいます。
見知らぬ人のブログで有名な人の言葉が引用されて語られていると、その文章自体が信頼できると思ってしまわないでしょか。これは、有名人という相手が登場することで、無意識のうちに信頼してしまっているのです。
人は周囲の状況にも左右されます。
名前も知らないラーメン店に行列ができていると、きっと美味しいんだろうなと思ってしまうでしょう。行列ができているという周囲の状況によって、ラーメンの種類も知らないのに、無意識のうちに美味しそうと考えてしまうのです。
つまり、人は機械と違って合理的な判断をしていないということです。
面白いですよね。
ここからは、engageという求人媒体において、人のバイアスを利用したUIデザインの工夫ポイントについて見ていきたいと思います。
工夫①一問一答形式のステップ化されたフォーム
engageの会員登録フォームでは、1画面に1つの質問を表示するようなフォームになっています。最近だと会員登録フォームはこのような形式が多くなっているなと思います。
これには2つのバイアスを利用していると思います。
1つ目は、「進むとやる気が出る」というものです。エンダウトプログレス効果と呼ばれたりもします。フォームを一問一答形式にすることで、ユーザーはサクサクと答えられるし、画面が切り替わることで進んでいるという気持ちになります。人は進んでいるなと感じられるとやる気が出るので、フォーム入力もどんどん進められる効果があります。
2つ目は、「もったいないの罠」です。サンクコスト効果と呼ばれたりもします。一問一答だとサクサク入力できますが、入力項目が多いとさすがにユーザーも面倒だと思うようになります。しかし、ユーザーはこうも考えます。ここまで入力したんだから、プロフィール入力を完了させないと、いままでの努力が無駄になってしまうのではないか。ユーザーにそう思わせることができれば、入力完了を促す効果につながるでしょう。
これら2つの効果によって、会員登録率の向上が見込めると考えられます。
工夫②顔出ししているエージェント林さん
会員登録完了時や、お知らせの表示などでエージェント林さんが登場します。名前だけでなく、顔写真付きです。
ここにも2つのバイアスが関係していると思います。
1つ目は、「親しみやすいと感じる」です。広告でモデルさんやキャラクターを使うことはよくあると思います。これは人やそれに類似するものを使用することで商品に対する親しみやすさを増幅させる効果があります。人は相手の顔が見えている方が親しみやすさを感じるという効果があります。
2つ目は、「顔が見えることで安心感がある」です。人は、会ったことのない人よりも会ったことのある人の方が信頼できます。それと似たもので、顔が見えないよりは、見えている方が信頼できたり安心できると感じます。エージェントの名前だけではなく、顔写真もセットで表示することでユーザーへ安心感を与える効果があると思います。
このように、親しみやすさや安心感を与えることでサービスに対する好感度を上げることができます。この好感度がサービス利用率の向上につながると考えられます。
工夫③求人のいいね数を表示している
求人カードのいいねボタンの近くに「2人がこの求人をいいね！しています」のように、求人へのいいね数を表示しています。
ここには、「人が集まっていると気になってしまう」というバイアスが関係しています。バンドワゴン効果と呼ばれます。
ラーメン屋の行列もそうですし、noteのいいねなどとも同じです。ラーメンや記事の中身を知らなくても、行列に並んでしまったり、記事を読んでしまったりします。engageの場合は、ユーザーはたくさんいいね！がついている求人を見ると、職場環境や待遇の良い求人なのかなと想像してしまいます。そして、求人が気になったユーザーは詳細を確認するという行動をしてしまいます。
つまり、いいね数を表示することで求人の閲覧数を向上させられるのではと考えられます。
工夫④求人詳細に「応募定員あり」と表示している
求人詳細画面の画面下部に固定で「応募定員あり」のテキストが少し赤字で強調されたデザインで表示されています。
ここには「できるだけ損はしたくない」という人の心理を利用していると思います。
「応募定員あり」というテキストを表示することにより、ユーザーは無意識のうちに応募定員が少ないのかな？や、すぐに応募終了しちゃうのかな？と考えてしまいます。そのように考えてしまうことで、ユーザーは早く応募しないとという気持ちになり、応募までにかかる時間をより短くする効果が期待できると考えます。
つまり、「応募定員あり」というテキストを表示することは、ユーザーの応募までのスピードを向上することに繋がると考えられます。
ーーーーーー おわり ーーーーーー
弊社のデザイン部メンバーがデザインに関する内容をnoteで発信しています。よければ覗いてみてください👀
この記事が気に入ったらサポートをしてみませんか？