ステップベースのナビゲーションワークフローの適切なホバー状態がどうあるべきかを理解するのに困惑しています。
ナビゲーションは下に表示されます。 3つの状態があります。完了、アクティブ、まだ完了していません。ユーザーは、テキスト/アイコンをクリックして、完了したステップのいずれかに戻ることができます(下のスクリーンショットを参照)。
アクティブな状態とまだ完了していない状態はクリックできないので、ユーザーに伝えるのは難しいと感じています。
これを行う簡単な方法はありますか?ユーザーが完了したステップにカーソルを合わせると、カーソルが手のアイコンに変わるのと同じくらい簡単ですか?もしそうなら、彼らはこれが可能であることをどうやって知るのでしょうか?
私がこの種の決定に直面したとき、私はしばしば適切な古い戦術に依存します、それがクリック可能であることを示すために円の下のテキストに下線を引きます。 @msanfordが述べたように、タッチユーザーはホバー効果を見ることができないため、この視覚的な手掛かりはタッチユーザーにも有効です。
戻るオプションが表示されているように、ユーザーが最初のステップを完了すると、「前のステップを変更するにはここをクリックしてください」の行に沿ってチャット/テキストの吹き出しを表示するだけで済みます。このバブルは、もちろん、ユーザーのデバイスに基づいて適切なサイズ、位置、設計にする必要があります。これは、注意を引くのに十分な時間だけ表示されますが、いつまでもそこにとどまったり、邪魔をしたりしないでください。
お役に立てば幸いです。
ユーザーはフォームを送信して、どのようにInstructions
からTarget Candidate Profile
に進みますか? ウィザードのようなパターン を何らかの[次へ]または[続行]ボタンで実装したと思います。
彼らにステップストロップを使用させたい場合は、写真のステップストリップボタンに affordance を与える必要があります。
これにより、ウィザードを操作する方法はステップストリップのボタンを使用することがかなり明確にユーザーに示されます。既に完了したボタンに同じアフォーダンスを与えれば、ボタンをクリックすることで有効なステップに移動できることをユーザーに示しただけです。
これを手っ取り早く当てると、チェックマークをホバーすると、編集記号(鉛筆で書かれた文書)または戻る矢印に変わり、戻ることができることを示します。