DTPからWEBデザイナーに 僕の勉強方法と考え方

「DTPからWEBに転向したい」または「これからWEBデザインを学びたい」という方に、僕が行ってきた勉強方法やデザインの捉え方を紹介します。
何から始めたらよいかわからないという方に、少しでもヒントとなれば嬉しいです!
目次
DTPではこんなことをしていました
プロフィールにも書いてますが、僕のデザイナーとしてのキャリアのスタートはDTPデザインです。
その当時、使っていたソフトと言えばIllustrator、Photoshopがメインで、それ以外はあまり使っていませんでした。
というより、使う必要がなかった。
今は少し風向きが変わってきましたが、当時はAdobeがデザインにおけるデファクトスタンダードでした。(まぁ今もそうか…)
DTPデザイナーの勉強方法
たった2つのソフトなので、習熟度の差はあれどデザイナーであれば皆使えていました。
言い換えれば「良いデザイナー」になるためには、それ以外の自分の強みを得ることが必要でした。
僕自身もまた、大量のインプットに励みました。
書籍を読み漁り、ADC(Art Directors Club)のセミナーを受け、デザイン力を上げるためにできることは色々やりました。
結果的には、関わった広告で日本新聞協会優秀賞をいただくなど、形として表れました。
ここでのインプットは今でもデザインの基本として、役に立っています。
良いデザインを見るって本当に大切です。
ただ見るんじゃなくて、何が良いのか、なぜそうなのか、デザインの本質を探りながら。
WEBデザイナー、覚えること多すぎ
勉強の始め方
まずはじめに、「WEBデザイナーはコーディング出来たほうが良いのか」。
当然するべきだと思っています。
実装方法を知らずして、WEBデザインは出来ません。
DTPに例えるなら、「コーディングしないWEBデザイナー」は手書きラフスケッチで終わるデザイナーようなものです。
WEBデザインと言っても、デザインの本質は変わりません。
道具が変わっただけです。
とは言っても、覚えることは沢山ありました(笑)
DTP時代のデザイン貯金があったので、デザインインプットは一旦止め、まずはWEB関連の技術習得です。
HTML、CSS、JavaScriptまずはこの3つですね。
おすすめ書籍は「HTML/XHTML&スタイルシートレッスンブック」。僕はここからはじめました。
文字通り写経のようにコードを書いてはブラウザで確認、を繰り返していました。
ここで大切なのは、最初は小さいデザイン(短時間で完成する)を作りながら覚える、ということですね。
僕自身そうですが、デザイナーは頭の中に完成図があり、早くそれを作りたいという意識があります。
おぼつかないコーディングでは、大作を完成させる前にグダってしまいます(笑)
小さく回してきましょう。
あとでそれらは結びつきます。
エディタについて
エディタは何でも良いです。
自分の使いやすいものを選びましょう。
先にも書きましたが、ソフトはただの道具です。
ちなみに僕が試したのは…
- Coda
- Dreamweaver
- Brackets
- Sublime Text
- Atom
- Visual Studio Code
くらいでしょうか。(いろいろ試してますね…)
今はVisual Studio Codeに落ち着いています。
デザインソフトについて
Illustratorも使いますが、ほぼSketchです。
Adobe XD、Figma なども試してみましたが、Sketchに戻ってしまいました。
IllustratorとSketchの使い分けは、込み入ったデザイン(ロゴのような細かいもの)はIllustrator。
それ以外はSketchといった感じです。
操作方法はIllustratorが使えれば、そんなに迷うことはないと思います。
その他に覚えること
ここからが本番です。
Git、タスクランナー、SCSS、WordPress、PHP、Google Analytics、Vue、UI/UX e.t.c
これらキャッチアップに終わりはあるんでしょうか(笑)
また、DTPデザイナー時代と同様、「WEBデザイン」ができるデザイナーは五万といます。
自分の強みを出すために「WEBデザイン×○○○」を見つけましょう。
「マーケティングがわかるWEBデザイナー」
「プログラミングもバッチリなWEBデザイナー」
「動画編集も任せろなWEBデザイナー」
スキルの掛け算で強いデザイナーになります。
まとめ
DTPもWEBも大事なことは「デザインの本質」を掴むことです。
ここを外さなければ、技術は後追いでも良いとさえ思っています。
そして、他にはない自分の強みを作りましょう!
(僕も頑張ります!)