UIデザインがすごい！参考にしたいアプリ・ブラウザサービス５選！

ナレッジ・ノウハウ

今回はユーザーの実際の動きを参考にしたUIデザインやアニメーションをうまく使ったUIなど幅広く選びました。
rootメンバーが選ぶ参考にしたいアプリ、ブラウザサービスのUIデザインを５つ紹介します。

[adrotate group=”3″]

Must

Mustはこれから観たい、もしくは観ようと思っている映画やTVシリーズのコレクション及びレビュー専用のSNSです。保存した情報を元に、自分の好みと近い映画やTVシリーズをレコメンドしてくれる機能も備えています。

スマホのディスプレイが年々拡大し、画面操作において親指を伸ばしてタップしたり、両手で操作したりしなくてはいけないという場面がアプリを使う上で起こる中で、Mustは画面下半分でほとんどの操作が完結できるよう設計されています。

使い勝手もさることながらUIのモーションにもこだわりを感じます。例えば、ホーム画面で気になる映画のメインビジュアルをタッチすると、大きさが一回り小さくなり、手を離すと浮き上がるように拡大しながら前面に出てきます。この一連の動きによりユーザーは画像を押したことを認知できます。メインビジュアルが前面に出てくると、追随するように映画の詳細情報が画面下から出てきます。画面と画面の関係性やコンテンツの優先順位などをモーションによって上手く表現してします。小さなモーション1つ1つが、ユーザーの体験に大きな影響を与えているかもしれません。

Google lens

Google lensは、検索したい対象をカメラにかざすだけで、対象が何であるかを検索出来るアプリです。従来の検索エンジンを使うときのように「調査対象の言語化」が必要ありません。(iOSの場合はGoogleアプリに付属)。カメラに写る被写体を自動で認識、解析することで被写体の名前やそれに近い物を表示してくれます。

Google lensはカメラに写した被写体を認識、解析している時のUIに待ち時間を感じさせない工夫がされています。被写体を認識すると白い斑点が被写体近くに現れます。これは被写体に対してどれくらいの情報量を読み込んでいるのかを示しています。情報処理している時間の経過をあえてユーザー側に見せることで、自分が知りたいものが認識されていることをユーザーに認知させています。

Snapchat

ミレニアル世代を中心に人気を集めているメッセージ・チャットアプリ。

SNS機能やメッセージ機能、写真・動画加工機能を持ち合わせています。大きな特徴としては作成したコンテンツ(スナップと呼ばれるもの)が指定した時間で消えることです。海外では企業のマーケティングやプロモーションツールとして注目されており、例えばマクドナルドでは、アルバイトの採用情報をミレニアル世代に効率的に届けるためSnapchatを活用しています。

SnapchatはあえてAppleやGoogleが提唱するデザインガイドラインに沿った画面設計を無視することで、ユーザーがアプリを使う上で一番求めている体験を一番最初にユーザーに提供しています。

例えば、画面を切り替える際、AppleやGoogleのデザインガイドラインに沿ったUIであれば、アイコンを置いたり階層メニューを設けて画面を切り替えるということをしますが、Snapchatでは画面を切り替える方法としてスワイプ操作が多用されています。ユーザーは試行錯誤してアプリを利用し、徐々に使い方を理解していきます。

Snapchatのようなデザインガイドラインを無視したUIは最初、使いづらさや違和感をユーザーに与えるかもしれません。しかし、ユーザーに使い方を理解してもらい、アプリに慣れてもらうことさえできれば、デザインガイドラインに沿ったUIよりもスピーディーにユーザーの欲求に応えることができます。

時としてユーザーファーストなUIを作る上で、ガイドラインのような制約を一度取っ払って、考えることも重要なのかもしれません。