web-dev-qa-db-ja.com

マトリックスUIの簡素化

チェックボックスグリッドUI(下の画像の左側に表示)を簡略化するための提案が必要です。アイテムの数が多いため(100から240まで変化します)、スケーリングできないためです。

2列のアプローチ(画像の右側)を使用する予定でしたが、ここでの唯一の問題は、ユーザーが個々のアイテムを選択してその接続を表示する必要があることです。ユーザーのフィードバックに従って、UIは接続を簡単にチェックするために使いやすさを向上させる必要があります。

別の解決策があるかどうか、私に知らせてください。

enter image description here

1
symbiote_sam

ご提供いただいた情報から、簡単なワイヤーフレームを作成しました。

しかし、これはユーザーが探しているものを知っているという条件に基づいています。そのため、表示して比較する必要のあるアイテムを選択するだけで済みます。

上の例では、Aと他の関係(ヌルの関係を含む)をすべて見ることができます。下の例では、nullのものが除外されます。

実際に実行しているUIの性質によって異なります...

enter image description here

1
Jermaine

タスクの視覚化としてグラフを見てください。私はいくつかのプロジェクトでそのようなテクノロジーを使用しましたが、うまくいきました。

例として、このリンク サンプルグラフ を参照してください。これを操作して、アイテムまたはアイテムグループから単一の要素をフィルタリングしたり、検索を実装したりすることができます。また、スケーリングも適切です。

0
Serg