テーブルヘッドのアイコン-推奨事項

Question

テキストではなくアイコンを使用する場合主題に関連する良い習慣はありますか？

例：

Alvaro · Accepted Answer

この質問で、テキストとアイコンをいつ使用するかについていくつかの回答を見ることができます。

私はすべてのテキストを使用します。アイコンは誰もが同じように常に理解できるわけではなく、一部はユーザーのコンテキストに依存します。

あなたのケースで私がアドバイスするのは、このメモで Google Material が言うことしてはいけないことです。

しないでください。

テキストラベルとアイコンを組み合わせないでください。すべてのテキストラベルまたはすべてのアイコンラベルを使用します。

編集：ここにいくつかの役立つ情報がありますアイコンの使用について：

多くの研究者が、アイコンは覚えるのが難しく、非常に非効率的であることが多いことを示しています。 Microsoft Outlookツールバーは良い例です。以前のアイコンのみのツールバーは使いやすさが不十分で、アイコンを変更したり、それらの位置を変更してもあまり役に立ちませんでした。役に立ったのは、アイコンの横にテキストラベルが導入されたことです。それはすぐにユーザビリティの問題を修正し、人々はツールバーを使い始めました。別の研究では、UIEのチームは、機能のグラフィックによる解釈ではなく、ボタンの位置を覚えていることに気付きました。

ほとんどのプロジェクトでは、アイコンを正しく設定するのが非常に難しく、多くのテストが必要です。抽象的なものでは、アイコンがうまく機能することはめったにありません。

UX Labs · Answer

私は3つの要素を考慮に入れます：

1。アイコン

アイコンはどのくらい明白ですか？それらは一般的に知られており、単一の目的で使用されていますか？またはあなた自身のアイコンを開発していますか？

2。ユーザー

ユーザーは「パワーユーザー」だと思いますか？それとも、平均的な技術的背景から来ているのですか？たぶん彼らのスキルは弱いですか？

3。使用法/コンテキスト

ユーザーはどのくらいの頻度でアプリケーションを使用しますか？

どのデバイスを使用していますか？

他の事実は重要ですか？

これらの質問に答えた後、さまざまなオプションを検討できます。

アイコンのみ

私のユーザーがパワーユーザーであり、アイコンが正しいことを100％確信していて、何かがうまくいかない可能性があることを期待している場合にのみ、このアプローチを採用します。

ツールチップ付きのアイコン

ツールチップへの投資はより安全なアプローチです。たとえば、ユーザーがマウスをアイコンの上に置くと、ツールチップが表示され、このフィールドが何であるかをユーザーに通知します。これにより、ユーザーにアイコンについて教えてくれるので、ユーザーがアプリケーションを継続的に使用する場合各アイコンが何であるかを学習します。

最も安全なのは：

テキスト付きのアイコン

私たちはテキストを使用していますが、アイコンによってそれを強化しています。私たちの脳はテキストよりもビジュアルを高速に処理できるため、参照してください https://www.quora.com/In-UIs-do-people-recognize-アイコンより高速な単語

それでも、テキストのコントラストを下げてあまり目立たないようにしたことに注意してください。アイコンだけを使用するほどきれいではありませんが、妥協する必要のあるデザインに何度も気づくでしょう。決定、そしてこれはそれらの1つですが、それでも私たちはそれを可能な限りクリーンにできる限り可能な限りクリーンにしようとしています。

これらが唯一の解決策であると主張していないことに注意してください。代わりに、あなたが持つ可能性のある原因と影響とは何か、そして可能な解決策は何かを説明してください。

設計方法を研究すればするほど、問題やユーザーのコンテキストを理解するほど、常により良い解決策を見つけることができます。

PS：マテリアルデザインで推奨されている、テキストとアイコンの両方を組み合わせない方法について言及している人もいます。本当の普遍的な経験則はありません。

これはGoogle Chromeです。マテリアルデザインを開発したのはGoogleだからです。ただし、場合によってはテキストやアイコンを使用しています。

Vijay · Answer

この場合はアイコンを使用しないでください。アイコンはさまざまな目的で使用されますが、主なアイデアは、ユーザーがすばやく理解できるようにすることです。私はあなたがconsistentルックアンドフィールを維持して、ユーザーがコンテンツを通過する間にユーザーのフローを壊さないようにする必要があると思います。アイコンの重要な使用例は次のとおりです。

ダッシュボードサイドバーナビゲーション、ここではアイコン（またはテキスト付きのアイコン）を使用できます。サイドバーが折りたたまれている場合でも、アイコンは特定のサイドバーアイテムを示すことができます。
日付、時刻、数値、検索、電子メール用の特別な入力テキストボックス。これは、ユーザーが入力として提供する必要があることを理解するのに役立ちます。
編集可能なテーブル内の追加、編集、削除、更新、保存のアクションボタン。これはスペースを削減するために行われます。
アコーディオンの折りたたみ/展開、閉じる、最小化、フルスクリーン、モーダルポップアップを閉じるなどのUI変更トリガーのアクションボタン.
ユーザーがナビゲーションを支援するためのヒントとしてのアイコン。「スクロールしてより多くのコンテンツを表示する」と書く代わりに、下矢印アイコン（必要に応じてアニメーション付き）を使用します。別のユースケースは、ウェブサイトの下部をスクロールすると、ウェブサイトの最初にジャンプするためのアイコンボタンです。