「にじみ」のないアイコンの作り方

こんにちは。フェノメナエンターテインメント・デザインチームの新人、トウミヤです。

皆さんは「見やすいアイコンの条件」というと、どのような条件を思い浮かべるでしょうか。
「視認性の高い配色になっている」「画面のサイズに対して適切な大きさになっている」…これらももちろん重要な条件ですが、私は「にじんでおらず、はっきりしている」という条件も挙げられると考えています。

「にじみ」とは 

ここでは100%表示の時点で図形がクリアに見えておらず、少しぼやけている状態のことを指しています。
「にじみ」は画面全体を囲む線など、大きなデザインの場合は影響は少ないですが、アイコンなど小さなデザインの場合は影響は大きく、クオリティの高低に繋がります。
また、アイコンに「にじみ」が多いと、ユーザーにとってやや認識しづらいアイコンになってしまうので、UXの質に影響を及ぼすことも考えられます。

img1 左がにじんでいるアイコン、右がにじんでいないアイコン

 

では、「にじみ」のないアイコンはどのように作れるのか。
以下で私なりの手順を紹介します。

続きを読む