3つのメインステップの進行状況を表示し、次に各メインステップ内の4〜10のサブステップを表示するかなり複雑なウィザードを作成する必要があります。左側にサブステップを垂直に配置するのは理にかなっているように見えますが、メインステップの下の上部で水平に実行する必要があるという要件があります。どのステップも選択できないため、先にスキップしたり戻ったりすることはできません。ステップは、他の複数の小さな機能が発生する可能性がある個別の機能を構成します複数の写真をギャラリーに繰り返しアップロードする。
これを視覚的にどのように解決しますか?私が参照できる実用的な例はありますか?
UXの混乱に巻き込まれたUIデザイナーから事前に感謝します!
Material Design-Steppers をご覧ください。ステッパーを別のステッパーの中に組み合わせると混乱を招くため、お勧めできません。
ステッパー内にステッパーを埋め込んだり、1つのページで複数のステッパーを使用したりしないでください。
あなたが変更するオプションがないので、私がお勧めします:
同じステッパーですべてのステップを結合します。これは理解しやすいかもしれませんが、長くなる可能性があります。マテリアルデザインでは、ステップ数が長すぎる場合は、モバイルのプログレスバーを使用することをお勧めします。
各レベルで異なる種類のステップを使用します。プロセス全体またはその逆の進行状況バーを使用できます。
この問題は、パンくずリストを使用することで解決されました ドリブルリファレンス そして、モバイル上のGoogle写真には、パンくずリストにスライダーがありました。ただし、この方法で使用することは好ましくありません。最良の例は、Android設定>メニューがAndroidで現在の状態を表示することにより、さらに深く進み続けることです。