web-dev-qa-db-ja.com

Webおよびモバイルでの迅速な時間入力のための設計

ユーザーがWebインターフェイスとモバイルインターフェイスでhh:mm時間を入力する最も効率的な方法は何ですか？この場合、ユーザーは1時間あたり40倍を超える時間を入力します。

コンテキスト：これは、スケジューリングとタスク追跡用です。マネージャーは、何百人もの従業員の週次スケジュールを作成します。彼らは従業員のために出入りの時間を入力します。タスクの追跡には、時間を伴う毎日のタスク完了と、期日/時間を伴う再割り当てが含まれます。

formsefficiencymobile-text-entryexpert-interface
3
stephenz

あなたはエキスパートインターフェースのユースケースを説明しています

  • エキスパートインターフェイスは、特定のタスクを効果的に実行するために特化されています。 UXは、直感性とトレードオフで生産性/精度/速度を優先します。

  • エキスパートインターフェイスの例である株式取引キーボードを次に示します。

    enter image description here

残念ながら、エキスパートインターフェイスは非常に特殊化されているためQ＆Aタイプのサイトにはあまり適していません。

さらに多くの情報を提供する必要があります（たとえば、学習能力を犠牲にして速度を優先しますか？データ入力用のカスタムタブレットまたはモバイルキーボードを開発する予算はありますか？）。

ここにいくつかのアプローチがあります（パフォーマンスとコストのトレードオフも示しています）...

デスクトップ

  • ユーザーにデスクトップにテンキーを用意し、テンキーを介してすべてのフィールドに入力できるようにする必要があります（スーパーマーケットのチェックアウトカウンターは、速度と正確さのためにこのアプローチを採用しています）。
    • 例えばを使用して時間を入力できるようにする  に 9 キー、 + キーはAM/PMを切り替え、 Enter 次のフィールドに移動します。
  • マスクされた入力 フィールドを使用して、ユーザーが:文字を入力する必要がないようにします。
  • ユーザーがEnterキーまたはTabキーを押すと自動的に次のフィールドに移動し、フィールドを:00（最も一般的な分の形式）にオートコンプリートします。
    • 次のようにボタンを再利用することもできます Tab 迅速な入力のために00、15、30、45を循環します。エキスパートインターフェイスの設計者は、速度を優先してデフォルトのキー動作を犠牲にすることがよくあります。
  • 12時間と24時間の両方の時間を受け入れます。 24時間の入力を午前/午後の12時間に自動変換します。

タブレット/モバイル

  • 上記のデスクトップアプローチのいくつかを使用し、さらに...
  • 入力を高速化するカスタムキーボードを開発します。次に例を示します。

keyboard

  • ドラッグアンドドロップですばやくコピーできるようにします。

    enter image description here

うまくいけば、これらの例は、考慮すべきコストと学習可能性の大きなトレードオフがあることを示しているため、予算/パフォーマンス/学習可能性の要件に適合するアプローチの組み合わせを決定できるのはあなただけです。

3
tohster

HTML type = "tel"を使用します。それについて読む ここ

アイデアは、このような設定をすることです_：_

したがって、キープレス/タッチの量は4になります。 12:45。スペースを節約し、それに一定の一貫性を持たせるために、常に24時間使用するようにしました。 @tohsterで述べたようなプリセットは、プレスを保存するためのボタンの：15、：30、：45のような優れたアイデアです。

プリセットについての注意：常に混合数を実行しているかどうかに大きく依存します。プリセットにUIスペースを使用しても意味がありません。

enter image description here

2
JW_

最初にワークフローを確認し、頻繁に入力するワークフローを排除できるかどうかを確認します。たとえば、多数のタスクがほぼ同時に入ってくる場合、それらをすべて同時にグループ化することは可能ですか？

時間の入力を簡単にするために他にできること

  • 彼らが入る予定の時間範囲を予測してみてください。その日に入力された平均時間がおよそ45分である場合、それをデフォルト値に設定します。午後にそれが15分に変わる場合は、デフォルトを変更します。あなたがそれを行うことができるものは何でも、彼らにとって少し簡単になります。
  • あなたがそれをうまく使うことができるなら、私はまた、事前に形成されたチャンクを使用します（つまり、15分間隔で入力するクリック数やデータが少なくなります。本当に時間を正確にする必要がありますか？

最後にあなたは彼らのための時間を得ることができませんか？ Time.Nowまたはapi呼び出し？その2015年は、時間関数を見つけるか、既存の関数を呼び出して時間を導き出す（またはモバイルデバイスにログ時間と言うボタンを配置する）ことができるため、イベントの時間を節約できるため、実際に入力する必要はありません。時間。

ただし、要するに1時間に40回時間を入力することで、このシステムにはより大きなUXの匂いがあるようです。

0
Frank Visaggio