最初の起動チュートリアル-重ねられたスクリーンショットとオーバーレイされたバブル？
ユーザーが最初にモバイルアプリケーションを起動するときに、インターフェイスの主な機能/コントロールを説明するいくつかの手順を実行してもらいます。
私は2つの可能性を考えています。
- Gmailが数か月前に新しいバージョンのGmailで行ったように、テキスト付きの一連のスクリーンショット
- コントロールを直接表示する一連のオーバーレイされたバブル。
オプション＃2は、ユーザーの焦点をはるかに保持していると思うので、信じています。しかし、業界の他の人たちはオプション＃1を主張します。
これについてどう思いますか、どのバージョンが最も効果的だと思いますか？
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
私はオプション2の線に沿って何かを行いますが、ユーザー主導型で、理由は次のとおりです。
前後関係の知識は、事前知識より保持しやすいはずです。
また、
Nextsをクリックするだけでなく、インタラクションのレイヤーを追加して、ユーザーにインタラクションを実行させます。より深い影響を与える-数学の教科書を読むか、それに沿って例を実行するか。
Dan1111はこれを指摘するのに十分親切でした。どのようなアプローチをとっても、ユーザーがウォークスルーを無視できるようにするために、常に「スキップ」機能を用意してください。
あなたの状況に基づいて、オプション＃1は初心者ユーザーの注意を引くのが少し難しいでしょう。また、チュートリアル自体を理解するのに時間を浪費することは間違いありません。
それどころかオプション＃2は、ユーザーが何が起こっているのかを理解するのにそれほど多くの努力を必要としないので、常により役立つでしょう。したがって、この場合、ユーザーはチュートリアル自体でシステムを操作しているので、システムを使用する自信が高まります。
エキスパートユーザーは、常にアプリを使用する方法を見つけます。システムの設計中は常に初心者/初心者に焦点を合わせておくための方が優れています。
2回目がいいと思います。ユーザーが集中しているだけでなく、ユーザーが各機能の位置を理解し始めるためです。彼らは後でそれを思い出すことができるでしょう。
小さな有益なヘルプのもう1つの便利な場所は、空のリスト/スペースです。これらはモバイルではよりトリッキーです-それ以外に、それは実際には初めてのガイドではなく、関数の最初の使用までのガイドです。これは、空のスペースがどのように役立つかを示す1つの側面です（このトピックの詳細： http://tympanus.net/codrops/2013/01/09/designing-for-the-empty-states/ ）
補足：マーケティング目的でのみ存在するオンボーディングカードをたくさん見ました。私はそれらが好きではありません-それを試さずに何かを購入したいのです:)カードに関するもう1つの一般的な問題は、興味があると思っているユーザーでさえそれらを実行してほとんどすぐに忘れてしまうことです。新しいアプリケーションを試すことに興奮すると、学習能力が低下します。
＃2を好みますが、通常はチュートリアルを無視します。ほとんどの場合、彼らは明白なことを指摘します。歯車のアイコンは設定です。または最悪の明白なマーケティング。これは通常私を激怒させます。
したがって、バブルは新しい機能を導入するだけです。さらに、使用可能なアプリを作成すると、このチュートリアルの必要性がいずれにせよ減少します。
ポイント＃2に加えて、最初にホームページ要素のみを表示する必要があり、ユーザーがその機能を使い始めたら、適切にすべての詳細をホームページに表示するのではなく、そのページに到達したら、その機能に関連付けられた詳細を表示する必要があります。 。
アプリのホームページに2つのアイテムがあり、上部に設定アイコンがあるとします。設定やその他の2つのアイコンについて表示される場合があります。ただし、ユーザーが使用を開始した後、機能Aに移行したとき、初めて起動したときにオーバーレイを指定する必要があります。
オプション2の大きな利点は、テキストを読んでチュートリアルの内容を知る必要がないことです。 about。より視覚的になり、コントロールがどこにあるかを正確に確認できます。より魅力的だ。 Path iPhoneアプリも同様のことを行いました。 @rkコメントに同意します。ユーザーはチュートリアルを使いたくないので、スキップオプションを追加するのは良いことです。