雑誌の営業職からwebディレクターに転職した僕はhtml5、css、SEO、UI/UXなどいろんなことを勉強。
この秋スキルを買われUXディレクターとして年収230万円アップの転職に成功。
異業種・異職種から未経験でwebディレクターになりたいと思ってる人は参考にしてください。
Contents（目次）
イケてるwebサイトをたくさんみて最新のwebトレンドを掴む
まずは「最新のイケてるwebサイト&webサービス」をたくさん見ることをやりました。
これは今でもずっと続けています。
なぜこの勉強が役に立つのか。
webディレクターは、「こういうのが今どきのイケてるやつやで！」と発言しなきゃいけなかったり、案を求められる場面がたくさんあるから。
「イケてる」の基準は次の三つの視点です。
・プロモーションの手法が画期的
・デザインが先進的で洗練されてる
・ビジネスモデルが秀逸
イケてるサイト探しに便利なまとめサイト
私がよく使っているのは、「ギャラリーサイト」と「スタートアップ系のまとめサイト」です。
ギャラリーサイトとは、デザインがイケてる、先進的なインタラクションがふんだんに使われているwebサイトをまとめたサイトのことです。
「ギャラリーサイト」と検索すればいっぱい出てきますので、良きものを使いましょう。
「スタートアップ系のまとめサイト」はITベンチャーが最近リリースしたwebサービスが紹介されているサイトです。国内だけでなく、海外の話題も載っているものが良いでしょう。
私のオススメは↓↓↓
https://www.cssdesignawards.com/
ドットインストールでHTML5&CSSを勉強
ドットインストールを使ってHTML5とCSS3を学習しました。
htmlとCSSの知識は、webサイトでも、アプリでも、業務システムでも基礎中の基礎の知識。
また、一番目に触れやすいweb制作物かつ、書籍や学習教材も豊富なので、まず勉強するならhtml&CSSがおすすめです。
なぜこの勉強が役に立つのか。
日本で暮らすために日本語を覚える。アメリカで暮らすために英語を覚える。役に立つかどうかより絶対必要なので覚えるべき、そんな感覚です。
htmlの勉強をしているとwebページがどうやって作られるかに触れられるのでオススメ。
https://dotinstall.com/lessons/basic_html_v3
このhtml入門とCSS入門をクリアすれば、webディレクターの入門としては十分な知識でしょう。
スマホから動画も見れるので僕はよく通勤時間に閲覧していました。
大体2週間程度時間を取ってやれば十分終わると思います。
ホームページやブログを自分で作り実際に運用
htmlの基礎を勉強したら、自分でホームページを作ってみましょう。
英語の勉強も単語や文法の勉強だけしているとつまらないですよね？webの言語も同じです。
実際に書いてみる、作ってみることでweb制作の知識が格段に向上します。
オススメは入門者向けの実践書籍をよみながら。
まずはとにかく言われたとおりに作ってみると、それっぽい今風のwebページが完成するので、めっちゃモチベーション上がります。
この本を見ながらコーディングできるようになってきたら、html5をもう少し詳細に理解するためにこの本がオススメ。
この本まで勉強できれば、本を調べたり、ネットで検索しながら作りたいものが作れるレベルになってきます。
ここまでわかっていればフロントエンドエンジニアやデザイナーと話すのにそんなに困ることは無いでしょう。
もう少したくさんいろいろ作ってみたい場合は、この本でCSSの練習を重ねても良いでしょう。
狙ったどおりのレイアウトを作るためのトレーニングができます。
html5プロフェッショナルの資格取得
htmlとcssの基礎知識をある程度勉強したので、復習の意味も込めてHTML5プロフェッショナル レベル1の資格を取得しました。
「僕は未経験ですけどwebの勉強を自主的にやって、やる気も基礎知識もあります！」
というやる気アピールが、未経験でwebディレクターを目指す時にとても大事です。
ただ自主的に勉強しているだけで実務経験が無いひとは、面接官から見た時にどれくらいできるか人なのかのレベル感がわかりません。
資格取得はマストではないですが、一定勉強した場合は自分のスキルを明確にするために受験をおすすめします。
HTML5プロフェッショナルレベル1の勉強法
web上にいろいろと勉強法が乗っていますが、この本を丸暗記するのが一番いいです。
2週間くらいかけて丸暗記すればそれなりに良い点が取れると思います。
不明点はこの本とwebを使って調べると理解が深まりますよ。
html5プロフェッショナルレベル1を取得すれば、webディレクターとしての必要なhtml&CSSの知識は十分なレベルと言えるでしょう。
書籍&バズ部でSEOを勉強
マーケティング知識の基礎としてSEOの勉強を重ねました。
なぜ役立つのか。
意外にSEOの基礎知識を理解できているwebディレクターは少ないから。ただの「制作屋さん」よりちょっと一歩スキル面で抜け出ることができます。
まずはじめに読んだのがこの本。SEOとはなにか、基礎はどうしたらよいかが書かれています。
次に読んだのは、Googleのガイドラインを勉強しました。
https://support.google.com/webmasters/answer/35769?hl=ja
SEOを勉強していて困ったのは、記事が書かれた時代やサイトによって言ってることが違うんですね。
何が本当かわからなくなります。そんなときこそGoogle公式に頼りましょう。
ここまで読むと基礎的な理解ができるので、やっちゃいけないことはだいたい理解できます。あとは調べながら実践です。
オススメのSEOのサイトとしては「バズ部」さん「海外SEO情報ブログ」さんがおすすめです。
こういったサイトに書かれていることと勉強したことをもとにブログやホームページのSEO対策を実践してみましょう。
書籍でUI/UXデザインの基礎を勉強
デザインの基礎知識やwebデザインのお作法を全く知らなかったので、書籍で勉強しました。
なぜ役に立つのか。
きれいに見えるデザインには法則性や理論がきちんとベースになっている。webディレクターはそのロジックをもとにデザイナーにデザインを改良する指示を出さなければ行けないから。
まずはじめに勉強したのがこの書籍。その名も「ノンデザイナーズ・デザインブック」。
ずばりデザイナーじゃない人のためのデザインの本です。
この本は２－３日で読めるので、初心者にはおすすめです。
「整列」「余白」「近接」「対比」この４つの基本を学ぶことができます。
その次に勉強したのがこの本。
これもノンデザイナー向けで、きれいなデザインの基礎を練習できます。
普段のパワポを使った資料作成にもこの知識が使えるのでおすすめです。
webディレクター3年もやってると、いろんなwebディレクターがいて、デザインをロジックで組んでいる人ってほとんどいません。「もう少しかっこよく」とか「もう少しわかりやすく」とかそんなレベルの人がザラにいます。
そういうディレクターはデスマーチまっしぐらになるので、きちんとデザイン面の自己研鑽を積む必要があります。
他にはUI/UXの勉強もしました。
ユーザビリティの基礎はこの本がとてもおもしろかったです。
実例をベースに解説されているので、サクサク読めます。
他にはこの本は実務ベースでUI/UXをどう検討していくか？という視点でかかれているので、とても役立ちました。
techacademyでPHP/Laravelを受講
webページの見栄えの勉強をした後に、プログラミングの勉強をはじめました。
ドットインストールでPHPの勉強をしていましたが、わからないことが多くて挫折してしまい、TechAcademy [テックアカデミー]を受講。
2ヶ月のコースPHP/Laravelのコースに申し込みました。
オンラインブートキャンプ PHP/Laravelコース
2ヶ月で18万円。。。
高い。
でも結論としては通ってよかったと思います。
毎日2時間程度を8週間続けます。週2回30分のビデオチャットメンタリングがあって、テキストや調べてもわからないことを教えてもらいました。
通ってよかった点としては、データベースとシステムの関係がよくわかったこと、ER図が読めるようになったことですね。
この勉強で工数の大小がだいたい分かるようになったので、プログラマと話すのがそんなに苦じゃなくなりました。
ただ、高いです。
他にもtechacademyはコースがいくつかあるので、あなたの興味にあわせて通ってみるのが良いでしょう。
オンラインブートキャンプ Webデザインコース
オンラインブートキャンプ UI/UXデザインコース
オンラインブートキャンプ Webアプリケーションコース
オンラインブートキャンプ WordPressコース
就職保証付き Javaエンジニアコース
オンラインブートキャンプ全12コースの「ウケ放題」
※techacademyにはwebディレクションコースもありますが、webディレクターの目から見ると大したことやってないので通わないほうがいいと思います。
最後に
僕はこの7つの勉強をすることで自分の力を高めることができました。
良くも悪くも、webディレクターは自分でスキルさえつければ年収アップや起業もできちゃう面白い職業です。
ぜひこの仕事にハマってくれる人がいると嬉しいなぁ～一緒にお話したいです。
