スタイリッシュなアイコンの作り方
何か重要なことを伝えるのであれば、長い文で説明するよりも、アイコンで示したほうが一目瞭然ですぐに相手に伝わります。特に「かっこいい！」と記憶に残るアイコンがあれば、デザインは一層輝きを増すことでしょう。
Adobe Illustratorなら、ロゴデザインはもちろん、Webサイト、アプリ、グラフィックといった様々な用途に向けたアイコンを作れます。
素敵なアイコンセットをデザインするには
Adobe Illustratorの豊富な機能を活用すれば、素敵なアイコンをデザインできます。同時に複数のアイコンを作って、オリジナルのアイコンセットを作っても良いでしょう。
アイコンのアイディアスケッチから始める
まずはラフなアイデアを紙にスケッチしてから、スキャンしてAdobe Illustratorに「配置」で取り込みます。
また、スマートフォンやiPadでスケッチしてから取り込むのもよいでしょう。
アイコンのスケッチをもとにベクターを描く
Adobe Illustratorの「楕円形」ツールや「長方形」ツールを使って、基本的な形からアイコンを作っていきます。
スマートガイドをオンにすると、余白や位置などの目安になるので、より正確な描写を効率よくおこなう助けになります。
アイコンのデザインを調整する
アイコンのセットには統一感が大切です。角の丸みの数値は「コーナーウィジェット」を使って統一していきましょう。ほかにもサイズを「変形」パネル、線の幅を「線」パネルで同じ数値に調整すると、統一感のあるアイコンセットになります。
色や奥行き感を追加
「塗り」を設定してアイコンに色をつけるとさらにバラエティーに富んだ仕上がりになります。グラデーションや透明、描画モードを調整して奥行き感を演出すれば、オリジナリティーのある自分だけのアイコンが出来上がります。
アイデアスケッチを元にアイコンをデザインする
アイコンが完成したら「配置」や「書き出し」で活用しましょう。
手描きのラフを取り込む
スケッチブックやスマートフォンで描いたアイデアスケッチを取り込んで、最初のレイヤーに「配置」します。
デザインを作成する
新しいレイヤーを追加して、「楕円形」「長方形」ツールや「ペン」ツールを使ってスケッチをなぞっていきます。
細部を統一する
角の大きさ、オブジェクトの大きさや余白の関係など、アイコンとしてのルールづけが統一できているかを確認しながら調整していきます。
色や線をつける
色や線をつけることで、さまざまな印象が生まれます。グラデーションや透明効果なども効果的な演出のひとつになります。
Webや印刷向けにデータを用意する
印刷で使用する場合は、別の印刷向けデザインのドキュメントに配置してアイコンを活用します。Webの場合は「アセットの書き出し」などを使ってデータをSVGやPNGで書き出します。
次のチュートリアルを参考にして、アイコンのデザインを始めましょう
プロフェッショナルなアイコンを作るには、まず基本的なシェイプから始めましょう。プロが伝えるヒントとチュートリアルには、役立つ情報が豊富にあります。
