多くの場合、Webサイトには、ユーザーがテーブルに表示される列を選択できる機能が含まれている場合があります。これが発生した場合、このアクションを視覚的に伝えるための最良の方法は何ですか?そのため、ユーザーはそれが可能であることを理解し、それを実行する方法を知っていますか?
私たちはこの機能を私たちのサイトに実装しようとしていますが、それを示す良い方法に途方に暮れています。 2つのアイコン(鉛筆とハンバーガー)が提案されていますが、どちらも非常に一般的であり、明確ではない場合があります。この機能がアイコンで示されていることは明らかではありません。
このアプローチに代わるものはありますか?
私は次のようなことをします:
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
これにより、ユーザーはすべての利用可能なオプションを確認し、表示を有効/無効にするための迅速なアクセスが可能になります。ボタンドロップダウンは、オプションが含まれていることを通知します(即時アクションをトリガーするのではなく)。
オプション:要素の表示に影響を与えるコントロールに使用される「目」アイコンを見てきました。これだけですべてを効果的に伝える単一のアイコンが見つかるとは思いませんが、 役立つテキストで使用 、それが何をするか、それをどのように使用するかが非常に明確になると思います。
ユーザーが実際にテーブルのコンテンツを編集できると考えるかもしれないので、「編集」アイコンや鉛筆は誤解を招く可能性があると思います。すべての列を表示するオプションと、選択した列を表示するオプションを表示するソリューションはどうですか?これが私の意味のデモです: http://gergeo.se/RWD-Table-Patterns/#demo すべての列が表示されている場合は、 [すべて表示]ボタンが選択されているように見えることがあります。一部だけが表示されている場合は、[表示]ボタンが選択されているように見せることができます。
これは、作業しているプラットフォームについて詳しく知らずに答えるのは難しいですが、私が作業しているプラットフォーム用に設計したものを、それが役立つことを期待して渡します。 「編集」鉛筆の使用に関するいくつかの提案を読みましたが、アイコンの背後にこれだけの機能を配置するのは難しいです。
とにかく、下の画像は、SaaS私が作業しているプラットフォームで要求している機能用に設計したアイコンオプションを示しています。私の状況では、サインインした後、ユーザーに注文のグリッド、検索パネル、定義済みフィルターのパネルを含むインターフェース。ユーザー固有の列レイアウト管理のために、この領域のツールバーに新しいボタンを追加しました。このボタンをクリックすると、ダイアログが開き、ユーザーはドラッグアンドドロップで列を構成して、レイアウトを追加、削除、または再配置できます。
ポイントは、私はツールバーに明確に理解できる視覚的なボタンを追加して、列のレイアウトが構成されているダイアログを開きます。
鉛筆はしばらくの間編集に関連付けられていますが、ほとんどのユーザーはこれを理解しています。別の選択肢はドロップダウンです。 Wordpress管理パネルは、ドロップダウンを使用して、表示するウィジェットをユーザーが選択できるようにし、ドロップダウン矢印をテーブルヘッドに追加し、テーブル列のチェックボックスのブロックをスライドアウトさせるか、固定します鉛筆を使用してクリックすると同じドロップダウンビューが表示されるので、ドロップダウンにより、ユーザーがテーブルコンテキストから切り離されることがなくなります。