AppleとGoogleは、3つの水平バーのアイコンの意味を明確にするために、真正面から向き合っています。
IOSでは、このアイコンは「ドラッグしてリストの項目を並べ替える」を意味し、Google Chromeのバージョンは「クリックしてメニューを表示する」を意味します。
これら2つの意味の1つは、モバイル、Web、またはデスクトップソフトウェアですでに広く確立されていますか?また、このアイコンを使用している人気のあるアプリ(どのプラットフォームでも)と、それらのアプリでの意味は?
「リストの再注文」機能を備えたアプリを作成しているので(もちろん、標準のiOSアイコンを使用して!) 。これにより、どちらのバリアントがどれほど人気があるかを知りました。アイコンがiOS標準である場合でも、あまり使用されておらず、他のバリアントが非常に人気がある場合、準備したいユーザー教育の課題がいくつかあります。
こちらが最新のGoogle Chromeの写真です。
IOSから 設計ガイドライン :
サンプルiOSアプリから:
「リスト/メニューの表示」機能を示すために3つのバーアイコンが広く使用されています-Chromeだけではありません。以下はDay OneとPlaceMeのスクリーンショットです(私はいくつかのアプリを開くだけでこの使用例を見つけてください)。
アイコンはApple(後から見て))には不適切な選択だったと思います-明確なインタラクションキューを提供せず、再注文可能な状態インジケーターです。しかし、Appleは、このすべてのアプリの狂気が発生する前にこの選択をしました。
IOSでは、メニュー/リストインジケーターとしてのアイコンは1つのアイコンであり、「並べ替え可能な状態」は各リストアイテムの横にアイコンがあるため、混乱なく、両方の用途が共存できる可能性があります。
より良い選択は、「ドラッグ可能」アイコンに似たものに移動して再注文可能性を示し、3つのバーを「リスト/メニューの表示」機能の手がかりにして、牽引力を高めることです。
ドラッグアンドドロップでは、ほとんどの場合、アフォーダンスが悪い。
Gmailの現在のモデルは次のとおりです。
彼らが本当にそれについて真剣であるかどうかはわかりませんが、特に。ホバーされた要素にのみ表示されるため。
以前のものはこれでした:
もっと引きずっぽいが、それでも悪い。
ドラッグアンドドロップコントロールで適切なアフォーダンスに到達するには、明示的なアクション(上下の矢印、かなり明示的)であるか、「でこぼこ」(タッチスクリーンの場合)である必要があると思います:Appleバージョンは、何かをつかむためのものではなく、一種の空気抜き穴のように見えます。
ドラッグアンドドロップアフォーダンスは通常、ハードウェアスイッチとバッテリーカバーのふたから来ます。これは、これら3つの「線」が意味することです(それらは「receded」タイプ)。しかし、(Chromeと比較してが3行であるので)3行欠落した場合でも、ユーザーが理解することは期待できません...
以下は、「実生活」の例です。
電池のふたの突き出し( ここから )
点線のバッテリー蓋(- ここから )
後退するバッテリー蓋(- ここから )
ネイティブから抜け出すことを恐れない場合は、次の相互作用を作成することもできます。
矢印があるため、ユーザーはそれが何のためにあるのかをすぐに理解し(私はそう思います。これは単なるモックアップであり、まだユーザーテストはありません)、インターフェイスの探索の一部としてタップしようとします。あなたがそれを十分にうまくやれば、彼らは変位に気づき(おそらくタッチスタートから150-250ミリ秒の間に起こる場合)、それはタップの動きであることを理解します。
これは単なるヒントです。ノーマンの古典的な「The Design Of Everyday Things」はこれに役立つかもしれません。
長年にわたり、状況は多少変化しました。
Chromeは、マテリアルデザインHIGに準拠するために、メニューアイコンを縦に3つドットに変更しました。
Appleは、ドラッグアンドドロップアイコンをハンバーガーと視覚的に区別できるように変更しました。
ハンバーガーアイコンはまだ一貫して使用されていませんが(たとえば、FirefoxとGnomeはこれを汎用メニューアイコンとして使用しています)、MicrosoftとGoogleの両方がナビゲーションメニューに使用しています。 (Appleはこのアイコンをどこでも使用していないようです。)
Material および Fluent HIGの両方で、ナビゲーションドロワーの推奨で使用されているアイコンを確認できます。
三線のアイコンが何かを引く場所として確立されていることに同意します。 (特に、iOS画面の上部から下にドラッグして通知を表示した場合、または複数の通知が待機している場合のロック画面、またはロック画面のカメラアイコンに表示される、線の付いたタブを参照してください。)
そのアイコンをバッテリードア/スライド式のプラスチックウィジェットの実例に合わせるのは理にかなっています。 Google Chromeアイコンはその理由で私を混乱させます、そして私は常に「ギア」または同様の「設定」関連アイコンがそこでうまく機能するだろうと常に思っていました。