Iconiseガイド

アプリアイコンのデザインを比較して選ぶ方法

複数の小さいサイズと異なる背景で案を比べ、製品の意図を伝えるシルエットとコントラストを選びます。

案を同じ背景の上に並べ、64、32、16ピクセルで確認します。シルエット、視認性、コントラスト、違い、製品との関連性を見ます。ユーザーの反応を測ったように見える点数ではなく、定性的な所見を残しましょう。

公平に比較できる状態を作る

案ごとに所見を記録します。最後の列は理由のある判断であり、測定値ではありません。
基準	確認すること	記録する所見
視認性	16 pxでも中心となる形が見えますか？	細部が残る、融合する、消える。
シルエット	細部を隠しても案を見分けられますか？	特徴的な輪郭か、よくある形か。
コントラスト	明るい背景と暗い背景の両方でシンボルが分かれますか？	読める領域か、背景に溶け込む領域か。
違い	案は本当に異なる方向性を示していますか？	メタファーや形の違いか、仕上げだけの違いか。
製品との関連性	ブリーフの機能や対象ユーザーにつながっていますか？	つながりが明確、不確か、または見当たらない。

A〜CはIconise公開ギャラリーのイラストです。形を見るための例であり、プロンプト、順位、テスト結果を示すものではありません。

3つのイラストを小さくしたとき、Aの輪郭がBより分かりやすいと仮定します。その所見を記録し、Aがアプリの機能もよく伝えるかを確認します。Bの方が製品を説明できるなら、輪郭だけでは決まりません。これは考え方の例であり、SVGを実際にテストした結果や測定された好みではありません。

縮小プレビューだけでなく、アイコンが実際に表示される画面や背景でも確認します。OS、ストアのページ、ブラウザーではマスクやルールが異なります。評価が分かれる場合は2案を残し、同じ状況を見せて意見を聞きましょう。この小さな確認を代表性のあるユーザーテストとは呼びません。

サイズと形式のガイドでは、各用途と公式情報を確認できます。