「Airbnb」のUI/UXについて分析してみた
こんにちは!
大阪でUI/UXデザイナーとして働いているミヤザワです。
今回はAirbnbのアプリについて分析していこうと思います。
目的としては、UX的視点も意識したデザインを作れるようになるためです。
いくつか分析した中で良いと思った点を少し書き出してみようと思います…✍️
1.直感的で使いやすいUI
Airbnbではユーザーが必要な情報に簡単にアクセスできるようなデザインになっています。
検索画面
まずトップページの検索画面では、メニューが大きく下に表示されており、検索キーワードも充実しています。
スマホユーザーにとって、メニューが下にあることによって指をあまり動かさずにタップできるので無駄な動きもせずに済みます。
「合計金額をはっきり表示」というコピーも面白い。
また私は検索キーワードがかなり特徴的だと感じました…!
「スゴイ!」や「最高の眺め」など、他の旅行サイトではあまりない珍しい条件ばかりで、
ここに他にはできないユニークで感動的な体験を提供したいという想いが込められているのかなと思いました。(他にも「最高の頂から」などあります)
予約画面
実際に予約画面へ進むと、次の動作のボタンだけカラーになっていて一番目立つデザインになっているので、
ユーザーが次の動作に迷うこともありません。
こういった所も考えられており、分かりやすく使いやすいUIになっている気がします。
2.充実した検索機能
次は検索機能になります。
絞り込み検索(フィルター)
まずは絞り込み検索の条件がかなり充実しています。
ユーザーが求める宿泊施設の条件に応じて、カスタマイズされた検索が可能。
地域や価格、宿泊施設のタイプや設備など、幅広い条件から検索できるため、ユーザーが必要とする宿泊施設を簡単に見つけることができます。
これも他と違った、Airbnbならではの特徴なのかなと思います。
また、この中でも予約オプションで「今すぐ予約」や「セルフチェックイン」なども条件があるとユーザーにとって嬉しいのではないかと思いました。
目的地の検索
トップページの検索ボックス「どこでも」をクリックすると行先で検索ができます。
ここでも「宿泊」と「体験」を選択することができ、ユーザーが求めている選択肢をあげ、体験を提供するという理念が含まれているのかなと思いました。
またここの画面でも予約画面同様、右下の「探す」ボタンが一番目立つデザインになっているので、ユーザーが迷わず、分かりやすく使いやすいUIになっています。
3.その他(細かなUXやコピーについて)
フラッシュメッセージ
UIデザイン内のボタンは、それを押した時に何か「動作が完了しました!」という風な分かりやすい変化が起きることが多いと思うのですが、
中にはUI上の変化が分かりにくい動作のものもあります。
Airbnbでは、「URLを取得する」をクリックしたときにフラッシュメッセージで動作が完了したことをお知らせしてくれます。
このような細かな部分まで実装されており、見た目だけではないユーザーのことを考えた仕様も多いなと感じました。
マイクロコピー
これは余談なのですが、以前マイクロコピーのウェビナーに参加した際
Airbnbの事例が紹介されてました。
Airbnbの最初の課題が、「知らない人を泊める・知らない家に泊まる→ホストとゲストの信頼関係を会う前に築く必要があること」でした。
解決策としてホストの自己紹介ページにマイクロコピーを追加。
文頭の「基本は人間関係です」や、「これなしでは生きていけないものを5つあげてください」と記載した。
これだけで人は答えやすくなり、結果自己開示をすることにより信頼関係が築きやすくなって課題解決に繋がったといいます。
終わりに
今回AirbnbのUI/UX分析をしてみて、
企業理念である「世界中のユニークで感動的なスペースを提供するホストと本物の経験を探す旅行者をつなぐ」がデザインにも表れているなと思いました。
また全体通して、直感的で分かりやすいデザイン、他にはない特徴的な部分も多くみられました。
見た目だけではなく、ユーザー体験も大切にし、細部まで拘ったAirbnbの魅力が多く感じられたかなと思います。