海外のtoCサービスのフォームUIまとめ
こんにちは、言葉遣いが荒い女性が好きなデザイナーのひとみです。
フジテレビで放送開始した「セシルのもくろみ」というドラマに言葉遣いが荒い女性キャラクターが何人かいて、見ている最中ドッキドキでした。連ドラ自体あまり見ないので、最後までちゃんと見れるか不安ではあります・・・。
そんな話とは関係ありませんが、今回はtoCサービスを運営していくのに欠かせない登録フォームのUIを海外サービスに着目してまとめました。まとめてみると、発見があるかも！
Airbnb
◆サービス概要
民泊サービス
◆フォームUI
ポップアップでフォームが出てくるタイプのUI。フォームのラベルがなく、入力欄に補助テキストとして表示。ほどよく説明文が表記されているのがわかりやすく、クリアーな印象です。
Uber
◆サービス概要
配車サービス
◆フォームUI
運転手と乗客用で分離していました。こちらのキャプチャは乗客用です。少し縦に長くなっていますがフロー図が明快なので不安がありません。
Fiverr
◆サービス概要
$5で仕事依頼ができるオンラインマーケット
◆フォームUI
ポップアップでフォームが出てくるタイプのUI。最初いんメールアドレスを入力するとユーザー名やIDを入力する画面に切り替わる。最低限の入力だけで後は登録後に追加入力するだけ。項目数が少ないので簡単に登録できますね。
Amazon
◆サービス概要
EC
◆フォームUI
非常にシンプルで明快なフォーム。住所などの登録は注文するときだけに必要なので、ここでは項目がない。無駄なものが一切ないので明快だがテンションが上がらないと感じました。
invision
https://projects.invisionapp.com/
◆サービス概要
プロトタイプを作成 / 共有
◆フォームUI
左側の写真とテキスト部分が目を惹くUI。レスポンシブで画面が小さくなると、消えます。invisionらしいUIですね。
Upwork
◆サービス概要
クラウドソーシング
◆フォームUI
Amazonのように、非常にシンプルで明快なフォームです。アイコンがわかりやすく、優しい雰囲気なのが登録のハードルを低くしていますね。
COACH UP
◆サービス概要
スポーツのコーチマッチングサービス
◆フォームUI
まず自分がコーチなのか、指導を受ける側なのかを選択でき、専用フォームが出てきます。珍しい横並びのUI。スポーツらしい力強いデザインとイメージしやすい写真を用いてますね。
slack
◆サービス概要
チームコミュニケーションツール
◆フォームUI
メール登録やチーム登録など、段階のあるフォーム。slackは全体的に可愛らしいUIですが登録UIはシンプル。説明文が多いのが少し気になります。
GitHub
◆サービス概要
Gitバージョン管理システム
◆フォームUI
サイトトップの登録フォームではなく新規登録専用画面。ちょっと古いUIですね。右にいろいろ書いてあったり説明文が多いのが特徴的。フロー図があるので不安は少ないですね。
以上、知ってる海外サービスをまとめてみました！
いかがでしたでしょうか？次はインタラクションにまで注目したまとめを書ければと思います。
サービスUIを勉強したいデザイナー志望の方募集中！
メゾンマークで開発中の野球サービスでは、絶賛フォームデザインを制作中！プロトタイプを作り、プロジェクトのメンバーはもちろん、様々な人に触ってもらい意見を収集して改善しながらデザインをしています。
メゾンマークでは、クリエイティブデザインからサービUIの知識まで幅広く学べるような環境を構築しています。デザインの力をおもいっきり活かしてみませんか？
