スペースをより有効に活用するために必要な設計/アイデア

Question

Webアプリケーションにはグリッドビューが1つあります。しかし、ご覧のように、グループとカテゴリはスペースを食い尽くしています。 そのようなレイアウトに良いアイデアはありますか？レイアウトを全面的に変更しても結構です。より良い代替案を検索しようとしましたが、見つかりませんでした。

Answer 1

カードのレイアウトも試してみるべきだと思います。例えば：

このレイアウトには複数の利点があります。

• クイックスキャンを支援します
  • カードはテーブルに比べてスキャンが簡単です。
• 小さな画面に簡単に適応します
  • この場合、カードは単一の列でスクロールするように整理できるため、表と比較してモバイル/小型のデバイスでうまく機能します。
• 編集/削除ボタンは、変更するアイテムの近くに配置されます
  • 元のバージョンでは、編集/ゴミ箱アイコンが少しあいまいであることに気づくでしょう。どのアイコンが編集または削除されるかは明確ではありません。一般的に、 アクション/ボタンは、それらが作用するものに近いはずです 。
• アイコンのクラスターを削除します
  • アイコンを複数の行に表示する必要はありません。カードを使用すると、カーソルを合わせると必要な場所に直接アイコンを表示（または強調）できます。

Answer 2

ツリー階層スタイルの編成を試すことができます。このようなもの ：

^{download bmml source – Wireframes created with Balsamiq Mockups}