テーブル内のテーブル-テーブルの開始
ここで私が現在取り組んでいる小さなUXの問題があります。多くの調査を行った結果、良い例があまりないため、ここに投稿します。
コンテキスト：これは、管理スタッフ（スプレッドシートに非常に慣れている人々）を対象としたWebアプリと考えてください。テーブルがあり、行に応じて、行onClickを展開して、より詳細な情報を取得できると想定できます。
ただし、この特定の場合、展開された情報には、実際には親テーブルのデータと正確に相関しない新しいデータセットが含まれている必要があります。つまり、親テーブルと子テーブルの列のデータ型は違う。
これは、テーブル内のテーブルを見ていることを意味します。
今、私は次のようなさまざまなことを調査しています：
- 親テーブルとインラインにならないように子テーブルをインデントします。
- テーブルの背景の色合いを変更して、データ型のコントラストを強調します。
それでもまだ気分が悪い。リモートで許容できるように見える唯一のことはこれです：
質問：インターフェースの混乱を作成せずに問題を簡単かつ明確に解決する、さまざまなデータ型のネストしたテーブルのガイドラインまたは例はありますか？
データテーブルで同様の問題に取り組んでいるチームにいたとき、最終的に選択したオプションは、画面の右側に、完全な高さのオーバーレイ（引き出しと呼ばれます）を実際に使用することでした。そうすることで、展開されたデータに使用できるスペースが制限されなくなり、画面からコンテンツが押し出されたり、ユーザーにコンテキストが失われたりするなど、視覚的な問題が発生しなくなりました。また、オーバーレイがカバーする表のコンテンツが最も重要でないことを確認しました。ユーザー（データテーブルの処理に慣れた専門家）にとって、この概念は非常によくテストされています。
同様の代替案は、分割ビューです。行をクリックすると、元のテーブルが水平方向に縮小され、テーブルの右側に詳細ビューが開きます。
データテーブルの相互作用 の一般的な例をいくつか示します
上記の記事では、最終的に作成したオーバーレイは「クイックビュー」の概念に似ています。分割ビューのオプションは「詳細に行」と呼ばれますが、元のテーブルの情報の多くが削除されていると感じました。