web-dev-qa-db-ja.com

複数項目選択を使用してネストされた選択リストを設計する方法

複数のレベルを同時に選択できる選択リストを設計しています。最大3レベルまで正常に動作します。

enter image description here

これは単なる例であり、場合によっては、このモデルは、さまざまなカテゴリでかなり深い入れ子(約10レベル)を持つことができる製品の選択に対応します。 3レベルを超えると、インデントとフォントサイズを使用してネストを管理するという考えは、無限に深くなる可能性があるため、ばかげているように見えます。

どんな考えや例でも大歓迎です。

1
Chris

興味深いデザインの問題。設計における大きな課題の1つは、特定の状況に適したユーザーインターフェイス要素を選択することです。

表示したユーザーインターフェース要素は、解決しようとしている問題には理想的ではありません。選択リストは基本的にフラットなリストであり、実行できるのはその内容を1つのレベルにグループ化することだけです。この単純な1レベルのグループ化を超えて実際にスケーリングすることはありません。

これを超えてグループ化する必要がある場合は、選択プロセスを再考することをお勧めします。結局のところ、ユーザーの主な目標は、システム内でどのようにグループ化または編成されているかに関係なく、単に選択することです。

選択する必要があるものを整理する他のはるかに優れた方法がありますが、3つ以上のレベルのグループ化を実現する単一のウィジェットを作成することは不可能です。

これを解決するには、いくつかの情報アーキテクチャ分析が役立ちます。

1
SteveD