イラストメイキング

   web入門, イラストレーター入門| 

信州くだもの村 富永農園さんのサイトの、ヘッダー用イラストのメイキングを紹介します。

2016-10-20_231349

1)鉛筆で下書き

ロゴをおいて、全体背景画像をおき、ページを表示させ、ヘッダー画像なしの状態で、キャプチャとったものをプリントアウトします。
何もないところでイラストを描くのは(わたしの場合)難しいので、ここに配置しよう、、等考えながらだと具体的にアイデアも思い浮かんでバランスがとりやすいからです。

img301

2)下描きを元に、コピーで拡大などしつつ、ざっくりとペン入れ

このペン入れは、コレ自体がデジタル水彩画の下描きになりますのでかなりラフ画です。

img300

3)スキャンして下絵用に変換

ラフ画をスキャンして、下絵として使いやすいようにピンクなどの色をつけておきます。

2016-10-20_223755

4)鉛筆ツールにクレヨン風のぎざぎざブラシを適用

色鉛筆でこつこつと色を塗っていく具合に色着けをしていきます。
この絵は水彩画っぽく描きたいので、ペン画のアウトラインは入れない予定です。
レイヤーをわけながら上のパーツ(目や口などの部品)から描いていきます。

2016-10-20_223943

4)下のレイヤーに移動して肌色や、洋服の色をつける。

レイヤーを分けているので、万一失敗しても簡単に消したり、パーツの移動ができます。
ペンタブレットで描いていますが、手がうまく動かなくて、変な位置に線がはみ出たりしますが、それも味わいが出るので、きれいに描きすぎないようにしています。

2016-10-20_224012

5)背景のりんごを描く

背景はまず、一番上のレイヤーになるりんごから。

2016-10-20_224045

6)次にリンゴの下のレイヤーになる、木を描きます

2016-10-20_224058

7)その下のレイヤー、葉っぱ

自然な色合いになるように、原色は使わず、彩度を落として、絵の具で赤と黄色と青の3原色を混ぜたようなくすんだ色を使います。

2016-10-20_224115

8)丘のいろをざっくりと鉛筆ツールで

色鉛筆でざっくり塗っていくようなイメージです

2016-10-20_224128

9)丘に色を重ねていきます

ベタ塗りにせずに、筆のラインを残すようにしていく

2016-10-20_224139

10)山をその下のレイヤーに描いて、一番上に、草のレイヤー

2016-10-20_224223

11)背景の青空も、ベタ塗りにせずに、(大変ですが)色鉛筆でざくざく塗っていく

背景青空は一番下のレイヤーです

2016-10-20_224249

12)人物を縮小して、上に重ねて配置してみました。(このときが一番楽しい♪全体が見えてくるのでワクワク)

大きさを調整します。人物は大きくないとかけないので、この時点でずいぶん縮小されることになります。
かなり荒く描いておいても、丁寧に細かく描いたようになります。

2016-10-20_224407

13)ナビゲーションバーを置くためのざらざらテクスチャを上に重ねる

テクスチャの色と、草の色を、レベル補正を使って色合わせしています。

2016-10-20_224434

14)人物を少しだけふちどりつけて、目立たせる

各レイヤーの濃度を調整したりして、バランスをとりましたが、人物がやや目立たなくなってしまったので、微妙に効果をつけて、白ふちどりを入れました。完成です。

2016-10-20_224535

2016-10-20_231349

 

   web入門, イラストレーター入門| 

  関連記事

【ホームページの作り方】ポータルサイト・情報サイト・コミュニティサイトの作成

ポータルサイト、情報サイトで大事なことは、情報やページ数がどんどん増えていくしくみです。情報が大量に ≫続きを読む

一番簡単なスマホ対応ページの作り方

スマホに対応したホームページの作り方(手法)はたくさんありますので、一概には言えませんが、超初心者向 ≫続きを読む

画像が表示されないと困ったら(HTML初心者の方へ)

「画像が表示されません!どうして???」HTML初心者の方によく質問をされるんですが、いくつか理由が ≫続きを読む

飯田でのセミナーご参加ありがとうございました

飯田のセミナー、大好評のうちに終了しました。アンケート結果、皆さんとても勉強になった、また参加したい ≫続きを読む

【Q】リニューアルしてページ名がindex.htmlからindex.phpに変わります。名前が変わると、過去にいろんな別サイトやブログからリンクしているので、リンク切れが起きてしまうんですが、どうすれば!?

リニューアルでindex.htmlをindex.phpに変更することって結構ありますね。静的HTML ≫続きを読む

【Q】わたしのネットショップ、写真が良くないと言われたのですが・・・。

よく言われることですが、「ネットショップは写真が命」 買う人は手にとって見ることができない、匂いを嗅 ≫続きを読む

(WEB制作入門1)静的サイトと動的サイトの違い

静的サイトの作り方 2000年くらいのこと。わたしがWEB制作をお仕事としてやり始めたころのことです ≫続きを読む

【Q】お店のfacebookページを作ったのですが、記事を投稿しても、反応があまりないし、誰が見てくれているかわからないんですが・・・?

《2016年2月補足》サイトリニューアルにあたり、旧記事を整理していますが、アクセスの多い記事は残し ≫続きを読む

【Q】ウィルスに感染したために、サイトが改ざんされたというニュースを読んで不安です

「××社のホームページが改ざんされ訪れた人にウィルス感染の危険」こんな言葉でニュースになっているので ≫続きを読む

【ホームページの作り方】病院・歯科医院のホームページ作成

歯科医院のホームページは、院長・スタッフ紹介、治療内容、医院の紹介と受付時間・交通アクセスなど、だい ≫続きを読む

▲ページ先頭へ