更新:2022.11.23|公開:2020.05.22

ストレスをなくす性格診断の回答UI・デザインについて

こんにちは、CIY開発チームの竹下です。
今回はCIYの重要なコンテンツのひとつである、性格診断の回答UI・デザインについてご紹介いたします!

目次

ユーザーのストレスをなくすUI

開発担当としてもっとも気にかけたのは、100問以上の回答をユーザーに行ってもらうために、回答中のストレスをいかに無くすか、を大きな課題として取り組んでおり、以下のような工夫を行いました。

1. スクロールを必要としないUI

みなさんはアンケートなどをスマホで行う際、「回答→スクロール→回答→スクロール」の無限ループにうんざりすることはなかったですか?さらにはスクロールしようと思ったら、誤タップで入力してしまった…なんてことも少なくないでしょう。
そこでCIYの回答UIでは、カードのようなデザインが設問ごとに出現し、連続して回答する際のスクロールを不要にしました!(一部設問によってはスクロールが必要です。)

2. 直感で回答できるUI

設問はすべて「Yes / No」というわけではありません。
例えば「A、B、Cの中から、自分に当てはまる順に選んでください。」といった設問もございます。
以前のCIYではこのようなUIで回答していただいてました。

「1位、2位、3位」の「A、B、C」をそれぞれ選択してもらうのですが、これが直感ではわかりにくい…全部で9つも押せるボタンがあるので理解するためのハードルが高い設問になっていました。

↓ そこで今回、改善したUIがこちらです。↓

ボタンを押すことで、「1」「2」「3」と数字が表示されることで、直感で「あ!自分に当てはまる順番通りに押せばいいんだ!」とわかるかと思います。また、タップできるボタンの数を9→3に減らすことでUIをスッキリさせ情報量をへらすことで、直感での理解の手助けとなっております。

3. 応援コメントUI

ストレスのないUIだとしても、100問以上の質問は少し飽きがくるものです。また、「今の回答は全体のどのくらいなんだろう?」という疑問も回答中に思う方も多いと思います。
そこで、「応援コメントUI」を実装しております。

特定の設問ごとに「その調子!」「あと〇〇問!」などの応援や「△を10個以上選択すると先へ進めないよ!」などの特定の設問へのアドバイスなどを、かわいいキャラクターが伝えてくれます。

さいごに

いかがでしたでしょうか?
気になった方はぜひ、CIYで性格診断してみませんか?
CIY®の性格診断:https://ciy-work.com/person/assessment/profile

もし、「こんな機能があったらいいのに!」などのアイデアがありましたらお気軽にグーグルフォームからお送りください!
CIY®へのお問い合わせ:https://forms.gle/TviGvFjhfztUQeRJA

CIY®をこれからもよろしくお願いいたします!

関連記事