2014.8.6 / UI

対象のユーザーによって変化するサービスの入り口

Tomohiro Suzuki

少しややこしいですが前回の記事(ユーザーとサービスの最初の出会いでのUIデザイン)で紹介した登録画面、またはその一つ前の画面をまとめたUIのパターンとしてウェルカムスクリーンと呼ばれるものがあります。モバイルアプリケーションでよく見かけるUIで、画面サイズ的な制約上、登録とログインの分岐をさせるために生まれたのではないかと考えられます。
ウェルカムスクリーンの語源については、ユーザーが最初に目にする画面でもあり、画面上に「Welcome」などのラベルが表示されることから付けられた。またはより現実的なところでは、空港や駅などの多くの人が行き来する場所で迷わないために家族や友人などがウェルカムボードを掲げ、辿り着いた人(ユーザー)が迷わないように導くことからこの名前がついたのではないかと思います。
このウェルカムスクリーンですが、サービスを利用するユーザーによっていくつかのパターンが存在します。もしあなたのサービスがリリースから一定の時間が経過しており、ウェルカムスクリーンに訪れるユーザーの属性や傾向などが判断できる状態であれば、ユーザーのタスクを減らし、実際にサービスを使い始めるまでの時間を短縮できるかもしれません。

ウェルカムスクリーンの定義

ややこしいため、もう少しウェルカムスクリーンについて詳しく紹介します。
このウェルカムスクリーンは、ユーザーがログインしていない状態でアプリケーションを起動後、最初かウォークスルーなどの説明後に表示される画面であり、登録かログインへの分岐が存在するものと定義します。本来であれば、分岐が必要なくともユーザーを迎え入れる画面として存在していればウェルカムスクリーンと呼ぶことができますが、本記事内では分岐が必要なケースに絞って紹介していきたいと思います。
この定義に基づき市場に出ているアプリケーションのウェルカムスクリーンを分類すると、下記の4つのパターンに分けることができます。
(今回はアプリケーションの場合についての考察となりますが、Webサービスの場合にはもう少し異なる傾向があるため、またいつか記述できればと思います)

  • 登録特化型
  • ログイン特化型
  • 登録ログイン分岐型
  • 登録ログイン一体型

登録特化型

新規の登録に特化しているウェルカムスクリーンのパターンです。主にモバイルアプリケーションのみで提供しているサービスや、リリースしたばかりのアプリケーションで多く見られます。また、リリースから時間が経っているサービスでも、モバイルアプリケーションでは一度ログインしたらなかなか再ログインするということはないため、新規ユーザーに絞った戦略としても検討できるかもしれません。新規ユーザーはすぐに入力フィールドに情報を入力することでサービスを使い始めることができるため、後述する分岐型に比べて1アクション少なくサービスを利用することができます。
サンプルで表示しているIFTTTというアプリケーションでは、ウォークスルーの最後のページにこの画面が存在しています。新規ユーザーが多いため、ウォークスルーでサービスの内容をユーザーに伝えた上で登録をしてもらうという設計に基づいて作られています。もちろんウォークスルーがなく、スプラッシュ画面の直後に登録特化型のウェルカムスクリーンが表示されるというサービスもあります。

ログイン特化型

2014-07-02_Contents02

登録特化型とは逆にログインに特化しているパターンです。あまり多くはありませんが、Webサービスなどで多くの利用者を集めている、またはTwitterやInstagramクライアントなどのサードパーティ性アプリケーションで見られるパターンです。既存ユーザーは分岐型に比べ、1アクション少なくサービスを利用することができます。
チャットワークのアプリケーションでは、今までWebサービスとして展開していたため、アプリケーションでは既存ユーザーの利用を前提として設計されています。

登録ログイン分岐型

最初にユーザー自身がログインが登録を選択するというパターンです。現在、市場に出ているアプリケーションではこのパターンが最も多いのかもしれませんが、サービスを利用するユーザーの属性によってはどちらかに特化させることも検討できるでしょう。
SnapChatのアプリケーションでは、ビッグボタンと対照的な配色を使い、シンプルな形で分岐を作っています。分岐型の特徴として、登録とログインの2つのボタンだけではなくSNSログインなどのボタンも追加してしまうと、ユーザーがこの画面での判断を少し悩むことがありますが、SnapChatは考える時間を最短にするという意味で良い例でしょう(言語的に日本人が迷いやすいというのは置いておいて)。

また、最近よく見かける分岐型として、ウォークスルー並行型というものがあります。画面上部ではウォークスルー、画面下部は固定で分岐となっています。
SpotifyやZaimのアプリケーションではこのパターンが採用されており、ユーザーがサービスの内容に魅力を感じたらウォークスルーの途中でも登録やログインに進むことができます。また、すぐに利用したいというユーザーはウォークスルーを飛ばして登録やログインに進むこともできるため、少し選択肢は増えますが、有効な方法かもしれません。

登録ログイン一体型

最後に登録ログイン一体型という少し特殊なパターンを紹介します。一体型は新規のユーザーと既存ユーザーの区別をこの画面では行なわず、システム側で判断して次のアクションを提示するというものです。
Evernoteのアプリケーションではユーザー名かメールアドレスを登録し、もしデータベースにこの文字列が存在していればそのままログインのためのパスワードを入力。文字列が存在していなければ新規登録へと進みます。ユーザーのタスクとしては最も簡単ではありますが、あまり見慣れない形であるため、サービスは登録かログインの選択が存在すると思っているユーザーにとっては逆に混乱を与えてしまうかもしれません(実際にテストをしたことはないため、あくまでも主観です)。
将来的にこの形が増え、一般的になればもう少し普及することも考えられますが、現時点ではあまり多くは見かけないパターンです。採用する際には、ユーザーの混乱がないかどうか少し慎重に検討する必要があるかもしれません。


以上、4つのパターンに分類し、それぞれのウェルカムスクリーンの特徴を分析してみました。しかし前回の記事でも書きましたが、まずは本当に登録の必要があるのかについては検討が必要です。例えウェルカムスクリーンを最適化したとしても、ユーザーの面倒なタスクであることには変わりありません。
もしあなたが自社サービスのデザインを行なっているのであれば、もう一度ウェルカムスクリーンを見直してみてはいかがでしょうか。どのパターンを採用するかの基準としては、現在のウェルカムスクリーンを訪れるユーザーの属性、リテラシー、または新規ユーザーを増やしたいなどの戦略を元に判断できるはずです。

お互いの学びと成長を促せるメンバーを募集しています

STANDARDは「未来の豊かさにつながる仕組みをデザインする」というミッションを元に、人の役に立つ事業やビジネス、サービスの創出や改善をデザインの力で支援し続けています。

そのために、お互いの価値観を尊重し、学習と実践と内省をしながら成長できる場所であり続けることを目指しています。

あらゆる物事の仕組みを設計するデザイナーとして、ご一緒に考えながら試行錯誤していきたいという方からのご連絡をお待ちしています。

記事一覧へ

Related Articles

About us

私たちはユーザーへの価値とビジネスの成立を実現するUXデザインを提供し、
アプリやWebサービスの新規立ち上げや改善をサポートしています。

STANDARDはUXデザインを軸に、新規事業の立ち上げや既存サービスの改善を支援するデザイン会社です。