目立たせたいのは登録フォーム?ログインフォーム?各サービスTOPでの扱いを調べてみた

せっかく会員登録してくれようとしたのに、UIがイケてないために逃してしまう。こんな悲劇を避けるために、Webサイトのトップページ、アプリの最初の画面には、会員登録への導線が目立つようにはられています。

そしてA/Bテストを繰り返して最適化が行われていきます。

でもちょっと待ってください! そこ、既存ユーザーのログインでも使うんです!!!

個人的には「ログインフォームをもう少し目立つようにして欲しいのですが……」と思うことが時々あります。まぁ、既存ユーザーは最初の一回ログインすればいいので問題は少ないのですが。

この辺り、各サービスどの様にログインフォームと登録フォームが扱われているのかまとめました。

調べたのは、

  • Tumblr
  • Twitter
  • Facebook
  • Google+
  • Asana

のWebサイトトップページとiPhoneアプリです。あくまで2014年9月の状況ですし、A/Bテストで見え方は異なる可能性も大きいですが、そこは気にしません。

Tumblr

Web画面

f:id:niwaringo:20140911004842p:plain

ログインエリアはすっごいすみっこです。キャプチャ取る時にウィンドウサイズを小さくしていますが、すこし大きなディスプレイでウィンドウの最大化をしていたら見落とす危険があるんじゃないかと心配になるレベル。

ただ、登録フォームにIDとパスワードを入れてもログインできます。登録フォームを最大限に目立たせたいけど既存ユーザーのログインも……的な問題への折衷案なのかもしれません。こんなの普通は気がつかないけどね!

iPhoneアプリ

f:id:niwaringo:20140911004900p:plain

iPhoneでも、これまたログインは左下に追いやられています。Webと同じく登録フォームでログインIDとパスワードでログインできるか試してみたらダメでした……

Twitter

Web画面

f:id:niwaringo:20140911004944p:plain

登録フォームとログインエリアはほぼ同列の扱いですね。

iPhoneアプリ

f:id:niwaringo:20140911005001p:plain

こちらもWeb画面と同じく登録とログインは同列になっています。

Facebook

Web画面

f:id:niwaringo:20140911005017p:plain

ログインフォームは右上のヘッダの中に入ってます。

iPhoneアプリ

f:id:niwaringo:20140911005031p:plain

FacebookはiPhoneアプリではログインが前面に出てきます。登録へのリンクはかなり控え目です。

Google+

Web画面

f:id:niwaringo:20140911005044p:plain

ログイン・登録ともに右上に移動します。他のソーシャルサービスと異なるのは、サービスの特徴が前面に出てきています。

iPhoneアプリ

f:id:niwaringo:20140911005106p:plain

えーと、ログインしかないです。アカウント持っている事が前提という形ですかね。

Asana

Web画面

f:id:niwaringo:20140911005350p:plain

ログインは右上の寄せられています。ただ、登録用のGoogleアカウントボタンをクリックしてもログインできます。

iPhoneアプリ

f:id:niwaringo:20140911005430p:plain

登録が色付きボタンで、ログインは白枠のみのボタンです。どちらかと言えば登録を目立たせたかったという事でしょうか。ちなみに、アプリからではGoogleアカウントでの登録が出来ません。


思った以上に各社各様ですね。とくにアプリは各社のカラーが出ていて面白いです。Facebookのように既に多くのユーザーがいるサービスはログイン重視で、Tumblrのようにこれからまだまだユーザーを増やさないといけない所は極限まで登録フォームを目立たせる、Twitterはその間のように見えます。

各企業の成長度合で設定されるKPIが変わり、それによってUIも変わってくるという事かもしれませんね。