誰かに見てもらうための、簡単なデザイン

Illustratorで簡単にチョコレートを作ってみる

もうすぐバレンタインですね!
ウキウキする人、爆発しろ(^q^)!と願う人、願われる人…様々な思いが渦巻くこの季節、イラレでチョコレートでも作ってみませんか?
バレンタインは割とどうでもいいのですが、この時期限定の輸入物のチョコなど見ていると…心が踊ります…!
最近は可愛いデザインも増えましたしね。
今回はよくあるタイプのチョコレートをIllustratorでちゃっちゃと作ってしまおうという記事です。初心者さんでもできます、3分くらいで。というか初心者さん向きです。
使うのは角丸長方形ツール、ペンツール、グラデーションツール。この3つのツールを触ったことがある方ならできます。
ちなみにスクリーンショットはIllustratorCCのものです。
これであなたもショコラティエ!失恋ショコラティエ!

40_2014valentine_03

いちばん簡単!上から見たようなシンプルなチョコ

40_2014valentine_06

見ただけでどんな構造かすぐ分かってしまう、シンプルなチョコレート。これは角丸四角形にグラデーションかけて、上に飾りつけただけです。

40_2014valentine_10

左側にあるであろうツールパネルから、角丸長方形を選択。そしてアートボード上で一度クリックして、角丸長方形の設定ダイアログを出します。

40_2014_kadomaru

幅や高さはお好きなように。今回私は普通の長方形にして、角はちょっとだけ丸い形にしました。
何となく、薄いパレットチョコな感じをイメージしてます。
そして、グラデーションをかけます。今回は円形グラデーションにしました。

40_2014valentine_14

左側にあるであろうグラデーションツールをクリック。そして先程の角丸四角形を選択して、グラデーションをかけます。

40_valentine_gradesettei

色や角度の設定はこんな感じです。自然に光った感じになるような感じで設定。

40_2014valentine_18

グラデーションをかける範囲は、こんな感じで設定しました。明るい部分がはみ出すような設定で、暗い部分が多めにできるようにしました。

40_2014valentine_22

土台の完成です!もうこれでほとんど出来たようなもんです。

40_2014valentine_26

あとは飾りをつければ完成です。そして傾けてニュアンスを出してみたり。
チョコと同じ色合いのグラデーションをかけた細い長方形で、チョコの模様を描いてみたり、ペンツールで適当に描いた粒にグラデーションをかけて、オレンジピールっぽい飾りを作ってみました。
かんたーん☆余裕があれば影とかつけたら更に立体感が出て良いかも。

DARSのようなぷっくり粒チョコ

40_2014valentine_30

これも簡単。先ほど作った茶色いグラデーションの角丸長方形にちょこっと手を加えるだけ。

40_2014valentine_22

これを傾けて、白のぼかしでハイライトを加えます。

40_2014valentine_33

こんな感じ。白い部分はペンツールで描きました。三角形を描いただけです。

40_2014valentine_35

ワイヤーフレーム(線のみ)で見てみると、こうなっています。
そして、白い部分を選んで、「効果→ぼかし→ぼかし(ガウス)」をかけます。

40_2014valentine_37

自然な光彩が入りました。
チョコの角度や色に合わせて、白い部分の形やぼかし具合、不透明度を変えてください。
おわり!

板チョコのかけらのような、真ん中がへこんだチョコ

40_2014valentine_40

明治のチョコにありがちなこの形。これもめちゃ簡単。
ベースとなるのは先ほどの茶色いグラデーションの角丸長方形。また使うよ!

40_2014valentine_44

これを傾けときます。んで、これと同じ角丸長方形を複製します。
角丸長方形を選んで、Altキーを押しながらドラッグ。

40_2014valentine_48

複製したもの(上に重なっているもの)は、塗りをなしにして、線をつけます。

40_2014valentine_52

線をつけた画像を縮小し、図のように配置します。そして線の色を白色に。
ちなみにこの画像で、線の太さは4ptです。

40_2014valentine_56

白線に、「効果→ぼかし→ぼかし(ガウス)」を適用します。
画像でぼかしは13pxくらいかけています。
おお!へっこんだ!
これで終わりです。

40_2014valentine_59

上の作り方が一番簡単ですが、私は、もうちょっと質感?いびつな感じが欲しかったので、白線の部分は細い長方形を組み合わせて、ちょっとずらして作りました。
ワイヤーフレームはこんな感じ。

ハート型チョコ

40_2014valentine_63

これもグラデーションと、あと白色のぼかしです。
もう大体想像がつくんじゃないかと…。

40_2014valentine_67

ワイヤーフレームはこんな感じ。簡単ですね!

40_2014valentine_70

ペンツールでハートを描き、円形グラデーションを適用します。

40_heartguradesettei

グラデーションの設定はこんな感じ。ちょっと歪めてます。

40_2014valentine_74

範囲はこんな感じで設定して、明らかにくっきりした影が落ちるようにします。

40_2014valentine_77

あとはペンツールで白いハイライトを描いて、ハイライトを「効果→ぼかし→ぼかし(ガウス)」をかけて終了です。
これはぼかし6pxくらいです。

プリントチョコ

40_2014valentine_81

簡単なプリントチョコ。これはペンツールと円形グラデーションだけですね。

40_2014valentine_84

ワイヤーフレームはこんな感じです。

40_2014valentine_87

パーツをバラバラにするとこんな感じ。
まずは表面のいびつな長方形を描き、左側面、下面をパスで描いて、組み合わせただけです。

40_2014valentine_90

ポイントは、表面と側面の、それぞれの角をきちっと合わせて側面を描くことですかね。
これで図形が描けたら、あとはグラデーションで着色し、好きな柄を上に乗せるだけです。

ハッピーバレンタイン☆

そんなんで出来たチョコを使って、バレンタインカードを作りました。

40_2014valentine_94

最近は失恋ショコラティエ(ドラマの方)を観たり、ひたすらDir en greyを聴きながら作業したり、まどか☆マギカのさやかちゃんが可愛いなぁなどと思ったりしていたので、こんな出来になりました。
来年はもうちょっと幸せそうなの作ります。

それでは!Have a nice design!!