絵心のないあなたでも簡単！素人にも描けるアイコン作成法

本記事は、Price Checkerを動かしている技術の使い方や同じようなツールを実装したい個人で開発者に向けての連載です。
TAG:Price Checkerを支える技術

アイコン作成は難しくない！

開発者って絵心ありませんよね？（・・よね？）、でもアプリケーション作ったりWEBサービス公開しようと思ったら何かしらのアイコンが必要になってきますよね。
私ももちろん絵心なんてありません、子供にアンパンマンの絵を書いて喜んでもらえるのが関の山、恐竜書いてなんていわれたらよくわからない生物の絵が出来上がります。
そんな私でもこんなアイコンなら作れます。

作成に使うソフトは、無料のinkscapeがオススメ！

inkscapeはいわゆるdraw系のおえかきソフトです。draw系とは○とか△とか□とかを組み合わせて絵を描く方法のことです。
photoshop、gimpはピクセル系のおえかきソフトです。illustrator(イラストレータ)と違い無料で利用可能です。

アイコンは絵じゃなくて図形や記号のくみあわせです。

きれいな絵を描こうとか、凝ったものにしようとするとまったくアイコンを書くことはできません。
巷のアイコンをよく見てみると分かるのですが、最近のアイコンは□とか○などの図形のくみあわせで出来ています。

youtube,pocketのアイコン

図形をポンッとおいて色をぬって重なるだけならできそうじゃありませんか？

コンセプトを決めて、中心になる図柄を決める。

それではアイコンを描くためのポイントです
まず簡単なイメージがなければはじまりません、まずはあなたが作るソフトウェアが何をするものなのかを中心にキーワードを挙げてみましょう。
私の作ったandroid用アプリのAudioReplayの場合、

• 音楽ファイルを再生
• 再生途中からのレジューム機能がメイン

といったところから

• プレーヤーだから再生マーク（三角のやつ）！
• レジューム機能を表すには、シークバーが途中になっている感じのやつ！

と決めました。

chromeの拡張機能やandroidアプリのPrice Checkerの場合、

• 検索する
• 金額を比較する

から

• 検索なら虫眼鏡！
• 価格は￥マークだ！
  
  となります。

なぁんだ、よくあるやつじゃんと思ったあなた、そのとおりです。アイコンはよくある記号ものを組み合わせて作ればわかりやすく、しかも作りやすくなります。

実際の作り方は次回で～