データテーブルの階層とその使いやすさの例
誰かが何らかの形の階層も示すデータテーブルUIのデザイン/パターンに出くわしましたか？私はExcelに似た例を考えていますが、多くのデザインは情報をよりフラットでシンプルな方法で表示する傾向があるため、Webアプリケーションではなく従来のデスクトップアプリケーションで普及しているため、Webアプリケーションまたはモバイルアプリで使用されています。
データテーブルを使用して、従来のツリービューやアコーディオンUIコンポーネントと比較して階層情報を表示することについて、明確なユーザビリティの問題/懸念事項はありますか？
それがより頻繁に使用されるのを妨げる技術的な制約もありますか？
ExtJsツールキットはこれらの2つを提供します。あなたはそれらを実際に見ることができます ここ 。
それ以外は実装が簡単ではないため、多くのツールキットの一部ではないため、技術的な制約はありません。
TreeGrid
これは本質的に追加の列を持つツリーです。
親と子がすべて同じタイプの場合に適しています。
グリッド上のグループ機能
これは、2つのレベルの深さの関係（カテゴリ->アイテムなど）がある場合に適しています。
あなたが探しているのはツリーテーブルパターンだと思います http://quince.infragistics.com/Patterns/Tree-Table.aspx
ツリーテーブルの利点は、要素の階層に加えて、テーブルと同じ情報を表示できることです。通常、ツリーテーブルを使用するなどの技術的なバックグラウンドを持つユーザーは、ツリーまたはテーブルだけの場合よりも可視性が高くなります。
これは、デスクトップアプリケーションではWebよりも明らかに一般的です。
Treesheetsと呼ばれるアプリケーションがあります。それは美しくなく、プレゼンテーションをWebで1対1で使用することはできませんが、それをいじくり回して時間を費やすと、そのために特別に設計されたUIでそのようなデータを操作するのと同じように感じられるでしょう。 （不格好なExcelソリューションとは対照的に）および問題の場所。ユーザーが効率的に使用を開始する前に、非常に短いチュートリアル（最初は10分または15分かかった）を実行する必要があるため、編集を許可する場合は、いくつかの簡略化が必要になることに注意してください。チュートリアルでは、新しい階層レベルをナビゲートして作成したり、以前の階層レベルを削除したりするためのショートカットがほとんどカバーされているため、編集しない方がはるかに簡単です。
一方で、これは、書き始める前に構造がわからない情報を書き留めるための非常に便利なアプリケーションでもあります（たとえば、メモを取るか、アウトラインを最初から作成するなど）。
私が見たユーザビリティの懸念は次のとおりです。
- excelのようなグループ化での直接操作の欠如（Excelはデフォルトでグループの下にヘッダーを作成しますが、概要のようですが、問題外です）
![enter image description here]()
- 一部のユーザーにとって、ヘッダーと
+ボタンの関係は、かなり離れているため、わかりにくい
コンテンツと機能が1か所にあるため、ツリービューとアコーディオンは直接操作コントロールです。コンテンツの近くにある三角形または+記号は、その対話性の手がかりです。