![](/_next/image?url=https%3A%2F%2Fimages.microcms-assets.io%2Fassets%2F2d1b8c905c1d447eb649028ca07253a8%2F6e6c78298fa84690861debb1b2bc91a1%2Fthumb_drawing.jpg&w=2048&q=90&dpl=dpl_52LoJ5edsCEW1FGXcZkmwHZxX7nZ)
デッサン力とWebデザイン
Webデザインをやるのにデッサンなんて必要あるの?そう思っている人も多いと思います。確かにPhotoshopを使えば写真を手書き風に加工したり、イラスト風にすることも可能です。アイコンだって商用で使えるアイコンはたくさん出まわっていますね。それでも私は「デッサン力は必須ではない」けれど「あった方が絶対にいい」と思っています。そんなデッサンについて書いてみます。
デッサンとは
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/bd9d223f31494d77b3dd187d7ffd1c26/newdrawing.jpg)
デッサンとは、目で見た物体の形状や質感、陰影をモノクロで忠実に描写することです。デッサンを勉強すると言うことは見る力を養う事と同じで、実際に「描く」ことより、物体を「見る」能力とイメージを形に「表す」能力だと言われています。
Web デザインに関係あるの?
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/a0facb4ffbf049828e09ca736c6397e0/drawing2.jpg)
アンケートの結果では、20%のデザイナーさんが全く描けないと回答しました。確かに描けなくても仕事はできます。ではなぜデッサンをすすめるのか?
デッサンをするメリット
デッサンをするメリットは 観察力がつき、物体の細部までとらえられる ようになる、という点です。デッサン力をしっかりと身につけていれば、物体の形・質感を豊かに表現でき、PC や Mac を使った表現にも説得力が出せるようになります。薔薇の曲線の美しさやデジカメのツルツルとした質感を表現する方法がつかめてくるはず。作りたいイメージを具体的に形にしていくスキル、画面の中でのバランスをとる力がアップし、デザインのポテンシャルも向上するでしょう。
良いデザインを観察するクセがつく
私は初めてデッサンが好きになったのは 6 歳の時(お絵かきではなくデッサン)。デザインの世界(Web に限らず)に興味を持ち始めて早 10 年。10 年間欠かさずやっている事といえば良いデザインを見たときに、 「なぜこのデザインに惹かれたのか」 を考えることです。Web 上で、街中で、どこでも「良いな」と思うデザインに出会ったら立ち止まって細部までじっくり観察し、研究します。すると「背景に画用紙のような質感を使って温かみをだしてる」「ボタンに 1px のラインを加えてくっきり見せている」「メニューバーのグラデーションとわずかな影が立体感を出している」とそのデザインの魅力をより深く理解でき、自分のデザインのアイデアとして引き出しにしまっておけます。
クライアントとの打ち合わせで
ちょっとしたラフ画をその場で描いてみせる事ができます。デッサン力があれば線だけで描かれたワイヤーフレームとは違い、使用する素材・写真の具体的イメージも含んで説明する事ができます。ワイヤーフレームだけではイメージを膨らませにくかったりしますが、少しイラストを加えるだけでクライアントの反応も違ってきます。つまりデッサン力があれば目の前にモチーフがなくても、 頭の中にあるモノ・アイデアを描き現す 事ができるようになります。
アイコン・ロゴ
世に出回っている数多くのアイコン素材を使用しても、なんの問題もありません。それでも時に Web サイトにあう素材が見つからない場合もありますよね。そんな時に自分でサッとイラストを描き、アイコンを作成できれば、イラストレーターに外注する手間も省けます。そして何よりもロゴ。こればかりは素材を使うわけにはいきません。世界にただ一つの、その Web サイトの顔ですから。
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/1aa4ef8fca674a5d85c5b14b2cf3b611/logo1.jpg)
拳がモチーフのロゴ。
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/735210bfc7eb4d05a425c065823281c6/logo2.jpg)
望遠鏡と星をモチーフに簡略化してロゴに。
イラスト・絵画を使った Web デザイン
こんな素敵なサイトを外注なしで作成できたら素敵ですよね!
N.Design Studio
http://www.ndesign-studio.com/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/e6cc69712cd546468c83aa79cdd3e0dd/nick-la.jpg)
SoftFacade
http://wow.softfacade.com/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/3095a3d2d72b45048efdcc2c5e4b1d73/SoftFacade.jpg)
XHTML Cafe
http://xhtmlcafe.net/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/ed6a7a89e1624172a0d9ad2d161024a3/xhtmlcafe.jpg)
meomi
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/bcbd278ad9184627b38552dd7633f75c/meomi.jpg)
DNA to Darwin
http://www.dnadarwin.org/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/1450af7749db41649ded5d3e91378271/darwin.jpg)
Pixelblast
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/7fa7152b2ba74ea49fab89d2ad937ab5/pixelblast.jpg)
Pieoneers
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/7ac2434b8c8242b7abdcee93b14573c9/pieoneers.jpg)
Miki Mottes
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/fe78103d46b946a3bfbb1efa83204f0e/miki.jpg)
Sofa
http://www.madebysofa.com/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/eeadeb83d3fd4928ae28e2c641a9d22d/sofa.jpg)
R.I.P Cube Club
http://www.cubeclub-chemnitz.de/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/c3421a14ec6c4bceb93e6f1fd36ea997/ripcube.jpg)
ブラン
http://www.bla.jp/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/178a657f7fb0446bbfa4d9b72f9ef13b/blanc.jpg)
PSYOP
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/d6163d4df65e49368df7ed4368166913/psyop.jpg)
Hull Digital Live 09
http://www.hdlive09.co.uk/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/9d240563dc40483eae2f010f63a59bfe/hull_degital_live.jpg)
RED NOSE DAY
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/22816bc6b1524262aad74090f9c79e1e/red_nose_day.jpg)
Starbucks Coffee At Home
http://www.starbuckscoffeeathome.com/
![](https://images.microcms-assets.io/assets/2d1b8c905c1d447eb649028ca07253a8/0c0951d08eef441d911a3c465f3e4e1a/starbuck.jpg)
継続することが大切
一日一枚、何か身の回りのモノをデッサンしてみましょう。下手でもいいんです。よく観察し、形にしようとする事が肝心です。本格的に習いに行けば、指導してくれる先生もいるし、他の生徒のデッサンをみて刺激を与えられるでしょう。デッサン力がないとデザインができないということはありませんが、行き詰って壁を感じてしまうかもしれません。難しく考えず楽しんで続ければ、いつかやっててよかったと思える日がくると思います。