ショッピングカートのデザインに取り組んでいます。
私は現在、「X」を使用して、インターフェースの「閉じる」と「削除」の両方を意味しています。以下のスクリーンショットに示すように。
これは不必要な混乱を引き起こしますか?
「削除」という単語を象徴するものを探しているなら、「削除」という単語を使用しないのはなぜですか?
それは特に大きな言葉ではありません。そのUIには、それに収まる十分なスペースがあります。さらに、それが何を意味するかについてのあいまいさを取り除きます。
他のいくつかのオプション:
言葉を使うときは注意が必要です。 Wordを国際化すると、意図したよりも多くの文字を含む同等のWordになる可能性があります。グラフィックを使用する場合は、言語に依存せず、文字に依存しません(つまり、空間的には既知であることを意味します)が、文化やその他の要因に基づく考慮事項はまだあります。
例子供のサイトでデジタルミュージックプレーヤーを表現したい場合、90年代のポータブルCDプレーヤーのように見える記号を使用すると、多くの子供がグラフィックを下線機能に関連付けません。
疑問がある場合は、既存のメンタルモデルを推進しているアプリケーションに目を向けてください...
Amazonを検討(Wordの削除を使用)
ウォルマートを検討(Wordの削除を使用)
AmazonやWalmartと同様のデザインを実装した場合、Amazon/Walmartカートを使いこなせる人なら誰でも、電子カートの動作に関する既存のメンタルモデルに基づいてカートを使用できると想定しても安全です。
丸(-)で囲まれたマイナス記号の使用をお勧めします。テキストの長さの問題を軽減すると同時に、「削除」機能を暗示する必要があります。
これは簡単にテストできます。 +追加、-削除、xに同意します。ツールチップを使用して、シンボルラベルとWordラベルを組み合わせることができます。両方をモックアップして、約5人のユーザーの前に置き、フィードバックをもらいます。
あるいは、ユーザーがQtyを0に設定できるようにすることもできます。サーバーへのトリップが行われるタイミングと、ユーザーが更新を表示するタイミングによって異なります。
全体として、アプリの規則/スタイルに従ってください。ユーザーはシステムと対話する方法を学びます。一貫性は非常に役立ちます。
削除行のXまたはエラー行のXで同じ問題が発生しました。
しかし今では、アプリ、タブレット、スマートフォン、フラットアイコンで、削除アクションに単純なゴミ箱を使用する可能性があります。
ショッピングカートのコンテキストでcloseおよびremoveの意味について考えると、カートアイテムのbehalvは次のように考えることができます。
それらの両方は、アイテムがカートにもうないという事実につながっています。したがって、ショッピングカートアイテムを閉じるという意味は、ショッピングカートからアイテムを削除することとほぼ同じです。
したがって、両方に「X」を使用して、ショッピングカートを閉じ、ショッピングカートアイテムを閉じることは、まったく問題ありません。
私は...するだろう
私にとっては、特に「削除」アイコンが上と右の境界線と同じ間隔になっているため、非常に混乱しているように見えます。おそらく、それをコンボボックスに少し近づけて、少し縮小して、別の色(たとえば、赤)にすることは役立つでしょう。
アイコンの使い方は素晴らしいです。アイコンの意味がわかる限り。
x
でマークしても問題ありませんが、アイテムごとにx
をアイテムに「属している」ように見せます。現在のところ、それは一種の宇宙空間での座り込みです。 x
を含めて、アイテム行全体を囲むボックスを描画して、それらが一緒に表示されることを示すことができます。
-
なしで+
を使用しないでください:言及したコメントのように、-
は「このアイテムの数量を1つ減らす」と簡単に解釈できるため、アイデアを実行してください。数量ごとに上下ボタンを配置し、数量がゼロの場合(重要)に、これはこのアイテムをゼロで注文することを意味する明確なフィードバックを提供します。
一方、「マークされた数量に関係なく、このラインアイテム全体を削除する」と解釈できます。その場合、* +
を提供する必要がありますが、+
は「別のラインアイテムを追加する」ことを示す必要があります。
これらの非常に異なる解釈のため、このペアから離れて、代わりに言葉を支持することをお勧めします。
私の経験則では、アイコンを提供しますonlyそれらが大多数のユーザーに明確さを追加する場合でさえ、それに頼らないonlyアイコン上。アイコンのシンボリズムが失敗した場合に、マウスオーバーテキストまたは字幕などの代替機能を提供します。
Xを削除するのではなく、単にclose xを大きくすることをお勧めします。もう1つのことは、マウスオーバー時にxの上部に「閉じる」を追加し、カートアイテムのマウスオーバー時に「削除」を使用して同じことを行うことです。セクションを定義するための行がすでにあり、これにより、現在の配置で発生する可能性のある混乱が軽減されます。
2つの異なるアクションで同じシンボルを維持することは、疑わしいUIプラクティスです。ユーザーが2つの異なる「X」記号を関連として関連付けるため、それらに異なる視覚的処理を与えると、問題は部分的にしか解決されません(既存の画像と比較してオブジェクトを認識する傾向があるため)。推奨事項として、カートからの商品の削除にはマイナス記号(-)を使用することをお勧めします。それは私たちの初等教育から私たちに直接教えられたので、それはいくつかのエンティティを「削除する」場合に最も簡単に認識できます。また、項目を追加するための(+)記号と削除するための(-)記号を使用して、定数設計言語を設定できます。