web-dev-qa-db-ja.com

機能のアイコンをどのように作成または選択しますか?

機能に必要なアイコンの種類または画像をどのようにして見つけますか?

「機能Xに適したアイコンは何ですか?」という形で、非常に小さな質問がたくさんあります。

代わりに、アイコンの作成またはブレインストーミングの一般的なガイドを探しているはずです。これは、多くの状況やアプリケーションに適用できます。

これはおそらく、中間ステップを調べることで実行できます。

機能/セマンティクス

  1. この機能を表す用語
  2. その用語のアイコン

例えば。

クライアントの怒りのレベル

  1. ヒートマップ
  2. ヒートマップのアイコン

この質問は、機能に適用される可能性のあるアイコンのリスト、アイデア、またはリソースを作成するために使用するステップ1に関するものです。

31
Jeroen

私は通常、用語/アイデアに到達するためにブレーンストーミング手法を使用します。このようなプロセスの一例は次のとおりです。

  1. 大きな紙を見つけます。 3列を描く
  2. 最初の列:自由な関連付けを使用して、元の概念について考えるときに頭に浮かぶ単語のリストを作成します。判断せずに生成することに心を決め、限られた時間内にできるだけ多くの単語を生成するように目標を設定します。割り当てられた時間がなくなると停止します。
  3. 2列目:元の列の単語ごとに反意語をリストします。まだ審査なし!
  4. 紙を折り、最初の列を非表示にします。
  5. 休憩する。誰かと話してください。
  6. 3列目:2列目のみを見て、すべてのエントリの反意語をリストします。

非常に限られた時間の中で、元の概念に何らかの形で関連する単語の長いリストが作成されました。選択するときに3列すべてを考慮してください

注:このプロセスは、グループで実行するとさらに効果的です。各参加者はステップ1と2を個別に実行します。次に、ステップ3と4を実行する次の人に全員が紙を渡します。ステップ6を実行する前にもう一度ペーパーを渡します。最終的に、すべてのリストが必要な人に渡されます用語入力

36
katDNA

認識できるアイコンを作成することは、おしりに最高の王の苦痛です。一貫してまともなアイコンを生成するために従うべき分析プロセスはありません。あなたが持っているのは、通常のスタイルガイドからの漠然としたガイドラインです(たとえば、 Windows および Mac )。これは、セマンティクスよりもアイコンのグラフィックスタイルをカバーしています。

私の経験では、すぐにわかるアイコンが思い浮かばない場合、ユーザーにとって自然に直感的なアイコンはありません。つまり、非常に効果的なアイコンは、誰もが記憶している標準のアイコン(フロッピーディスクなどは保存を意味します)、および物理オブジェクトと属性に密接に関連する概念のアイコン(たとえば、プリンターのイメージはプリンターのプロパティや「この赤に色を付ける」ことを意味する赤い長方形)。それ以外の場合は、十分な調査とテストを行った後でも、思いつくアイコンは、せいぜい平凡なパフォーマンスしか発揮しないでしょう。

UIのほとんどの場合、アイコンを使用してテキストラベルの内容を補強し、それ自体ではプライマリラベルとして機能しないようにするのが最善です。漠然とコンセプトに関連付けられているアイコン画像に満足してください。アイコンの最大の潜在的なユーザビリティの利点は、経験豊富なユーザーがアクションまたはオブジェクトをより迅速に認識できるようにすることです。このためには、意味のあるアイコンよりも区別できるアイコンを使用する方が重要です。つまり、正しいアイコンは、表示される他のアイコンによって異なります。たとえば、Print Documentのアイコンも必要な場合、Printer Propertiesのプリンターアイコンは問題になります。通常、「機能Xに適したアイコン」はありません。

経験の浅いユーザーのために認識可能な意味を持つアイコンを作成する必要がある場合は、ユーザーに対してそれらを繰り返しテストする必要があります。ほとんどの場合、このようなWebサイトにアクセスして、「機能Xに適したアイコンは何ですか?」投票数が最も多いものを選択します(1つの回答に実際のテストがある場合を除きます)。代わりに、さまざまなソースから提案されたアイコンの束を取り、それらをすべて体系的にテストします。一緒に表示される他のアイコンのコンテキストでそれぞれをテストします。アイコンの意味を認識することと、アイコンが何であるかを認識することの両方をテストします。絵を正しくするために、いくつかのアイコンデザインを何度も繰り返す準備をしてください。

そして私はあなたをうらやましくない。

11

私はこの質問に対する私の現在の回答から始めたいと思いますが、これはしばしば不十分です(これが私がここで質問した理由です:D)。

このマッピングに使用する2つのリソースがあります。

  1. アイコンパックの検索機能( IconExperience
  2. WikiMedia を検索してアイデアを取得します
1
Jeroen

さて、私は使用します

アイデアを得て、私が探しているものを表す一般的な用語があるかどうかを確認します。

私たちのソフトウェアに適切なアイコンが見つかるまで、これを数回繰り返します。

0