このコンテンツには閲覧パスワードが必要です。
こちらは2022年2月10日に開催したWebセミナー「部長さんのためのアイコンづくり勉強会のアーカイブです。
動画アーカイブ（未編集）
https://www.dropbox.com/s/kw39yvuw5prw25q/zoom_0.mp4?dl=0
共有資料
こちらはセミナー内で使用した資料や画像などです。作成見本や見本を作るために使った画像などが入っているので、CANVAに載せてみたり練習したり自由に使ってみてくださいね。
https://www.dropbox.com/sh/u1sfszw94bpricf/AAA_9HhCTEEVAFcXNQ-mIi8Ja?dl=0
INDEX
まずはダイジェストをかいつまんで掲載しておきますので、ご参考にしてみてくださいね。さらに詳しいことを知りたい人は動画や共有資料をご覧になってください。
1. ENERGEIAの部活アイコンの仕様
2. 映えるアイコンデザインのコツ
3. 作り方
4. 質疑応答
1.ENERGEIAの部活アイコンの仕様
サイズ
300×300px
けど今後技術向上に合わせデバイスの解像度が上がるにつれて必要な解像度は上がる傾向が予想されるので、1000×1000pxくらいあったほうがいいでしょう。
※ちなみに、A3程度のパネルに印刷することを念頭にするならば、4000〜5000pxくらいあると安心。
形式
JPEG,PNG,GIF
CANVAでデザインを作ったあと、書き出しの時に選ぶ形式。JPEGがオススメ。
形状
角丸もしくは円形
モバイルでは丸く切り取られて表示される場合が多い。PCでは角丸で表示される。
2.映えるアイコンデザインのコツ
1.「あれも、これも」をやめる
1.文字数を少なく：最高でも15文字くらいまでにしておく。
2.色数を少なく：使用色は２〜3色くらいまでにしておく。（写真の場合は除く）
文字も色も情報としてカウントし、アイコンの情報量は少ないほど見やすくなることを覚えておきましょう。
例えば…
上の写真の例だと、
左側：30文字＋4色＋ハートの模様
中央：30文字＋4色
右側：11文字＋２色
右側のアイコンが一番情報量が少なくて見やすい。
2.オススメのレイアウト
センタ揃え
最も簡単で見やすいため、センターで揃えて画像の端にはあまり文字を置かないようにすると失敗が少ない。
注意
端や角の近くに重要なものを置かない。PCでは角丸に、モバイルでは円に切り取られて表示されるため、端や角の部分は表示されなくなるため。上の写真だと、黒いエリアに置いた文字は表示されなくなる。
3.オススメの色選び
使用するカラーを３色決める
１色目：背景色
２色目：文字やアイコンの色
３色目：アクセントの色
※アクセントの色はなくても良く、２色でもOK！
これは避けたい！ NGな色選び３選
NGその１：白の面積が多い
弱い印象になり存在感が消えてしまいがち。どうしても背景を白っぽくしたい場合は最低でも背景に薄めのグレーを敷く。
NGその２：原色を使ってしまっている
目がチカチカして見づらい。
NGその３：中間色の上に中間色の文字を置いている
これでは文字が目立たない。背景が中間色なら文字の色は白に近い明るい色が良い。
※参考：https://321web.link/color-scheme-design/
4.オススメの素材
素材集の素材(イラスト、アイコン、写真)を利用すると早くて綺麗なものができる。「絶対にオリジナルじゃないと気が済まない！」と言って素材になる写真を撮るのに時間をかけてしまい、部活が始められなければ本末転倒ですよね。
写真
ぱくたそ
「日本人のキャラクター性のある写真が欲しい！」ならココがいい。
ODAN
海外のオシャレな写真素材が欲しいならここ。たくさんある海外の素材サイトの中から欲しい写真が一発で検索できる。
写真AC
日本人や日本的な写真でクオリティが保たれた素材写真が揃っている。
イラスト&アイコン
イラストAC
イラスト入りのアイコンが作りたいならここのイラストがオススメ。オシャレな手描きのイラストから個性的な絵まで揃っていて、使い勝手が良い。
シルエットAC
シルエットのアイコン画像を探せるので、汎用的なものが欲しい時にはオススメ。
https://www.silhouette-ac.com/
ICOOON MONO
フラットなアイコン入りの画像を作りたいならここがオススメ。使いたいアイコンを好きな色に着色してダウンロードできるの！
ぬれよん
こちらもアイコンの色を好きに変えられる素材サイトです。イラストのクオリティにばらつきはあるものの、線と塗り両方の色が細かく変えられるなど、優秀な機能がついています。（すごい。）
5.オススメのデザインパターン５つ
1. 背景＋文字
2. 背景＋文字＋アイコン
3. 背景＋文字＋イラスト
4. 写真＋文字
5. 写真のみ
「1. 背景＋文字」が一番簡単。急ぎで部活を作りたいなら取り急ぎこれで用意しておき、活動が始まってから改めて作ってもいいでしょう。
3.作り方
1. CANVAにログインする。
2. 必要サイズのキャンバスを用意する。
3. 素材をレイアウトする。
文字、写真、イラスト、アイコンなど。
4. 画像の書き出しをする。
JPEGやPNGで書き出す。
※ 詳しい内容はアーカイブ動画をご覧ください。
4.質疑応答
※ 詳しい内容はアーカイブ動画をご覧ください。
