PR

Webデザイナーはイラストが描けて当然?

2008年12月5日(金)
兎本 幸子

写真にらくがきする

子供のころ、偉い人の写真にらくがきをしませんでしたか。元の形に自分の考えがプラスされる面白さと、写真とイラストという違う質感のものが合わさった、面白さがあったはずです。あれをもうちょっとまじめにやると、かっこいい画像を作ることができます。

図3と筆者が実際に描いてみたサンプルの動画(http://tedia.jp/movie/item.php?id=Sy2ZKKPAmRQ)を見ながら、早速、先ほど練習した簡単な形のイラストや文字を加えていきます。

今回はまじめにらくがきをするので、写真の選び方もポイントになります。らくがきをする余白が十分あるものを選んでもいいですし、全体に要素がある写真に大胆にイラストや飾り文字を乗せても面白いです。手順は以下の2通りになります。

  • 描きたいもの、表現したいものがあって、それに沿った写真を用意する
  • 写真を見て、そこから連想されるストーリーを絵にする

実際にWebサイトをデザインする際はどんな写真を選ぶかとても慎重になると思いますが、ここはまだ練習ですので、お好きな写真を選んでください。

イラストを加えてみよう

どんな写真を使うとしても、写真とケンカしないで、その中で起こっている出来事に参加する気持ちで描いていきます。

図3-1は空に何か飛ばしたいなと思い、いくつかの空が広く映っている写真の中から選びました。つまり描きたいものが先です。下地の色はそれほど濃くありませんが、雲のイメージが浮かんだので、白いラインで乗せました。飛行機は楕円(だえん)を重ねた形でできています。

図3-2と図3-3は写真からイラストが浮かびました。

図3-2の花を見て、チョウを描きたくなりました。チョウは擬人化されていて、うっとりとみつの感想を言っています。その文字は写真に写っている花の輪郭に沿って並べられています。こうすると、文字にリズムが生まれます。チョウは先のまるまった三角と、先のとがった楕円(だえん)を重ねて描いています。ちょっと複雑な形なので、チョウの写真もいくつか参考にしました。

図3-3は、撮っている時点でお皿の中に人を入れたら面白いだろうなと思っていました。パスタのおいしさを女の子と犬に代弁してもらっています。本来、話せるのは女の子の方ですが、犬の方が食いしん坊に見えたので、こちらに吹き出しを伸ばしました。吹き出しは湯気のイメージでモクモクさせました。文字は縦ラインだけちょっと太くして、インパクトを加えました。ラインだけではちょっと写真に埋まってしまったので、下に白を敷いています。

どれも写真と別に紙にイラストを描いてスキャナーで取り込み、Photoshop上で重ねました。スキャナーで取り込んだ後は、レベル補正などでゴミ取りをしてください。濃いラインは乗算、白いラインは階調反転した上でスクリーン、女の子と犬のイラストは必要な部分だけ切り抜いて通常で重ねています。

人の形はちょっと難しいかもしれません。これに関しては次回、詳しく紹介します。どうぞお楽しみに。

1970年生まれ。多摩美術大学油画科卒業。イラストレーターとして活動する他、ウサギ王(株)のアニメーターとして映像作品も手がける。著書に「えんぴつ一本ではじめる イラスト手習い帖」「えんぴつ一本ではじめる スケッチ手習い帖」(MdNコーポレーション)、「イラストの学校 かわいい動物と。」「イラストの学校 たのしい人々と。」(BNN新社)などがある。犬とハワイをこよなく愛する。http://umotosachiko.com

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています