blog

アイコンを塗りつぶすアイコンデザイン方法

ジャストエリアの部分は1列4〜5個、2列合計で8〜10個です。アイコンの数も1列5個が業界の限界です。これ以上アイコンが増えると、混雑してアイコンの認知度が下がってしまいます。 そのため、アイコンのデ...

Feb 29, 2020 · 2 min. read
シェア

APPインターフェイスの塗りつぶしアイコンは、一般的に機能分類の多くとして、より一般的であるか、または使用のこの部分のキングコングエリアへの機能的な入り口がほとんどです;

ダイヤモンドエリアは、重要な位置の先頭のページであり、ページのコア機能領域、宮殿グリッドエリアの複数行の配置のための表現の形式です;

ジャストエリアの部分は4~5個のアイコンが1列、合計2列で8~10個。アイコンは1列5個が現在の業界の限界でもあります。これ以上増えると、混雑してアイコンの認知度が下がります。

内容追加/後日、詳細メモに記入予定

1/ 期待に応えるために

アイコンの情報伝達、つまりアイコンの認識性を表現することが期待され、アイコンのデザインにおいてアイコンの認識性は常に第一です!

アイコンの形は、対応する機能とリンクしていなければならず、表現された意味は正確でなければなりません;

アイコンの色は、対応する機能ページの色と同じにします;

したがって、アイコンのデザインでは、最初に考慮すべき点は、グラフィックをどのように使用するかであり、このグラフィックの意味を明確に表現し、迅速に対応する情報を伝えることです。テクニックは達成するための唯一の手段であり、テクニックに目がくらむことはできません。同時に、アイコンの色の感情を考慮する必要があり、業界の属性に一致する必要があります;

2/ スタイル的にシンプルであること

脳が情報を認識するスピードは、複雑なアイコンよりもシンプルなアイコンの方が速くなります。したがって、塗りつぶしアイコンのデザインでは、特別な効果を追求するのでなければ、アイコンの認知度を確保しつつ、視覚的な美しさも確保できるよう、モデリングデザインをよりシンプルにすることができます。

3/ 明るい配色にすること

また、アイコンはグループに分散されることを考慮し、主要な機能を強調するために、色は比較的明るく設計する必要があります。しかし、彩度が高すぎてはいけません。彩度が高すぎると、アイコンが十分に洗練されていないように見え、高級感がありません。また、アイコンは5色以上であってはならず、カラーシステムを微調整することができます。

2/ アイコンの属性に従って適切な色()()を塗りつぶし、彩度は高すぎず、グレーすぎないようにします;

3 / アイコンの形状の詳細を調整するだけでなく、不透明度を介してアイコンのレベルを引っ張って、ここでは50%〜70%の不透明度がより適切です。

4/ 色が少し灰色だと感じたら、最終段階で色の値を調整し、最終的に細部を修正するか、装飾として突起を追加し、最終的にアイコン効果を得ることができます。



Read next

Vuexソースコード解析

最近、ふと思い立って、Vuexのソースコードを勉強してみました。 Vuexは、Vue.jsアプリケーション専用に開発された状態管理モデルとして、誰もがよく知っているはずです。そして、私たちは次のいくつかの質問の開発プロセスについて考えていませんでした:Vue.useのみプラグインを使用して、Vuexのために...

Feb 29, 2020 · 13 min read