ホームページ » ウェブデザイン » ユーザーが実際に学ぶのを助けるオンボーディングプロセスの設計

    ユーザーが実際に学ぶのを助けるオンボーディングプロセスの設計

    新しいアプリに飛び込むには、通常どのように機能するかを学ぶのに苦労します。あなたはすぐにそれに夢中になるかもしれませんが、 常に学習過程があります. の目標 オンボーディング です 新しいユーザーを紹介する Webサイト、プログラム、またはアプリケーションに。オンボーディングでは、あなたは教えるべきです 個々の機能、それらの機能, そして アプリがどのように価値を提供するか ユーザーに.

    最近の投稿で私達はカバーした モバイルオンボーディングスクリーン その焦点 デザインとコンテンツスタイル. この記事では、ユーザーエクスペリエンスとマーケティングプロセスに関するヒントを共有したいと思います。 オンボーディング・プロセスを通じてユーザーを案内する.

    画像と図を使用する

    グラフィックと視覚的要素 言葉よりもはるかに優れたユーザーエクスペリエンスを説明できます。助けるためにビジュアルに頼る プロセスを通じてユーザーをガイドする 必要に応じて。オンボーディングプロセスに目を向け、意図を明確にするので、これは貴重な戦略です。ビジュアルであなたの目標は 伝えるよりも見せる.

    あなたはこれで多くの異なる方法を行うことができます フルスクリーンショット、小さいアイコン、イラスト・ベクターグラフィック これは設計ワークフローに適合します。例えばデザイナーSalman Shahによるこのオンボーディングスクリーン.

    彼はベクトルのアイコンを 各スライドを視覚的に合図する. アイコンの働き 各点の比喩として, そして助けて 機能を売る ユーザーに.

    ゼロからアイコンをデザインするスキルがない場合は、いつでも使用できます。 無料のアイコンパック あなたの利点に。多くのデザイナーが自分の作品を無料で公開しています。 あなたのオンボーディングスクリーンにこれらのアイコンを組み込んでください.

    あなたは静的なアイコンを超えて移動することができます アニメーションを含める 同様に。たとえば、Iaroslav Zhmakによって作成されたファイナンスベースのオンボーディングプロセスを考えてみましょう。.

    彼は使う たくさんのアイコン だけでなく 各セクションにアニメーションを配置する. あなたはアプリが視覚的な合図を通して何をするかを学びます あなたの注意を引くためにアニメート.

    各オンボーディングスライドに注意してください。 テキストの説明もありますか. ユーザーにできることを伝えるので、これがメッセージの本質です。 実際にアプリケーションで行う. テキストのみのページでは 息苦しい大学の教科書のように感じる しかし。ビジュアルとアニメーションを使って、搭乗手続きの各部分を盛り上げる.

    機能を実際に表示する

    しようとする 明白な特徴を述べるのを避ける またはアプリの個々の部分をすべて暗記するようにユーザーに強制する。またしようとする 基本的な文を避ける 好きなアプリの周りのユーザーをガイドする “これはメインメニューです、これは友達の画面です”, など代わりにこれらのことに焦点を当てるようにしてください できる, そしてどのようにユーザー これらの分野と交流することができます.

    この戦略は古いマーケティング格言を彷彿とさせる “ステーキを売るな、シズルを売る”. アプリを売りたい ユーザーへの利点を通じて, 任意の機能やメニュー項目ではありません.

    例えば、Prakhar Sharmaによって作成されたこのデザインはあなたの銀行口座で働くことの完全なプロセスを通してあなたを導きます.

    デザイン 自然な流れを提供 あなたが始めるのを助け、道のあらゆるステップをあなたに導きます。このオンボーディングプロセスにより、ユーザーは 行動を起こす これが最終的には主な目標です.

    どちらでもできます 機能を実際に表示する デモを通して、またはあなたはユーザーを助けることができます オンボーディングプロセスを通じて行動を起こす. どちらの方法 消費に対する行動を促す これは通常、より魅力的なユーザーにつながります。.

    Riko Sapto Dimoによって作成されたYouTubeスタイルのアプリのオンボーディング画面のもう1つの良い例を見つけました。それはメッセージを伝えるためにビジュアルとアイコンを使いますが、またユーザーを助けます アプリに飛び込む前に行動を起こす.

    後に “使い方” 選択できる画面 通知を設定する ボタンをクリックするだけで。これは 素晴らしい戦略 多くのユーザーはアプリを完全に忘れてしまうでしょうが、 ポップアップ通知 彼らはします 最終的にそれをもう一度使う (または通知を無効にする).

    追加することもできます 機能を有効または無効にするボタン オンボーディングプロセスの任意の時点で。これらの機能は、ニュースレターの登録、他のアカウントのフォロー、さらには 更新を購読する. ただ ユーザーを参加させる, そして彼らを助けなさい 行動を起こす. そこから、それはより簡単になります 彼らを夢中にさせる.

    一度に1つの機能を表示する

    ほとんどのオンボーディング画面には特定の機能が表示され、最初から最後までプロセスを進めることができます。. ユーザーを急がないで, そして間違いなく たくさんの情報を突き出すな 一度に画面に.

    新規ユーザーを興味深く興奮させ続けるための秘訣は、 焦点を合わせる そして 一度に1つの機能を紹介する. あなたが画面にあまりにも突き出した場合、ユーザーはすることができます 圧倒される. オンボーディングプロセスがあまりにも退屈であるならば、人々は退屈してやめるでしょう.

    各スクリーンは少なくとも持っているべきです 一つの新しい情報 それはユーザーにとって価値があります。また、Web上でこれを行うことができます モーダルウィンドウ/ダイアログボックスアプローチ. しかしあなたはまだ守るべきです 一度に1つのトピックに集中する 属する場所に注意を引く.

    Dropboxチームはオンボーディングを使った新しいデスクトップアプリを計画しています、そしてWes O'Haireは彼のDribbbleアカウントでこの例を共有しました.

    このオンボーディングスクリーンに関するすべて とても自然に感じる. あなたは青いバーがあることを示しています オンボーディングプロセスのどのくらい遠い 行ったそれからあなたはまたへの明確な指示があります 段階的に動く プロセスを通じて。またあります 戻るボタン ユーザーが以前のステップを忘れた場合、または要約を求めたい場合.

    フォーカス ゲームの名前です、そしてこのデザインはユーザーを保ちます 行動に焦点を当てた. このオンボーディングプロセスの終わりまでに、新規ユーザーは以下のことが可能になるはずです。 快適に使う デスクトップ上のDropboxアプリでアップロード、ダウンロード、その他必要な操作を実行.

    そして覚えている メリットよりもメリットが高い. 説明する ユーザーがアプリから取得したもの 実行速度や、いくつのプロファイルを作成できるかではなく.

    上記の例では、Qikwellという健康/医者の予約アプリからいくつかの画面を表示しています。各スライドは1つの主要な機能を示しています ユーザーの利益に向けて (予定の空き状況と合計の行数).

    最後のスライドにも小さい “はじめに” リンクする 次のステップについてユーザーに案内する. エンゲージメントを促進するためにそのリンクの可視性を高めるでしょうが、それを持っていることは素晴らしいアイデアです.

    忘れずに 単純明快. プロセスの各ステップ ゴールがあるはず ユーザーに教えるか、彼らがアプリケーションの中にさらに入るのを助けるために.

    アクションで締めくくる

    オンボーディングプロセスが終了するまでに、知っているユーザーがいるはずです。 アプリが提供すること、彼らができること, そして なぜ彼らはそれを使うべきか. それでも彼らは プッシュが必要 実際に行動を起こして何かをすること.

    何らかの種類のリンクやボタンをクリックして、オンボーディングを終了してください。 どこかで始めるようにユーザーを駆り立てます. これは、設定ページ、プロフィールページ、ユーザーフロー画面、または同様のものです。.

    最高の 推奨処置は異なります アプリの目的に基づいています。栄養アプリは新しいユーザーにその日の自分の食べ物の記録を開始するように勧めますが、ソーシャルネットワーキングアプリはユーザーをプロフィール画面または 推奨ユーザーリスト フォローする.

    Oktafian Nugrahaによるこのアプリのデザインでは、大きなオレンジ色に気づくでしょう “始めましょう!” 最後のスライドの下部にあるボタン。これは超明るくて見逃すのはかなり難しいです.

    この最後のアクションボタンは、 最終目標はユーザーの定着です. このボタンをオンボーディングプロセスに固執してください。 見えていることを確認してください. ユーザーがオンボーディングを完了しても、まとめられるボタンが表示されない場合は、 閉じ込められた感じ そして そのまま出発.

    これを台無しにするのはかなり難しいです。 典型的なユーザーフローを計画する, そしてあなたを確認してください 適切なページへのリンク オンボーディングプロセスの最後に。オンボーディングがその仕事をしたならば、新しいユーザーはすでにすべきです そこから何をすべきかを知っている.

    最後の一見

    すべての新しいプロジェクトには、新しいユーザーのための何らかのヘルプガイドまたはオンボーディングプロセスが必要です。それは最速の方法です 新規ユーザーをガイドする, と より多くの人々を関与させ続ける 携帯アプリ、Webサイト、またはデスクトッププログラムで.

    デザイン美学 重要ですが、ユーザーエクスペリエンスはすべてに勝ります。正しく行われると、オンボーディングプロセスは次のようになります。 教育的で、うまくいけば少し楽しい!