タッチ時代のツールチップ
ツールチップは、アプリケーションを知るのに非常に役立つインターフェースパラダイムです。これらは、ビジュアルコントロールとそのコントロールに関連付けられたアプリケーション固有のアクションの間のマッピングです。ユーザーは、マウスポインターをホバーするだけで、アクションを呼び出すことなく探索できます。
タッチデバイスは、このパラダイムを基本的に不可能にします。これはアプリの使いやすさを制限し、場合によっては非常に不思議になります。
タッチデバイスのツールチップコンセプトの代わりが存在するかどうか知っていますか？それらには、UIインタラクションにおける1つの自由度、つまりポインターの位置が事実上欠けています。この通信チャネルを効果的に回復するにはどうすればよいですか？
質問する相手によっては、ツールのヒントを理解するために必要なインターフェースを再設計する必要があるとさえ言われる場合があります（cf. Jef Raskin ：The Humane Interface）。
実際、ツールヒントはvery特定の問題の解決策です：ツールバーに表示されるような、ラベルのないアイコンボタン。ラベルがある場合はいつでも使用してください。特定のコントロールが何をするかを伝えるテキストを既に持っているので、ツールチップを提供する必要はありません。
さらに、タッチインターフェイスは、今日の [〜＃〜] wimp [〜＃〜] インターフェイスモデルにあまり対応していません。多くのコントロールはマウスポインターでの操作に適していますが、指で操作するのは面倒です。メニュー、チェックボックス、ラジオボタンが思い浮かびます。したがって、タッチインターフェイスのインターフェイスparadigmは、今日のマウスおよびキーボード駆動のインターフェイスとはかなり異なった外観にする必要があります。
したがって、ここで問題になるのは、ツールヒントの不足ではなく、過去30年間、コンピュータと対話する多くの新しい方法を調査しなかった（基本的に Doug Engelbart および Xerox PARC （60年代および70年代）。
タッチ入力は、それがkindaがほとんどの目的で機能するのと同じ十分です。しかし、タッチなしの位置情報コンポーネントだけでなく、精度も欠如しています。基本的にすべてのタッチ入力は、何かに触れたりドラッグしたりするのに適しています。ダブルタップでさえ難しいので、私たちが本当にに必要なのは、特にタッチインターフェイス用にUIを設計および作成する方法の基本的な変更です。
これは、iPhoneなどの専用デバイスで表示されます。これは、マウスポインターもキーボードも持たず、onlyタッチだけのプラットフォームだからです。 。これは、可能なすべての操作方法で使用できる必要があるUIを構築する必要がないことを意味します（現在、Windowsの問題は問題です。マルチタッチラップトップを持っていますが、多くのタスクでタッチが機能しません）。 1つだけです。しかし、「通常の」ソフトウェアとコンピュータのための汎用ソリューションは、現時点ではかなり遠いと思います。
したがって、UIを設計する方法について少し異なることを考えることをお勧めします。前に述べたように（そしてAlan Cooperの About Face で読むことができます）、ツールチップはコントロールをラベル付けしないためのものですラベルがあるか、またはそれらを配置するのに十分なスペースがない場所。ここでの主な使用シナリオはツールバーです。しかし、タッチ用に設計されたインターフェイスでは、すべてのコントロールがとにかく大きくなります。多くの小さいアイコンは、密接にグループ化されており、精度に欠けているという理由だけでツールヒントがあったとしてもifタッチ入力で使用するのは面倒です。
ここを読んで思った。ツールチップは通常、テキストレスボタンにlabelを与えるために使用されますが、インターフェイスで利用可能なスペースを減らしてより多くの情報を与える優れた方法でもあります。場合によっては、状況依存のヘルプや単一のウィジェットの詳細な説明を提供するために使用されます。
Tchalvak's idea すべてのGUI要素にシングルクリックの共通の動作を提供し、ダブルクリックでツールチップを提供することにはメリットがあり、多くの人々と同じように多少発見することさえできます要素に関係なく、すべてをダブルクリックするために使用されます。
でも昔を思い出した ? 何年も前に人気があったボタンをクリックすると、カーソルが疑問符に変わります。ウィジェットをクリックすると、小さなツールチップまたは情報バルーンが表示されます。私はそのようなものがタッチインターフェイスで簡単に使用できると信じています。カーソルがないため、ユーザーに提供ヘルプモードであることを伝える別の視覚的な手掛かりをユーザーに与える必要があります。画面の色合いを変更し、小さなテキストを与えることができます。また、マルチタッチを介して ? ツールチップを取得するために別のウィジェットを押しながら押すボタン（指であまり見えすぎないように、少し離れた場所に表示する必要があります）。
しかし、プログラマーがツールチップを使用できるように同じ技術機能を維持することが可能であるとしても、intentについて検討する必要があります。
私は小さな画面に直面しているときに拡張ヘルプを提供するためにのみ使用します。それ以外の場合は、「ウィンドウ」の下部に常にヘルプ領域を表示します（あらゆる種類の正方形のioインターフェースを参照）。 、コンテンツを変更して、選択したウィジェットの詳細説明やヘルプを提供します。これは、ホバー時の一部の設定ウィンドウで行われます。
結論として、使いやすいツールチップをできる場合でも、何を入力するかを考える必要があります。タッチインターフェースでは、しないあいまいなラベルの付いたボタンを配置します必要なツールチップを理解するにはが、状況依存の高度なヘルプとトラブルシューティングを提供するために使用します。
スクリーンキーボードのツールチップ-タッチされている文字をエコーする-は、ツールチップがタッチインターフェイスで非常に役立つことを私に十分に証明しています。この記事にアクセスして、モバイルWebページに実装する方法を確認しました。
この問題のいくつかの解決策を考えることができます
1）ツールチップを必要としないようにアプリを設計します。ボタンにテキストを配置する（ただし小さくても）、わかりやすいアイコンを使用する、または「ボタンの最初の使用」に「ヘルプの吹き出し」を表示する（ユーザーがボタンの目的を理解したら、「今後表示しない」オプションを使用）
2）タッチダウンではなく、タッチアップでイベントに応答します。 「ヘルプ」の吹き出しを表示して、0.5〜1秒間押し続けたタッチに応答します。ヘルプバブルが表示された場合、ボタンの通常のイベントは発生しません修正（したがって、ヘルプを探しているユーザーがアクションをトリガーすることはありません）。
3） @ voyager が提案する「クエスチョンマーク」ドラッグアンドドロップパラダイムを使用します。または、最初に疑問符を「タップ」してから、ヘルプが必要な項目をタップしてもらいます。
おそらく、永続的なラベルは、インターフェイスで利用可能な多かれ少なかれ「不明瞭」な機能の簡単な説明を提供し、アクションが実行されたときのコンテキスト通知メッセージと組み合わされます-例：ユーザーはデータを変更しますこの通知中に一時的にハイライトされるボタン。
私はツールチップは非常に役立ちますであり、優れたUIデザインには必要ないと主張する人は誰もが非常に制限されていると思います。
ちょうどあなたにいくつかのアイデアを与えるために...
一般に優れたUI設計（人生の他の多くのものとして）一定の使用時間にわたって効果的で効率的なものです。効果的な手段として、次のことができますできることを実行（例：携帯電話で電話をかける）。効率的な手段、それは最小限のユーザーの努力で実行可能（たとえば数字を入力して「ダイヤル」ボタンを押すだけ、ナビゲートする必要がない最初にいくつかのメニュー）。一定の期間は、つまり最初の使用、または逆に、それとすべてを知った後では最適ではない可能性があることを意味します間（例空港のターミナル画面は、Adobe Premiereなどの専門家向けのビデオ編集ソフトウェアよりも、ワンタイムユーザーの「ダミー」に焦点を当てる必要があるかもしれません）。
これは、状況に応じてツールチップが非常に役立つと私が言った
- デザイナーとして特定のUI領域内の一部のGUI機能について詳細を説明したくない/説明できない
- 使いやすさ、利用可能な全体的なスペースなどによる.
- 例えば上記の例をとると、高齢者向けのシンプルなモバイルコールシナリオでも役立つ場合があります.
- それは、私たちが "フリーク"とする多くのことには馴染みがないかもしれません;-)些細なことです。
- また、誤ってショッピングホットラインに電話をかけたり、1000 EURの掃除機なしでは生活できないことを最終的に確信することを恐れずに、周りをクリックすることを勧める必要があります。
- したがって、この場合、ワンクリックのツールチップパラダイムが理にかなっています
- 一般的にはお勧めしませんが
- ユーザーとして提供されたアクション/ボタンなどの意味がわからない
- 経験豊富なAdobe Premiereユーザーでも、前の例に固執して、利用可能なすべてのモジュール/プラグインの特定の機能領域に関するすべての詳細を覚えていない場合があります。
- 例えばほとんどの場合、ビデオをカットし、オーディオ設定をほとんど調整しない場合
- 他の人はその逆の問題を抱えているかもしれません
- 経験豊富なAdobe Premiereユーザーでも、前の例に固執して、利用可能なすべてのモジュール/プラグインの特定の機能領域に関するすべての詳細を覚えていない場合があります。
ここで、タッチインターフェイスの制限と可能性に戻ります...
- :-)ホバー：最近、どこかで、一部のデバイスが実際にタッチパッドに触れる前に指を認識するまたはタッチの強さを区別することがわかりました。 =（たとえば、非常に柔らかいタッチのみ）。これは、WIMP私へのインターフェースで確立されたツールチップ機能の完璧なペンダントのようです。
- もちろん、それはタッチハードウェア機能に依存します
- :-)ズームUI：私は実際同様 ズームUI コンセプトJoey同様に
- 2本の指だけを使用するという概念は、ズームではすでにかなり一般的であり、そのアイデアは非常に直感的です。ボタンのズームに関する典型的なツールチップ情報などの詳細を表示
- このボタンのツールチップが欲しいと私は領域全体を拡大したいのを区別する問題を確かに持ち込みます/ out、ボタンのツールチップを私の指の近くに置いていない
- 一般的なツールチップが有効になっている領域は、ズーム可能な領域とはかなり異なると思いますが
- 例えばいくつかのPDFリーダーのコンテンツ領域は、一般的に視覚的に完全に分離されています。例：ツールバー（ボタン）
- 一部のtext areaなどの非アクション領域のツールチップは、処理するのが簡単ではないか、「ジェスチャ差別化契約」がさらに必要になります
- 一般的なツールチップが有効になっている領域は、ズーム可能な領域とはかなり異なると思いますが
- 開発の観点からも非常に堅牢に見えます
- :-) QM：クエスチョンマークのクリックまたはドラッグアンドドロップ機能ソリューションも良い代替案になる可能性があります
- 画面上の至る所にこれらの多くを持っていることは、特にクリック/ドラッグできるように特定のスペースを確保する必要がある場合、ばかげているように見えます
- どこにでもドラッグできる方がいいようですが、やはり画面上にそのためのスペースが必要になります
- 開発の観点からは、ドラッグアンドドロップは一般的な機能であり、UIでを区別するため、一般的な解決策として少なくとも少し難しいと思います。 handleとここに、私が処理しなければならないいくつかのファイルドロップがあります（たとえば、ファイルアップロード領域）簡単ではないか、少なくとも既存のフレームワークにとって共通の基盤ではないかもしれません
- ：-|ホールド：ユーザーが一定期間プッシュをリリースしない場合のツールチップ]をトリガーするアイデア。 1秒、私にとって2番目に良い解決策のようです
- 前述のオンスクリーンキーボードポップアップのように、これはすでに一部のシナリオで一般的な機能です（たとえば、「o」の上に置いて、oóòôのような選択可能な選択肢のリストを取得します）
- 繰り返しますが、ユーザーのtrustが必要です。リリース時に領域アクションを実行しないためです。
- 一部のボタンでは、ユーザーがやりたいことを区別するのが難しい場合があります。 「+」記号/ボタンをクリックして数を増やし、押し続けると数が増えたり速くなったりすると、このツールチップの機能と矛盾する場合があります
- 非アクション領域では、押し続けるアクションは直感的に見えない場合があります
- 開発の観点からは、言及したようないくつかの動作の矛盾が存在する可能性がありますが、それはかなり簡単かもしれません
- ：-| SCT/DCA：解決策シングルクリックでツールチップを表示、ダブルクリックでアクションを実行想像できる限られたシナリオで役立ちます
- 例えば上記の一部の高齢者またはダミーの人々への携帯電話またはactionはである必要があります/無意識の使用または不明な使用から保護された種類
- ここでも、開発の観点はここで再び堅牢に見えます
- ：-/ SCA/DCT：ソリューションsingle-clickはアクションを実行し、ダブルクリックはツールチップを表示しますは非常に思われます私には奇妙です
- 一部の機能について確信がない場合は、ボタンを1回クリックするのをためらうでしょう。特に、この動作を期待できるかどうかわからない場合は、2度クリックしないでください。
- ここでは開発の視点が問題になる可能性があります：
- その後、ダブルクリックは2回シングルクリックですか？
- 2回目のクリックが認識されない、または認識できない場合はどうなりますか。他のポップアップが表示されるため、UIレイアウトが突然変化し、ユーザーは慎重に狙いを定めていませんでした...
- ：-/その他のジェスチャー：言及した他のジェスチャーを使用する、またはツールチップ領域に疑問符を描く、スワイプ何らかの方法でエリアを越えてなど
- これは一般的な根拠がないように思われるため、他の機能をブロックする可能性があるため、私はそれを好きになりません
まあ、ツールチップの利点は、アクションが発生する前に（非常にマイナーな）情報の上に重なる段階を追加することです。したがって、「ダブルクリック」を介してそのレイヤーを追加し、「シングルクリック」でアクションを実行して情報を表示すると、同等のアイデア。
私たちは皆、誰かが画面に触れ、そのタッチの周りの幾何学的形状の情報を広げる未来の画面インターフェイスを備えた映画を見たことがあると思います。その概念を使用しないでください。最初のタッチでアクションに関する情報をページ内の便利なツールチップとして展開し、次に同じ場所を2回クリックするとアクションが確認/実行されます。
「click-on-item-shows-tooltip-second-click-performs-action」でない場合、どのようにproximity？十分な間隔のあるUIウィジェットに関する情報が必要な場合は、ウィジェットの隣をタッチしてその情報を受け取り、ウィジェットをタッチしてアクションを実行できます。
ツールチップは一般に情報が少ないので（ポインターvsハンド、テキストツールヒント、ホバーボールディング）、ユーザーアクションに細心の注意を払ってツールチップ情報を複製することもできると思います履歴。最近2つのものをクリックする頻度が他よりも多い場合は、デフォルトのツールチップと付加価値を強調し、他のものではなく、頻繁にクリックするものをいくつか表示します。
編集：また、もっと考えてみると、ドラッグスクロールなどの必要がないスペースでツールチップ情報のための申し分のないトリガー。たとえば、iPhoneのキーボードを見てみましょう。ドラッグすると、各文字にツールチップが表示されますが、リリースすると文字自体が実際にアクティブになります。精度の再配置を支援します。
それを超えて、私は詳細が出てくると思います。あなたはラップトップタブレットを話しているのですか？非常に限られたスペースの電話タッチインターフェイス？利用可能なスペースは、タッチインターフェースを使用して物事を行う方法に大きな役割を果たすと思います。
押し続けるとどうなりますか？これは、使いやすさと実装の両面でかなり単純なインターフェースルールになると思います。使いやすさに関する多くのことのように、1つのアイデアがさまざまなコンテキストの束で使用されるのを見るのに少し時間がかかるまでは言うのは難しいでしょう...
これは役立つかもしれません：
彼らはツールチップは
召喚者：
- カーソルを要素の上に置く
- キーボードで要素にフォーカスする（通常はタブキー）
- タッチすると
モバイルのみに関する情報は多くありません。あなたが会うことができる唯一のものはオンタッチです、あなたのボタンが何かをするならそれはイライラします、あなたはそれが何をするかを知る前にそれに触れたくないでしょう。長押しでも機能する可能性がありますが、一部のアプリでは他の機能に長押しが必要です。これは使用されているUXパスであり、ユーザーが指示しない限り、ユーザーは長押しのツールヒントを期待しません。
ツールチップは、デスクトップで行うのと同じように、モバイルでは不思議に機能しない可能性があると考えています。ホバーなしでは、アイコンやボタンの機能をユーザーにすばやく思い出させたり表示したりするための別の予約方法が必要です。
私が考えることができる最良のことはヘルプモードです。設定を押してから「ヘルプ」を押すと、下部に「要素をクリックしてヘルプを表示する」や「閉じる」ボタンなどの短いカードが表示されます。次に、ツールチップ要素を押すと、それらの追加情報が表示されます。
私はこれについて上記で言及しましたが、これのもう1つの最近の使用例はゲームです。多くの場合、ジョイスティックを念頭に置いて設計されています。つまり、操作するボタンは約14個ありますが、ほとんどがゲーム機能で占められています。
RPGでは通常、プレイヤーには不明であることが保証された複雑な統計画面があり（多くの場合、各ゲームの新しいシステムを発明します）、重要な数字でいっぱいですが、プレイヤーにはわかりません。それらの多くは、選択ボタンを押してツールチップ/説明モードに入ることができます。
これは、モバイルでツールチップを必要とするほど複雑なアプリでうまく機能する可能性があり、現在目にすることができる唯一のパターンであり、一般的なux設計の範囲を大きく超えていません。
私の答えはおそらくそれほど実用的ではありませんが...
すべてのアプリが元に戻す機能をサポートし、人々は常にどんなアクションでも元に戻すことができることを知っていることに慣れていれば、問題は解決されます。
Andreasが言うように、「一部の機能がわからない場合は、ボタンをクリックするのをためらうでしょう」。
しかし、安全策として元に戻すと、「行う」ことが増え、「ためらう、心配する、タップする前に何が起こるかを見つける...タップする」ことが少なくなります。
これは、[戻る]ボタンが非常に人気がある理由の1つであり、Androidでさえ、オペレーティングシステム全体で使用されています。
残念ながら（ここでは非現実的です...）
- 信頼できるパーベイシブUNDOの構築は、ツールチップよりもはるかに困難です。
- すべてのユーザーの考え方を変えるために、十分な数のアプリがそれをサポートする必要があります（ha！）
ホバーツールチップは初心者にとって非常に役立ちます。初心者は常に遅く、カーソルの移動が安全ではないときにポップアップするため、それらを学ぶためのアクションは必要ありません。一方、パワーユーザーの速度を低下させないため、優れています。
タブレットの場合、疑問符のアイデアを取り上げますが、さらに複雑さを加えます。
1）疑問符をタップすると、「ヘルプ」モードに切り替わります。 2）次に、問題のコントロールをタップすると、ツールチップが表示されます。 3）次に同じコントロールをもう一度タップすると、ヘルプモードが終了し、コントロールが実行する必要のある処理が実行されます。 4）他のコントロールをタップすると、彼のツールチップが表示され、ヘルプモードがオンのままになります。 5）疑問符をもう一度タップすると、ヘルプモードを終了できます。
アインシュタインを言い換えると、タッチは必要なだけ単純でなければなりませんが、単純ではありません。
ここでの根本的な問題は、触覚ではなく状態です。触れたときの状態は？タッチはその状態を変更しますか？状態の変化はユーザーにどのように反映されますか？
設計の観点から、すべてのアクションをワンタッチで取り込もうとすることは、最も単純な場合にのみ機能します。さらに便利なアプリケーションでは、最初のタッチで状態が変化することがあります。その状態は、オブジェクトの画像の変化、ツールトップ（設定された時間の経過後に消える一時的なツールチップでさえ）、またはその他の手段によって反映されます。選択したオブジェクトに触れることは、選択していないオブジェクトに触れることとは異なる意味を持つはずです。これは、インターフェースの発見可能な側面である必要があります。