web-dev-qa-db-ja.com

遅延状態変更付きトグルスイッチ

非常に人気のある答えに見られるように:
"トグルボタンに現在の状態またはそれが変化する状態を表示する必要がありますか?" 、トグルボタンを実装するための非常に優れたガイドラインがあります。

残念ながら、そのままのユースケースがあるようです。機械制御アプリケーションでは、次のアクションを実行することが非常に一般的です。

  • エンゲージ/エンゲージ
  • 前進/後退
  • 開閉

注:これらは形容詞と同じくらい簡単に表現できたかもしれません。

これは、油圧シリンダー、バルブ、またはドアを指している可能性があり、多くの場合、ヒューマンマシンインターフェース(HMI)は、これらの状態を切り替える機能をユーザーに提供します。 警告は、これらのアクションが完了するまでに時間がかかり、状態が変化するまでに遅延があることです。

ご想像のとおり、シンプルなトグルボタン:
Toggle Switch

これらのアプリケーションでは、次の問題が発生します。

  1. ドアがまだ開いていないか、油圧シリンダーがまだ後退していないため、瞬間的な状態変化は実際の状態と矛盾します。
  2. アプリケーションが自分のリクエストを処理しているかどうかがわからないため、状態変更が遅れるとユーザーが混乱する可能性があります。

効果的には、目的のワークフローには、最初のクリック/タップ、状態が変化している期間、最後に状態が変化したことの表示が含まれます。ただし、2つのボタンと進行状況バーを備えたUIは少し扱いに​​くく、多くのスペースを占めます。または、状態を示す色付きのボタンは直感的ではありません。一般的なコントロールパネルがどのように見えるかを検討します。

Delayed Toggle Buttons

図は4つのステップのプロセスを示しています。

  1. デバイスは格納された状態です(緑色で表示)。
  2. ユーザーが進むボタンを押します。
  3. デバイスの状態が変化しています(黄色で表示)。
  4. デバイスは拡張状態です(緑で示されます)。

コンパクトで直感的な(または明確な)ままで、「進行中」の状態をユーザーに公開する遅延状態変更用のトグルスイッチを作成するにはどうすればよいですか?

3
Nicholas Miller

私が取り組んでいるプロジェクトでまったく同じ問題に遭遇しました。

私の解決策は、クリックが効果的であったことをすぐに視覚的にフィードバックし、それでもまだ機能していることを示すことでした。

delayed switch status

6
maxathousand

最も簡単な解決策は、テキストまたはアイコンを使用してユーザーに伝えることです。

Toggle switch

複数のスイッチ。

enter image description here

3
Garik