モバイルアプリを構築することが目的であれば、ほぼすべてのリサーチで、アプリのデザイン、構造、ユーザーエクスペリエンス、ユーザーインターフェースデザインの重要性について語られるでしょう。このブログでは、ユーザーエクスペリエンス(UX)と、優れたモバイルアプリを構築する際になぜそれが重要なのかについて説明します。

But before we get there, it’s impossible to discuss UX without mentioning UI – or user interface. The two terms are often used together, and sometimes interchangeably, even though their meanings are quite different!

User interface (UI): The look and layout of a product or the aesthetic elements that you see when using the product is called the user interface. Think, typography, colors, designing of elements, using icons and graphics, background images, the hierarchy of information on the screen – all of that comes under UI.

ユーザーエクスペリエンス(UX)。ユーザーが製品を通じて目的を達成するまでの道のりや体験が、ユーザーエクスペリエンスです。これは、アプリの構造と解決策の見つけやすさに焦点を当てたものです。画面の順序、テキスト、プロンプト、実行可能なアクションのオプションなど、これらのすべてが、アプリで目的の最終目標に到達することを容易にしたり困難にしたりします。

ドン・ノーマンは90年代に「ユーザーエクスペリエンス」という言葉を考え出しました。実際、彼はおそらく「UX」を職名に持つ最初の人物です!彼の研究は、今日のユーザーエクスペリエンスの基礎を築きました。ユーザビリティと行動科学に関する彼の研究は、今日のユーザーエクスペリエンスの基礎を築きました。彼は、それをこう表現しています。「製品とは、製品以上のものである。製品とは、製品以上のものであり、一貫した、統合された体験の集合体である。製品とは、製品以上のものであり、まとまりのある統合された体験の集合体である。最初の意図から最後の反省まで、最初の使用からヘルプ、サービス、メンテナンスまで、製品やサービスのすべての段階を通して考える。それらをすべてシームレスに連動させるのです。"

でも、どうやってやるんですか?

シームレスなモバイルアプリのUXを実現するには?

1.素晴らしいオンボーディング/ログイン体験の実現

Onboarding is the process that takes you from opening an app for the first time, to getting set up (whether this means creating an account, signing up, or just jumping straight into using the app). It’s the first impression, that sets the tone for what users can expect from the rest of your app experience. This means if the onboarding is generally swift, efficient, uncomplicated, and pleasant – people are likely to stick around!

If you’re looking for an easy way to create an awesome onboarding experience on your Adalo, we’ve got you covered with this awesome cloneable kit! It has five different versions to choose from to help you with the sign-up section of your app.

2.ナビゲーションをわかりやすく

モバイルアプリを長く使っている人は、自分の使い方を知っているものです。このため、アプリのナビゲーションを簡単かつ直感的にし、ユーザーが最初に探した場所で探しているものを正確に見つけられるようにすることが非常に重要です。アプリのユーザーは、自分がどこにいて、どこに行けばいいのか、常に知っている必要があります。つまり、メニューのカテゴリー、ナビゲーションバー、1つの画面から次の画面への移動がわかりやすくなければならないのです。

ここでは、そのヒントをご紹介します。

  • ユーザーが簡単に「戻る」ことができるようにする
  • ナビゲーションボタンを常に見やすくする
  • Androidではナビゲーションドロワー、iOSではタブバーを使って、ナビゲーションを簡単に行うことができます

3.画面が散らからないようにする

これはUIの範囲に含まれますが、明瞭性はUXの大きな部分であることを忘れないでください。アプリのどこに行けばいいのか、ユーザーは明確に識別できますか?画像、アイコン、ボタン、テキストなどの要素が多すぎると、圧倒され、混乱してしまいます。

一般的には、以下の点に注意して、散らからない画面を目指しましょう。

1. Focus on no more one key action per screen, with up to 7 total options

2.見出しや文章は簡潔でわかりやすいものにする(アプリのコピーの書き方についてのブログはこちらです)

3.ホワイトスペースを賢く使う

楽しい科学の事実!

人間の即時記憶の容量は7項目程度という「ミラーの法則」というものがある。Instagramのようなアプリでは、一般的に1つの画面で可能なアクションは7つまでとされています。フィードを開いたら、次のどれかをすることができます。

1.ストーリーを見る

2.投稿とのインタラクション(いいね!、コメント、シェア)

3.何かを探す

4.リールを見る

5.通知へ移動

6.DMを確認する

7.プロフィールへ移動

4.スキムフレンドリーなコンテンツを心がける

ノートパソコンやデスクトップパソコンに比べ、モバイルの画面はとても小さいです。特に、読みやすさを重視する場合、必要な情報をすべて盛り込むことは困難です。実際、ユーザーはコンテンツを「読む」ことはほとんどありません。通常は、キーワードや単語を拾いながら、ざっと目を通すだけです。

読みやすさを向上させたいのであれば、内容を簡潔かつ明瞭にすることが一番の近道です

5.タップターゲットを容易にする

タップターゲットとは、ユーザーがある要素に関与するためにタップする必要があるボタン、リンク、場所のことです。特に親指でタップできない場合、画面をタップする正しい場所を見つけるのに苦労するほど、イライラすることはありません。

ここでは2つのことが重要です。大きさ、そして間隔です。

サイズ。これらのアクションをとらえるために、インターフェイスの要素を十分な大きさと快適さにすることが目標になります。スマートフォンを操作するとき、人は他のどの指よりも親指を使うものです。ボタンやその他のタップターゲットの適切なサイズを選択する方法について悩んでいる場合、AppleのiPhone Human Interface Guidelinesでは、最小ターゲットサイズを幅44ピクセル×高さ44ピクセルにすることを推奨しています。MicrosoftのWindows Phone UI Design and Interaction Guideでは、タッチターゲットのサイズは9mm/34px、最小値は7mm/26pxを推奨しています。

間隔。 タップターゲットがお互いに近すぎると、誰かがターゲットを見逃したり、間違って打ってしまったりする可能性が高くなります。ミスを最小限にするために、適度な間隔を空けて配置しましょう。

6.アクセシビリティはすべての人を幸せにする

現在、モバイルアプリは年齢層や露出を問わず、あらゆる人が利用しています。世界人口の約15%が何らかの障害を持ちながら生活していることを考えると、アプリをデザインする際には多様なニーズへの配慮が欠かせません。

デザインを「アクセシブル」にすることで、視覚、言語、聴覚、身体的な違いに関わらず、誰もが同じ体験をすることができるようになるのです。しかし、なぜそれが重要なのでしょうか?デザイナー、開発者、メーカーであるあなたには、テクノロジーをより良いものにするチャンスがあります...一部の人のためだけでなく、すべての人のために

7.ボタンに関するベストプラクティス

アプリのボタンは、簡単で、親しみやすく、邪魔にならないものがベストです。ここでは、一般的なボタンデザインをいくつか紹介し、注意点を説明します。

1.一般的なボタンの種類角丸四角形ボタン、角丸四角形ボタン、ゴーストボタン。

2.ボタンと他のデザイン要素の間に十分な空白があること。

3.ボタンがユーザーの目につきやすい場所に配置されていることを確認する

4.ボタンには、意図するアクションを明確にラベル付けし、できるだけ直接的な表現を心がけましょう。例:「カートに入れる」、「申し込む」、「今すぐ予約する」。

UXデザインは、テクノロジーが私たちの生活により不可欠で身近なものになるにつれて、常に進化しています。結局のところ、優れたUXを持つモバイルアプリを作りたいのであれば、自分だけが使いたいと思うような製品を設計することはできないのです。最新のUXデザインのトレンドを追いかけ、ベストを尽くすだけではダメなのです。最高のアプリデザインとエクスペリエンスの核となるのは、ただひとつ、ユーザーなのです。

We’ve taken the liberty of breaking down the process of user research for you, including some helpful tools to make it easier. By focusing on who your target users are, what they want, how they behave, and what makes them happy, you’ll end up building a successful mobile app that attracts a loyal fanbase.

Feeling Inspired?

Get started with our Responsive Design

LEARN MORE

Create Your App Today

Start building in a matter of minutes

はじめに