【今回のポイント】
このホームUIは、文字を載せすぎないシンプルな構成にすることで、ユーザーが『どこに注目すればよいのか』を直感的に判断できるように設計しています。
メインバナーの背景には、落ち着いた青を採用。
これは「安心感」を与える色であり、ユーザーはリラックスしてバナーの内容に目を向けることができます。
また、UI全体の背景もすごく薄い青で統一することで統一することで、視覚的な一貫性を保ちつつ、ユーザーに、心地よさを継続して感じられるように…配慮しました。
その一方で、バナー内の**「さっそく旅に出よう!」や「5タップで予約完了!!」**などのポイントとなるテキストには、高揚感を引き出すオレンジをアクセントとして使用。
ユーザーの目線を自然に引きつけ、アプリの特徴である「手軽さ」と「ワクワク感」を強調しています。
👉 この「青」と「オレンジ」の配色バランスにより、ユーザーは落ち着いた気持ちでUI全体を眺めつつ、
自然と旅の楽しさや期待感を感じ取ることができるよう設計しています。
ーーーーーーーーーーーーーーー
【第4章:ロゴちゃんのホームUXへようこそ】
【翔くん】
お!“ホーム”まで来たんだね……!
一瞬でわかった...。
【ロゴちゃん】
何より!ここがアプリの“玄関”。まさに、旅の入口みたいな場所!
あと、ロゴちゃんは高揚を誘うオレンジではなく、『暖か』なオレンジで翔くんをお出迎えしているんだ!
【翔くん】
……なんか本当にそんな感じがする!
【ロゴちゃん】
でも実はね、ここってロゴちゃんにとっていちばん責任が重たい場所でもあるの…。
【翔くん】
え?なんで??
【ロゴちゃん】
ユーザーはこの画面で、「このアプリ、続けて使ってみようかな?」と感じるかどうかを、一瞬で判断してしまうこともあるの。だから――
信頼感・期待感・操作のしやすさ。
この全部がユーザーの“感性”に心地よく届くよう、このUIに揃ってないと、ロゴちゃん、前に進めない可能性大なんだ。
だから、色々工夫しているよ。
【翔くん】
なるほど……。だからこのホーム画面、すごく考えられてるんだね。
【ロゴちゃん】
うん。たとえば見てみて――
背景は青。落ち着ける色にしたんだ。
それから、目に留まる**「早速旅に出よう!」「5タップで予約完了!」**は、気持ちが上がるように、オレンジ系の強調色でまとめてるの。
【翔くん】
たしかに、なんか全体を見ていて安心するのにワクワクしてくる。
……うん、もう旅に出たくなってきたかも!
【ロゴちゃん】
よかった!
この**“ホームUX”から、ロゴちゃんの本当の旅が始まる**の。
また、気をつけたポイントとしては、文字を入れすぎないこと。
『早速旅に出よう!』
『今週末はどこに行く?』
『5タップで予約完了!!』
ほぼ、この3点!
【翔くん】
確かに。たったの3文字なのに、たくさんの情報が整理されている感じがして、それが一気に、心地よく伝わってくる感がする。
【ロゴちゃん】
いいところに気がついてくれた!実はそれも、UXデザインの本質的なところを突いているんだよ!
そのたくさんの情報、信頼感や高揚感、暖かさなどの情報は、文字ではなく『色』で翔くんの感性に届けているんだ🎶。
【翔くん】
へ〜。『色』ってそれほどに大切なものなんだね。
あ、このカードみたいに浮いてる画面をタップすれば、、5タップで旅の予約ができるってこと?
【ロゴちゃん】
ピンポ〜ン。大正解!
【翔くん】
押して進んで、さっそく旅に出てみたい!
【ロゴちゃん】
OK!それでは、次に言ってみましょ〜!!
【翔くん】
お〜!!(タップ)
ーーーーーーーーーーーーーーー
ここまでお読みいただきありがとうございます。
それでは、第5章へとお進みくださいませ。