約1年前から、サイトのいくつかのセグメントでトグルボタンを使用しています。ユーザーインターフェースの一貫性を保つために、すべてのクリック可能なボタンに常に同じ青いボタンスタイルを使用しています。
しかし、私はこのボタンの直観性に偏執的になり、考えられる2つのトレインがあることに気づきました。
「オンが強調表示されているため、オンにする必要があります」
これがデフォルトの期待です。
「オンはクリック可能です。つまり、オンにするにはクリックする必要があります」
アクションを実行するには、通常、実行するアクションのラベルが付いた青いボタンをクリックします。
これは、2つの主要な懸念によって対処される概念につながりました。これにより、両方の状態にボタンの外観があるという事実が取り除かれ、青色のボタンが他のすべての用途と一致するようになりました。
次に、「オン」と「オフ」は非技術的なユーザーの観点からは意味がある可能性が高いと私に提案されました。ただし、「オフ」というラベルを付けることはアクションを表すものではないため、「オフにする」と「オンにする」という接頭辞をそれぞれ付ける必要があると思います。つまり、これらのフレーズの否定的な意味合いに気付くまでです。
だから私の質問は、ボタンに何を入れればいいのですか?
オン/オフの切り替えで標準になっているものから逸脱することで、この思考プロセス全体を後退しますか?
選択した以下の回答に加えて、多数の反復に基づいて、以下はこのユースケースで解決したものです。
主な問題は、アクションボタンの色が1つで、ステータスを明示的に示していないことです。色は非常に強力な視覚的インジケータであり、行動を促すフレーズよりもステータスにリンクしている可能性が高くなります。
トグルボタンがあいまいです。あなたはアップルスタイルのスライダーを使うことができます
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
またはあなたの家の色のボタンを持ついくつかの他の視覚的なインジケーター。
(モックアップでの最初の試み。わかりやすいと思います)
あいまいさを減らすために、次のことをお勧めします。
アクションをトグルボタンのテキストとして使用して、ボタンが強調表示されていないことを確認します。
マウスオーバー/フォーカスのアクションを強調表示します。
現在の状態を強調表示します。
例えば...
またはslidersと
例えば...
このようなオプションを使用して、オンオフボタンを単純な選択に置き換えることができます:
誰もがどのオプションが有効になっているかを理解し、誰もがそれを使用する方法を知っています。
ボタンに両方のステータスがあると、ユーザーが混乱する可能性があります。そのため、iOSのスライダーが適切に機能します。現在のステータスは明確で、ボタンのデザインにより、他のステータスに簡単に切り替えることができます。それらを現在のUI(タッチなど)に適合させ、ユーザーがスライダーをクリックまたはドラッグしてステータスを変更できるようにすることもできます。
また、ユーザーにとってオン/オフまたは有効/無効がより理にかなっているかどうかについて調査することも価値があります。オン/オフの方が確かに簡単ですが、有効/無効は、オプションにもう少し技術的な味を追加できます。これは、技術者以外のユーザーがセミテクニカル設定を調整している場合に役立ちます。それは彼らが彼らが本当に望んでいるものを調整していることを彼らが再確認するのを助けます。
例で示すメッセージとしてボタンにラベルを付ける場合、「技術者以外のユーザー」が懸念事項であるという話を聞いて驚いたのは次のとおりです。
「スロットでの自動ルーチンタスクのスケジューリングを有効にする」とメッセージの名前はChronです。
おそらく、あなたがこのメッセージを読むことを期待している人を明確にすることは価値があります。ダイアログを理解するのに十分な技術を持っている場合は、有効化/無効化を理解しています。それらが技術的ではなく、オン/オフを好む場合、おそらくダイアログメッセージは不十分です。
ボタンに関しては-
タッチスクリーン以外の設定では、スライダーを使用しないことをお勧めします。ユーザーはクリックするだけなのか、クリックしてドラッグするだけなのかわからないため、使いやすさは異なります。タッチスクリーンインターフェイスにはスライダーとの一貫した操作方法がありますが、非タッチスクリーンインターフェイスにはありません。
私の提案は、「自動化オフ」のような何かを示す単一の明示的なボタンを持ち、ボタンをクリックすると、「自動化オン」というテキストが付いたトグル状態に変化することです。トグルされた状態を視覚的にデザインする方法については、ボタンをインセットにしてください(非常に古いテープレコーダーの再生ボタンをクリックして、停止するとクリックして飛び出します)。
1つのボタンで明確な操作ができます。テキストは状態を明確に示します。ボタンの挿入図により、アクションではなく現在の状態を示していることが明確になります。