Kanoko Nagai Designer Portfolio
教育ゲームUI/UXデザイン
Igoe
役割
UI/UXデザイナー
概要
Igoe は、6〜10歳の子どもを対象とした英語学習アプリである。子どもが楽しみながら英語を学べるインタラクティブな学習体験を提供するとともに、多くの保護者が抱える課題の解決を目的としている。保護者の中には、子どもの英語学習を支援したいと考えていても、英語力や時間、継続的に学習をサポートするためのリソースが十分でない場合がある。そこで Igoe は、子どもが一人でも学習を進められるよう、自主的な学習を促す設計とした。遊びを取り入れた質の高い学習体験を通じて、子どもが自然に英語力を身につけられることを目指している。
プロダクト
これらの主要スクリーンは、複数回のデザイン改善とブラッシュアップを経て完成した。
ポップアップ画面
課題と解決策
リサーチ段階では、デザインプロセスで重点的に解決すべき4つの主要課題に絞り込んだ。
ユーザーテスト
ユーザーテストを通じて、改善すべき重要なポイントを明らかにした。以下はユーザーからのフィードバックをもとにデザインを改善した事例である。
1. タイマーと進捗バー
ユーザーからの声：
「進捗バーは現在の問題の残り時間を示しているの？ 上にあるタイマーと、このバーがそれぞれ何を示しているのか分からない。」
改善内容：
現在の問題の残り時間を示すタイマーとテスト全体の進捗を示すバーが混同されないよう、それぞれを視覚的に分離した。進捗バーを独立したヘッダーエリアに配置することで、バーはテスト全体の進捗、タイマーは現在の問題の残り時間を示していることが分かりやすくなった。
2. 装飾要素とインタラクティブ要素
ユーザーからの声：
「このイラスト（ロードマップ付近にあるスーツケース）はタップできる？ それとも背景のイラスト？」
改善内容：
ストーリー上必要な装飾として背景に含めた要素が、ユーザー視点からするとタップできる要素なのか判断しづらく混乱を招いていた。これを改善するためイラストを小さくすると同時にキャラクターの近くへ配置を変更し、操作可能な要素ではなくシーンの一部として認識されるよう改善した。
リサーチ・インタビュー
インタビューを通じて、2つの重要なインサイトが得られた。1つ目は、多くの保護者が仕事や家事に追われ、子どもの学習を十分にサポートする時間を確保できていないことである。2つ目は、学校教育だけでは十分ではないと考え、子どもに英語を学ばせたいと思う保護者は多い一方で、自身の英語力に自信がなく、効果的にサポートできないと感じていることである。
アイデアスケッチ
レイアウトを確定する前に、できるだけ多くの案を生み出すため、直感的に発想を広げる場としてラフスケッチを用いた。完成度よりも量を重視して手を動かすことで、最初に思いつく定番の案を出し切り、その先にある、より創造的で遊び心のあるインターフェースの可能性を探ることができた。
次のステップ
本プロジェクトを通じて、仮説ではなくユーザーニーズに基づいて設計することの重要性を再認識した。ユーザーフィードバックは、ユーザビリティ上の課題を発見し、デザイン改善の方向性を定めるうえで非常に有効であった。今後は、競合分析で扱ったプロダクトには見られなかった、よりインクルーシブな機能についても検討していきたい。
Riveによるモーション検証
本アプリのキャラクターを用い、インタラクティブモーションの検証として別プロジェクトを実施した。メインデバイスの想定が異なるため最終仕様とは一致しないものの、Riveを用いたアニメーション制作を通じてステートマシンの理解とインタラクティブモーションデザインのスキル向上につながった。
成果物
UI/UX デザイン/ プロトタイプ/ アニメーション