web-dev-qa-db-ja.com

編集可能なフィールドアイコンの配置?

添付ファイル(PDF)をアップロードするためのフォームがあります。それらをアップロードすると、添付ファイルの名前を変更したり、表示したり、削除したりできるセクションがあります(下の画像を参照)。

編集アイコンにユーザビリティの問題があるようです。表示ボタン、削除アイコン、添付ファイル名のコントラストが高いため、目立ちません。

私が思っているのは、編集アイコンを編集するアイコンのすぐ隣に配置するのか、または削除アイコンの隣に配置するのが良いのか(アクション可能な領域を作成するため)ですか?

そして、その選択をサポートするためにどのような客観的な推論がありますか?

enter image description here

4
Bill Martin

レイアウト内にいくつかの問題が発生している可能性がある領域がいくつかあります。

  1. 編集アクションと削除アクションの両方が異なる方法で配置されている
  2. あなたの編集ボタンは非常に淡く、見つけるのが難しい

これを修正するために、各添付ファイル項目に対して実行可能なアクションを明確に示すアクション領域を実装することをお勧めします。

enter image description here

この選択をサポートするには-

  • アクション領域は、タイトルとこれをサポートするおなじみのアイコンで、より明確になりました。
  • アイコンの色が非常に強くなり、ユーザーにとって読みやすくなります

お役に立てば幸いです。

6
stradled

編集と削除を近づける必要があることについて他の人に同意しません。私が理解しているように、編集は添付ファイル名のみです。削除は添付ファイル全体に対するものです。添付ファイル全体を編集するオプションはありません。そのため、削除アクションはアイテム全体を参照し、アイテムの名前編集アクションのように見えるべきではありません。編集アイコンを暗くすることをお勧めします。それだけです。最善の方法は、A/Bテストで両方の種類のソリューションを一緒に試し、どの編集がさらにクリックされるかを確認することです。ユーザー数が多い場合、A/Bテストがランダムである場合は、「編集」の割合を均等に配分する必要があります。

4
Yoav Moran

表示機能と編集機能はより近くになければなりません。添付ボタンは多くの不動産を占有します。免責事項はそれ自体でもかまいません。ゴミ箱アイコンはより明確です。

cleaner layout

2
Ballisticone

鉛筆の色を変えて、よりコントラストを強くします。青は大丈夫です。少し暗くすることで、Xと同様の視覚的な重みを持ちます。

鉛筆を十字にもっと近づけます。現在、ボタンはあちこちにあります。左、真ん中、右。次に編集を移動して削除すると、一種の変更バーが作成されます。

また、ビュー/詳細ボタン(V)を広くし、タイトルテキスト全体またはバー全体を大きくして、ボタンを大きくします。

(編集)基本的に、私が注意散漫になっている間にまたがったことは言った。

0
PixelSnader