チェックボックスをカスケードする代わりに良いものは何ですか？

Question

レポートを実行するためのWebインターフェイスがあります。レポートはかなり複雑になる可能性があります。レポートに含めることができるさまざまなトピックがあり、各トピックにはサブトピックがあります。

現在、インターフェースはチェックボックスのリストで実装されています。次のようになります。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

チェックボックスをオンにしてそのトピックを選択すると、サブトピックの親チェックボックスの下にさらにチェックボックスが表示されます。

^{bmmlソースをダウンロード}

チェックボックスを選択すると、他のすべてのチェックボックスが押し下げられて表示されなくなるため、これを再設計しようとしています。チェックボックスを折りたたみ可能にすることを検討しましたが、現在の実装の利点の1つは、選択したすべてのチェックボックスを表示できることです。チェックボックスが折りたたみ可能になると、選択されているすべてを表示することが難しくなります。代替案のための推奨事項はありますか？

Answer 1

最初は、ユーザーにメインチェックボックスのリストから選択させるだけです。ボックスを選択したら、選択を押してサブトピックを含むリストに移動できます。

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}

次に、ユーザーがメイントピックの選択を終了すると...

^{bmmlソースをダウンロード}

この設計は、両方の要件を満たします。

1. 同時に選択されたすべてのメイントピックを表示します。 （展開しないため、関心のあるすべてのものをすばやく選択できます。）
2. 彼らが選択したすべてのトピックを表示します。 （第2ステージでは、すべてのサブトピックが一緒にリストされるため、ユーザーはサブトピックを1つずつ表示するのではなく、選択したすべてを表示できます。）

Answer 2

2命題

最初の長さはテキストの長さとサブトピックの数に応じて機能しますが、選択したすべてのチェックボックスを表示できます

つまり、不要なものをチェックするのではなく、チェックを外します。

2番目はどのような場合でも機能しますが、透過性は低くなります

Answer 3

ユーザーが必要に応じてセクションを展開したり折りたたんだりできるファイルエクスプローラーの使用でかなり一般的になったアフォーダンスであるため、折りたたみ可能なチェックボックスの概念を採用します。

選択されているアイテムを表示する必要がある場合、以下に示すように、残りのアイテムを非表示にしているときにのみ選択されているアイテムを表示できます

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}