Illustratorで簡単なイラストが描きたい話

スタッフブログ

皆さんこんにちは、デザイナーの宮脇です。

あっという間に4月になりましたね。3月はやりたかったゲームが発売、配信されたので毎日仕事との両立で忙しかったです。ついつい時間を忘れてしまいますね。当分の間は仕事とやりたいことの両立で忙しそうです。

さて前回は、サイトと名刺で使用されているイラストについてでしたが、今回もイラストについてです。私は、手でイラストを描くのは好きなのですが、Illustratorでイラストを描くのはとても苦手で時間がかかります。前回の記事でも書いていますが、Illustratorで凝ったイラストが描けません。

ですが、仕事では「装飾のためにイラストを作って」といわれます。確かに、文章は読まないと内容を理解できないので、イラストで表現した方が分かりやすい時やすっきりと見えるときもありますよね。webサイトなんかはこういった事が多いのかなと思います。時間がかかるけど、やるしかないか~と思い頑張って制作しました。今回はそのイラストのメイキングを描いていこうかなと思います。全部は紹介できないので、いくつかピックアップして紹介していきます。絶対にこうしたほうがいいというわけではありませんので、参考程度に見てください。

開いているノートのイラスト


1つ目はノートです。ノートは閉じているものと開いているものを制作しました。閉じているものは本当に簡単にできるので、開いているノートの作り方を紹介します。割と使うのに作ろうとしたら面倒ですよね。


初めに長方形ツールで四角を作ります。その次に「効果」→「ワープ」から「アーチ」を選んでお好みの数値に設定します。


設定し終えたら、四角を隣にコピぺします。あとはお好みなのですが、ダイレクト選択ツールで2つの四角の上4つのアンカーを選択し、少し拡大すれば開いているノートの完成です。あとはお好みで「オブジェクト」→「アピアランスを分割」を適応すれば、四角に効果をかけているのではなく、ノートの形として扱うこともできます。

くまちゃんのイラスト


2つ目はくまちゃんのイラストです。顔だけなら簡単に作れるのですが、体もとなるとバランスが難しいなと思う人も多いのではないでしょうか。今回作ったくまちゃんは、顔の形もただの丸ではないのでいいなと思ったら参考にしてみてください。


初めに正円と横長の丸を作って、横長の丸を正円の下に配置します。これは顔の輪郭になる部分です。あとから編集できるように、WindowsならAltを押しながら「パスファインダー」の「合体」を適応します。あとから編集しなくてもいいやという方は、そのまま合体して大丈夫です。


次に鼻を作ります。今回、口は作らないのでいる人は追加してください。初めに楕円を作り、輪郭の下に置きます。その次に平べったい三角を作り、「効果」→「スタイライズ」から「角を丸くする」を選びます。数値は適当ですので、自分のお好みに設定してください。この2つのオブジェクトは輪郭の中心に置いてください。


次に目と耳を作ります。「楕円形ツール」を使い、小さめの正円を作ります。先ほど作った鼻より上に配置します。次に耳となる部分です。正円を作り、コピペでもう一つ小さめの円を作ります。「はさみツール」で輪郭と重なっている部分を切り、消します。


あとは耳と目を選び「リフレクトツール」でコピーすれば顔の完成です。

丸いリボンの書き方


最後に体です。輪郭のすぐ下に小さい四角を作ります。その隣にパスでリボンを書きます。ツールは使いませんので、気合で描いてください。片方出来たら「リフレクトツール」でコピーすればリボンの完成です。


あとは、下のほうに足となる正円を作り、輪郭から下の部分を腕で埋めます。その2つのオブジェクトを「リフレクトツール」でコピーし、足と足の間をパスで埋めれば完成です。目と鼻以外に、塗りを入れることで線も気にならなくなると思います。気になる部分がある方は調整してください。

簡単なリボンの描き方


リボンをパスで描くのが難しいという方は、先ほど作った小さな四角を隣にコピーし、長方形にして外側のアンカー2つを選択、「拡大・縮小ツール」で大きくします。あとはパスで三角を書き、「リフレクトツール」でコピーすれば完成です。

子供のイラスト(上半身)


3つ目は意外と使うけど、作るのが大変な子供のイラストを紹介します。輪郭の作り方は、くまちゃんのイラストと同じなので省きます。


輪郭に小さな正円を作り置きます。鼻部分になります。その下に楕円を作り、上半分を消し形を整えて口を書きます。今回はかわいく描きたいので、おでこを広めにとり、目の位置は低めにします。同じ位置にしたいので「楕円形ツール」で目を描いたら「リフレクトツール」でコピーします。


耳をつけたい人は小さな丸を作り、半分消します。あとは輪郭に合わせて「ダイレクト選択ツール」で形を整えたらできます。これで顔部分は完成です。


顔部分ができると、髪形や服装を変えるだけで赤ちゃんから子供までいろいろ作れます。顔は変更しないので、統一感あるデザインになり使いやすいかなと思います。今回は付けませんでしたが女の子はまつげを付けると可愛いですし、性別が分かりやすくなると思います。

Illustratorでイラストも描けるように

こんな感じで、Illustratorで絵が描けなくてもツールをフル活用すれば、何とか簡単なイラストは描くことができます。(時間はかかりますが……。)もちろん、手描きのイラストが描けない人でもIllustratorを使えば描けるので、時間に余裕がある方は練習と思って、自分で描いてみてはいかがでしょうか。

ちなみにくまちゃんのイラストは15分ほどかかりました。手描きで描けばおそらく5分もかからないので、大分かかりましたね。悩みながら制作したのも原因でしょうね。ただIllustratorで、イラストを描けば左右対称が作りやすかったり、線や形がきれいというメリットもあります。イラストはどの場面でも使う機会が多いので、サイトに合ったテイストで、早く描けるようになりたいですね。まずはツールを使いこなすところからですね。

それではまた、次の記事でお会いしましょう。