読者です 読者をやめる 読者になる 読者になる

No Web Service No Life

クラウドソーシングサービス「ランサーズ」のプロデューサーです。Webサービスや構成要素(UIや技術)について書いています。

色々なWebサービスの会員登録画面デザインまとめ


多様化する会員登録画面

色々なWebサービスの会員登録画面を、導線やSNS連携ボタンの配置を主軸に分類してみました。

各サービス、会員登録CVRを上げるために、導線や提示方法を工夫しています。また、SNS連携が必須になってきたことによって、画面に占める要素が増えてきており、その配置方法にも工夫がみられ面白いです。
※キャプチャ取得タイミングの関係で、古いデザインもあるかもしれませんがご了承下さい。

ポップアップ提示パターン

Sumallyやpixivは、Cookie制御がされており、初回訪問時にアグレッシブにポップアップを提示してきます。

Sumally

f:id:kkino0927:20130804205959p:plain

pixiv

f:id:kkino0927:20130804210006p:plain


Blabo!やAirbnbは、会員登録リンクを押すとポップアップで提示されます。

Blabo!

f:id:kkino0927:20130804210008p:plain

SNS連携ボタンが上に配置されているパターン

通常の会員登録への導線やフォームの上に、各種SNSのボタンが配置されているパターンです。nanapiやカカクコムなど。

nanapi

f:id:kkino0927:20130804210412p:plain

fiverr

f:id:kkino0927:20130804205953p:plain

カカクコム

f:id:kkino0927:20130804210012p:plain

Pinterest

f:id:kkino0927:20130804205956p:plain

SNS連携ボタンが下に配置されているパターン

先ほどとは逆の配置です。BUYMAジモティーなど。

みんなのウェディング

f:id:kkino0927:20130804210014p:plain

SNS連携ボタンが左に配置されているパターン

シェアウィズ

f:id:kkino0927:20130804210004p:plain

READY FOR?

f:id:kkino0927:20130804210010p:plain

SNS連携ボタンが右に配置されているパターン

クックパッド

f:id:kkino0927:20130804210007p:plain

CAMPFIRE

f:id:kkino0927:20130804210009p:plain

トップからSNS連携ログインができるパターン

SNSログインが前提となっているサービスに多いパターンです。

Qiita

f:id:kkino0927:20130804210415p:plain

コーヒーミーティング

f:id:kkino0927:20130804210406p:plain

WishScope

f:id:kkino0927:20130804210003p:plain

UI・デザインの参考書籍

会員登録画面に限らず、ディレクターとして、下記の知識があると、UI設計やデザインの際に役に立ちます。

インタフェースデザインの心理学 ―ウェブやアプリに新たな視点をもたらす100の指針

インタフェースデザインの心理学 ―ウェブやアプリに新たな視点をもたらす100の指針

誰のためのデザイン?―認知科学者のデザイン原論 (新曜社認知科学選書)

誰のためのデザイン?―認知科学者のデザイン原論 (新曜社認知科学選書)

広告を非表示にする

最新のWebサービス・スマホアプリの情報が毎日メールで受信できるキュレーションサービス『Service Safari』を運営しています。
エンジニアを募集していますので、ご興味のある方はFacebookやTwitterからご連絡ください。