アプリ&Webサービス企画

アプリのUX/UIをデザインするなら絶対に見ておくべき海外のサイト7選

finger

アプリのUX/UIでお悩みのデザイナー・ディレクターの皆さんへ。今回は3つの切り口で、アプリのUX/UIをデザインするときに参考にしたい海外のサイトを7つ紹介したいと思います。

1) オンボーディングのUXデザインをするときに参考にしたいサイト
2) ユーザーアクションや目的に合ったUX/UIデザインをするときに参考にしたいサイト
3) UIデザインのインスピレーションを得たいときに参考にしたいサイト

オンボーディングのUXデザインをするときに参考にしたいサイト

オンボーディングとはゲーミフィケーションのフレームの1つで、「新規ユーザーにアプリ(サービス)の価値を伝え適応させる」プロセスのことです。巷で話題のグロースハックのAARRRモデルに置き換えるなら、「Acquisition(ユーザー獲得)」「Activation(利用開始)」部分にあたります。オンボーディングが担うものは、アプリの生命線です。いかに素晴らしい体験を提供できるアプリを作っても、オンボーディングが上手くいかなければ誰も使ってくれません。そこで参考にしたいのが、次の2つのサイトです。

User Onboarding

User Onboarding   A frequently updated compendium of web app first run experiences

サイト名の通り、主要Webサービスやアプリのオンボーディングについて紹介しているサイトです。オンボーディングを画面単位で切り分けて、良い所と改善したほうがいいところを紹介しています。スライド形式で、平易な英語で読みやすく、指摘内容もとてもわかりやすいです。紹介されているオンボーディングのうち、スマホアプリに限定すると、

Instagram
Pocket
Snapchat
WhatsApp

があります。指摘している内容を絶対に信じろ!というわけではありませんが、専門家の丁寧な指摘を読むことで実践ベースのオンボーディングの知識が得られます。

User Onboarding

First Time User Experiences

First Time User Experiences

こちらもサイト名の通り、アプリの初回ユーザー体験を紹介しています。User Onboardingと違い、アプリの画面を一通り紹介した後に、「The good bits」「To be improved」という形で、まとめて指摘しています。User Onboardingに比べて丁寧さはなくなりますが、アプリに限定していることと、紹介しているアプリの数が多いので、自分が設計仕様としているアプリに似たものが見つかるかもしれません。アプリを探すならトップページをスクロールするよりも、アーカイブページから探すのがオススメです。

First Time User Experiences

2) ユーザーアクションや目的に合ったUX/UIデザインをするときに参考にしたいサイト

UX Archive

UX Archive

オンボーディングに限らず、アクションごとのアプリ導線を設計したいときは、UX Archiveを参考にしています。このサイトは、ユーザーのアクション(Searching, Signing up, …)ごとに、アプリ導線を画面単位で紹介しています。このサイトは各アクションや画面に対してのコメントはありませんが、主要なアプリが網羅されているので、「あのアプリで◯◯するときってどんな感じだったっけ?」にすぐ答えてくれます。

UX Archive

User Flow Patterns

User Flow Patterns

こちらもユーザーアクションごとにUX/UIパターンをまとめています。比較的新しいサイトなので全体の掲載量は少ないのですが、新しいアプリを中心に取り上げられています。週刊で更新情報をメールで教えてくれたり、左メニューの下から遷移できる「Inbox Pixels」や「uiGIFS」もとても参考になるのでオススメです。

User Flow Patterns

pttrns

Pttrns   Mobile User Interface Patterns

ユーザーアクションではなく、その画面の目的に沿ったUIを探すなら、pttrnsがオススメです。このサイトは、iPhoneやiPadのUIパターンをまとめているのですが、カテゴリ分けが「Find Friends」「Recipe」というように細かいので、欲しい情報がすぐに見つかります。

pttrns

3) UIデザインのインスピレーションを得たいときに参考にしたいサイト

Dribbble

Dribbble   Show and tell for designers

定番サイトですね。でも、外せません。「UI」や「Mobile」、「interaction」で検索すると(実現可能かどうかは別として)面白くてワクワクするようなUIがたくさん出てきます。普段から眺めているだけでも楽しいです。

Dribbble

Pinterest

Pinterest

またまた定番サイトです。Dribbbleと同じく、デザイナーなら毎日見ているサイトだと思います。Dribbbleに比べて、検索結果に少しノイズが入るかな、という印象です。

Pinterest

CAPPTIVATE.co

CAPPTIVATE.co   iOS UI Animations

最新アプリのUIや動きを紹介しているサイトです。各画面にマウスオーバーすると、動きのデモが始まります。Dribbbleと並んでオススメのサイトです。

CAPPTIVATE.co

以上が、アプリのUX/UIをデザインするときに参考にしたい海外のサイトでした。これらのサイトからUX/UIデザインのヒントを得て、アプリ開発に活かしていただければと思います。ただ、このようなサイトから得られる情報は断片的なので、実際に自分でアプリをダウンロードし、体験した記録を残すことが大切です。日頃からアプリを使っているときに「気持ちいいな」「あ、これ嫌だな」と思ったところはどんどんメモして自分の糧にしていきましょう!

また、ディレクターの皆さんにオススメの記事を多数書いていますので、あわせてこちらも御覧ください。

セカイラボのディレクターがお届けする記事一覧

SEKAI LAB TIMES(セカイラボタイムス)は、アプリ・Webサービス開発を世界中のエンジニアチームに依頼・発注できるグローバルソーシングプラットフォーム「セカイラボ」が運営しているブログメディアです。


YASUHIRO KISHI / ディレクター・上級ウェブ解析士
セカイラボの何でも屋。主にディレクター。たまにエンジニア。理系眼鏡。読書とアニメ鑑賞が楽しみ。好きな国は台湾とカナダ。