6ヶ月でWebデザイナーになった私が教える3ステップ独学勉強法

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

私はWebデザイナーを目指し独学でグラフィックデザインとコーディングを学びました。28歳でWebデザイナーを目指し始めたため、学校へ通う時間などありませんでしたからね。

そんな私が28歳でフリーター、深夜のバイトをしながら、昼間に行っていた勉強のやり方をシェアします。

ちなみに私がWebデザイナーを目指し始めたのが2006年と10年以上前のことですが、今回紹介する勉強法は普遍的なものですので参考にしていただければ幸いです。

かんたんな自己紹介

  • 2006年3月(28歳)の 時点で、私はフリーターだった。30歳を目前にWebに関わる仕事をしようと思いWebデザイナーを目指すことに。
  • 2006年の9月、Web制作未経験だった私だったが、就職が決まる。ディレクションから制作までを実務で学んだ。机上の空論ではなく実務を行うことで学ぶスピードが半端なく早い。
  • 2007年10月に退社しフリーになる。フリーになってからもスキル不足を感じており、常にテストサイトを作りながらデザインとコーディングのスキルを磨いていった。
  • 2008年4月に法人化。そこから現在に至る。

かんたんな自己紹介が終わったところで、独学勉強法のやり方を説明していきます。

1. 勉強する環境を整える

2016-01-06-09-25-42

環境を整えるとは、Webデザインに必要なPCとソフトウェアを手にいれることだ。そして独学で学ぶために必須となるのが参考書。これらを手に入れ、Webデザインを学ぶ環境をまずは整えよう。

1−1. ソフトウェアを手にいれる

Webデザインに必要なソフトウェアとは

  1. Photoshop
  2. Illustrator
  3. Dreamweaver

この3つがマストだろう。

どのソフトウェアもAdobe公式ページから体験版をダウンロードできるため、まずはそちらを試してみると良い。

1−2. 参考書を手にいれる

次に独学でWebデザインを学ぶために必須となる参考書を買いに、本屋へ行こう。参考書の選び方としては、初心者向けのものと、中級者向けのもの。PhotoshopとIllustratorに関してはこの2種類(2冊)持っておくと良い。

ネットで購入しても良いが、近くに本屋があるのであれば実際に中身を見て、自分に合った(わかりやすい、読みやすい)参考書を買うことが独学で学ぶにはおすすめだ。

私の例で言えば、私は難しい表現が多く、文字がぎっしり詰まったような参考書が苦手だ。本によっては専門用語ばかり使われていたり、操作に関してわかりづらいものもある。

こういった点を踏まえて、自分にあった参考書を手にいれることは、独学で学ぶには重要なことなのだ。

2. 参考書に書いてあることを全部やる。楽しみながらサンプルを作る。

Woman working with laptop placed on wooden desk

私の独学勉強法のキモとなるのがこの部分。参考書に書いてる内容を1ページから最後のページまで全て行うことだ。(あくまで操作に関する部分)

実は私はデジタルハリウッドにも申し込んでいたのだが、送られてきた教科書がわかりづらく役に立たなかった。先ほど、自分に合った参考書を実際に本屋で見て購入することをおすすめした真意は、こうした失敗からの発言だ。

Webデザインには3つのソフトが必要だと書いたが、どのような順番で学んでいくのがベストなのか?下記に書いていこうと思う。

2−1. Photoshopの基礎を学ぶ

Webデザインを独学で学ぶにあたって、まずはPhotoshopから始めることをおすすめする。その理由は操作性など含め、とっかかりやすいから。

※とは言えIllustratorをすでに触ったことがある方はIllustratorから触れても良いだろう。

Photoshopの学び方については、購入した初心者向けの参考書に書いてある操作を全て行ってみるとよいだろう。参考書を眺めていると、ついつい自分の興味のある部分しか触れないことがあると思う。

だが、本気で、独学で学ぶのであれば、一言一句逃さずに全ての操作を一度行うことで、基礎が身につくのだ。

2−2. 作りたいものを作りながらPhotoshopの応用を学ぶ

Photoshopの基本的な操作を学んだ後は、何かを参考にしながら自分の作ってみたかったデザインを作りながら、応用を学んでいく。

中級者向けの参考書などには、サンプルのデザインを作りながら学ぶといった内容のものが非常に多い。その中で作ってみたものを作りながら応用を学ぶとよいだろう。

もちろん参考書に載っていないものでも、基礎を学ぶ中で「できそう」と思うものもあるだろう。そういった作ってみたいものを楽しんでデザインすることが独学でもしっかり学べるコツなのだ。

2−3. Illustratorの基礎を学ぶ

Photoshop同様にIllustratorも初心者向けの参考書の内容を1から10まで行い、基礎を身につけよう。

Illustratorは紙媒体のデザインで用いられることが非常に多い。例えばチラシやパンフレットなどを作る場合、Photoshopで加工した写真をIllustratorに配置し全体のデザインやレイアウトはIllustratorで行う。

Webデザイナーを目指すのであれば、自分の名刺や、自分のプロモーションに使うパンフレットくらいはIllustratorで作れるようになっておきたいものだ。

IllustratorはPhotoshopに比べ、とっかかりずらい人が非常に多い。(私もそうだった)似ているようで操作性が違う両ソフトの基本的な使い方は必ず覚えるようにしよう。

2−4.作りたいものを作りながらIllustratorの応用を学ぶ

初心者向けの参考書で基礎を学んだ後は、中級者向けに掲載されているサンプルを作ってみよう。サンプルなどを作る過程で、基礎から応用が身についてくるはずだ。

そして、自分の名刺やパンフレット、ロゴなどを好きなものを作ってみるとよいだろう。

実際のWebデザイナーの業務の中で地図などを作らされることが多かったので、サンプルに地図を作成するのもおすすめだ。「Googleマップでいいじゃん」と作り手は思うかもしれないが、クライアントが「独自の地図がいい」と言えば書かざるを得ないのだ。

2−5. Dreamweaverを学ぶ。HTML、CSSのタグを学ぶ。

Photoshop、Illustrator同様に参考書を見ながらDreamweaverの基礎を学ぶ。

とは言え、Dreamweaverで行う作業はコーディングとなるため、HTMLやCSSの知識(タグ)も同時に必要になってくる。そのためタグ辞典などを購入すると良い。

タグの意味を覚えることは、英単語の意味を覚えることに似ているため、それぞれの勉強法で良いだろう。私はノートなどにまとめることはなかったが、暇さえあればタグ辞典をペラペラ見てなんとなく覚えていった。

Dreamweaverを使ったコーディング作業では、コードの頭文字を入力すると、それを補助してくれる機能があるので、完璧に覚える必要は全くない。

ちなみにコーディング作業においてはDreamweaverを使わない人も居るだろうが、Dreamweaverは非常に便利なソフトウェアなので、私はおすすめしている。

3. テーマを決めて実際にサイトを作る

Working at home

ソフトウェアの使い方を一通り覚えたら、実際にサンプルサイトを作ってみる。未経験でどこかへ就職するであろうから、面接の際に持っていくポートフォリオを作る意味でも重要となる部分だ。

ちなみに私は自分のサイトを作り、それをポートフォリオとして面接に持って行った。

もしテーマが決まらないのであれば、どこかのサイトの構成(サイトマップ)を参考にして作成しても良いだろう。例えば、どこかのレストランのサイト構成だけを真似て、残りは自分で写真などの素材を用意し、お店の雰囲気に合わせてデザインを作ってみるとか。

さいごに

独学でWebデザインを学ぶためには、

  1.  勉強する環境を整える
  2. 参考書に書いてあることを全部やる。楽しみながらサンプルを作る。
  3. テーマを決めて実際にサイトを作る

この3ステップを愚直にやってみてほしい。

私の過去を振り返ると28歳でフリーター。そして28歳に独学でWebデザインを学び、29歳の時に未経験でも大手の企業に就職することができた。そして2008年には独立を果たし、3年間苦労に苦労を重ねてきたが、いまでは自分に嘘をつかず、自分の時間を生きることができている。

今回紹介した3ステップでは、トレンドや具体的なやり方について情報としては薄さを感じる人も居るだろう。しかし普遍的なやり方だと私は思うし、自信を持って記事にさせていただいた。

もし紹介した内容で挫折するようであればTechAcademy [テックアカデミー]プログラミングのオンラインスクールのCodeCampなどを利用するのも良いだろう。困った時、壁にぶち当たった時、頼れる人が居るというのは非常に心強いものだ。

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

SNSでもご購読できます。

コメントを残す

*