読者です 読者をやめる 読者になる 読者になる

NO TITLE

WEBデザインとかブログ運営、社会・経済、音楽などなど

全くの未経験が独学でWEBデザイナーに転職するまで

スポンサードリンク

f:id:shiromatakumi:20151217201342j:plain

【最終更新】2016年10月4日更新

28歳の未経験がWEBデザイナーに転職

私は2ヶ月ほど前からWEBデザイナーとして働いています。それまで、WEBデザインどころか、デザインの仕事やプログラミングやWEB関係の仕事すらやったことがありませんでした。

WEBデザイナーなどクリエイティブ業界では28歳で未経験はかなり少数なんです。結構大変です。

そんな私でも、WEBデザイナーに就職することができました。私がWEBデザイナーになるまでにやってきたことを書いていきます。WEBデザイナーを目指している人が読んだ時に、少しでも参考になれば良いなと思います。

 

当記事は未経験者向けの記事なので、経験者で転職を考えている人はこちらの記事をご覧ください。

 

未経験の求人を探してこのサイトに辿りついた人には「WORKPORT」がイチオシなので、利用してみて下さい。未経験の転職に力をいれている数少ない転職エージェントです。

 

勉強を始める前に必要なもの

  • パソコン(当たり前や)
  • Photoshop
  • Illustrator
  • テキストエディタ
  • 教材

 PhotoshopやIllustrator、Dreamweaver、InDesignなどのアドビソフトが全て使えるのがCreative Cloudのコンプリートプランです。

 

もしPhotoshopとIllustratorの両方そろえるお金がないという方は、Photoshopをオススメします。Photoshopだけでも大半のことはできます。フォトグラフィプランなら、めちゃ安いです。コンプリートプランだと高いですからね、予算を抑えたい方にはおすすめ。

 

テキストエディタはTeraPadを使っていました。無料なので、誰でも利用できます。

最近はSublime Text 3を使っています。このテキストエディタに慣れると他に浮気できないくらい便利です。ただ、最初はタグを打ちまくった方が覚えると思うので、シンプルなTeraPadで良いと思います。

TeraPad - 窓の杜ライブラリ

Sublime Text - Download

一応、Sublime Text の紹介もしておきます。海外のエディタなのでメニューは全て英語なんですが、プラグインを入れると日本語のメニューにすることができます。一応、有料なんですが、無料のお試し期間が無制限なので使い倒して気に入ったら購入してみてください。

自動で色分けしたり、予測変換が出たり、便利なショートカットが使えたりできます。他にも色んなことができますが、主旨と外れるので省きます。

気になった方は、ググるといっぱい情報が転がってるので調べてみて下さい。

TeraPadでタグをある程度覚えたら、さっさとSublime Textに移ってください。作業効率が圧倒的に違います。

追記:Sublime Text 3 の紹介記事も書いたので、時間があれば読んでみて下さい。

独学の勉強方法

本格的に勉強して転職するまでの期間は約10ヶ月くらい。仕事しながらだったので、そんなに詰めて勉強できてなかったと思います。

この間にやってきたことを書いていきます。

全くの素人なら、最初は超簡単な教材を買ってみましょう。いきなりカッコイイWEBサイトを作ろうなんて思うと挫折してしまいますから。

 できるシリーズは超入門なので、初心者には良いと思います。サンプルとかは超ダサいですけど。最初はダサいくらいのレベルで十分です。

「HTMLってこんな感じなんだー」ってのが分かる程度でOK。

 

 あと、分からないことがあったときにすぐ調べられるように、こういうポケットリファレンスもあると便利です。ただ、タグの意味とかってググれば簡単に調べられるので、なくても大丈夫です。

 

一通りマスターしたら、次のステップに行きましょう。もう少しマシなデザインのサイトを作りたいなら、これが良書です。私はこの教材は2回通して勉強しました。

 これ、一からWEBデザインを勉強するなら絶対読むべき参考書。なんせ、最初は簡単な内容なのに、進めていくうちにレスポンシブデザインに対応したり、jQueryが出てきたり、気づけば色んなテクニックを身につけることができます。他にも、bootstrap、SNSボタンの設置などなど紹介しています。しかも、フラットデザイン。

 

そして、応用編がこちらの二冊

 この一冊があればCSSでかっこいいサイトが作れます。MdNさまさまです。

 

これは比較的最近出た教材で、WEBデザインの最新テクニックがたくさん紹介されています。ここまでくると初心者向けではないですが、ワンランクアップできます。jQueryの知識がないと分からない部分もありますが、CSSだけでできることもたくさん紹介されているので、必須の教材です。

追記:別の記事にておすすめの書籍を紹介しましたので、そちらも併せて読んでみて下さい。

HTML・CSS・JavaScriptを独学するのにおすすめの入門書・参考書まとめ

 

もしお金がないという方は、

HTML入門 (全24回) - プログラミングならドットインストール

こちらで勉強しましょう。

 

私もこのような記事を書いていますので、参考に読んでみて下さい。

超初心者のためのHTML・CSS入門講座 - NO TITLE

スクールやオンラインスクールを利用する方法も

私自身は独学でWEBデザインやコーディングを勉強していましたが、私の知っているWEBデザイナーさんはスクールに通っていたという人が大半です。

スクールの方がモチベーションが継続しますし、分からない所で質問できるのが良いですね。

 

時間がないという人は、オンラインのスクールもあります。朝早くから遅い時間まで受講できるのが魅力です。CodeCampは他の方もよくオススメしていて、評判が良いようです。無料体験もできるみたいです。

 

追記:CodeCampの体験レッスンを受講してみました!!システムとか感想とか詳しく書いているので、スクール探している人は読んでみて下さい。

 

こちらもオンラインでWEBデザインやプログラミングなどが学べるスクールです。週2回のマンツーマンでのメンタリング、毎日15〜23時のチャット・レビューサポートがあり、一人で勉強するのが不安な方にはおすすめです。こちらも有名なオンラインスクールです。

サイト内で無料説明会動画も公開されています。

 

スクールではないですが、HTMLやCSSなどで疑問点があれば質問ができるQ&Aサイトもあり、無料で会員登録できます。便利なサービスなので登録しておきましょう。

 

それでは、次はデザインの勉強について。

 

スポンサードリンク

 

 

デザインの勉強

 コーディングの勉強って、たくさんネット上に情報があるので勉強に困ることはないですが、問題はPhotoshopとかIllustratorなんですよ。

正直、私は転職前はPhotoshopやIllustratorがちゃんと使えてませんでした。なので、超シンプルなデザインにして、後はHTMLとCSSで頑張りました。これらのソフトの知識があまりなくても、ポイントを抑えればある程度カッコイイWEBサイトは作れます。

詳しいことはこのサイトで紹介されているので、参考にして下さい。

 

勉強に使った教材はこちら

・初心者向け

 

とりあえずPhotoShopの基礎をしっかり学ぶ

 

でも、一番デザインの勉強になるのは実務なんです。これだけはしょうがない。

「実務ができないから困ってるんだよ!」って言われそうですが、実はWEBデザイナーになる前にデザインの実務をする方法があるんです。

職場の先輩社員にも独学で入社した人がいて、その人はクラウドソーシングでコンペに応募してデザインの練習をしていたそうです。これは目から鱗でした。仕事の依頼が来ないような人でも、コンペなら参加できます。

クラウドソーシングで有名なのがこの2社。

日本最大級のクラウドソーシング【クラウドワークス】

クラウドソーシング「ランサーズ」

デザインの練習にもなって、腕が上がればお金にもなるかもしれない。一石二鳥です。かなりオススメなので試しにやってみましょう。

 

転職活動をする前に、ポートフォリオを作ろう

まず、ポートフォリオサイトは必ず制作しましょう。未経験なら架空の会社とかお店のWEBサイトを作ってみましょう。ちなみに私はアフィリエイトサイトを作っていたので、それを載せました。

デザインはフラットデザインでシンプルに。CSSやjQueryでアニメーションをつけるのがオススメ。色に迷ったら、とりあえずモノトーン+一色。レイアウトは1ページの縦長で今風に。私のポートフォリオはこんな感じでした。

経験がない分、ポートフォリオを充実させることはとても重要です。

ポートフォリオの参考にはこの本を買いました。

 こんなサイトもあります。

応募や面接について

WEBデザインの勉強は楽しいですが、辛いのはやっぱり転職活動。特に、未経験で28歳の私は本当に苦労しました。

面接官は「未経験か~」って苦い顔をします。年齢も年齢ですし。

ここからは応募や面接について書いていきます。

まず悩むのは、派遣会社に応募するのか、直接企業に応募するのか。未経験なら、迷わず直接企業に応募して下さい。

派遣会社はアテになりません。しかも、企業は派遣会社に未経験を求めていません。面接に行く前にはじかれます。それに、求人紹介の頻度も高くありません。

未経験が転職活動をするには、直接企業に応募するのが一番近道です。

 

ちなみに、転職活動期間は1ヶ月半くらいです。

 

面接テクニック

とりあえず、バンバン応募しましょう。私は年齢的にも(転職活動中は無職だったので)金銭的にも早めに転職を決めたかったので、平日のほとんどは面接を入れてました。

私の履歴書はクソですが、書類通過率は50%くらい。面接まで行っても、未経験なので落ちまくります。

どうせ落ちるなら収穫が欲しかったので、必ず二つの質問をしていました。

「御社はどのような人材を求めていますか?」

「どのような社員が評価されますか?」

この二つを聞きます。この答えをそっくりそのまま、次の面接で使えばいいですよ。

 

A社面接時

私「どのような社員が評価されますか?」

A社面接官「仕事をとってこれるくらいのWEBデザイナーになると良いですね」

 

その後、B社面接時

B社面接官「当社でどうなりたいですか?」

私「仕事をとってこれるくらいのWEBデザイナーになりたいです」

 

名付けて、コピペ面接。

 

あと、WEBデザインとは関係なさそうですが、コミュニケーション能力があるなら絶対アピールしたほうが良いです。私はそこで評価上がったそうです。(後日談)

 

転職には転職エージェントを利用するのがおすすめです。

転職エージェントを利用すると、無料で面接対策や履歴書・ポートフォリオなどの添削を行ってくれるので安心できます。

上記の転職サービスが未経験にも力を入れており、未経験からの転職支援実績も豊富です。

WEBデザイナーの案件も多数保有しています。無料で転職活動のアドバイスを行ってくれます。こういうのは利用しない手はないですね。

 

WEBデザイナーやエンジニア専門の転職サービスを紹介した記事もあるので、あわせてご覧ください。

JavaScriptは勉強した方が良いのか

最近ではWEBデザイナーにJavaScriptは必須になっていますが、私の場合は転職するまでほとんど勉強していませんでした。今必死こいて勉強してます。

JavaScriptはできなくてもWEBデザイナーになれました。JavaScriptを勉強しなかったのは理由があります。

まず第一に、CSS3のおかげでJavaScriptがなくても動きのあるサイトが作れるようになったからです。確かにjQueryのようなライブラリを使えば、CSSよりも豊かな表現ができますが、CSSという土台を固めることが優先事項だと思います。

本当はこっちが大きな原因なんですが、そもそも時間がありませんでした。28歳というギリギリの年齢だと、あれこれ手を出して時間をかける余裕はありません。中途半端にJavaScriptを学ばずに、HTMLとCSSをしっかり学びました。

 

ただ、私の場合は時間がなかったのでJavaScriptの勉強ができませんでしたが、まだ若くて時間もあるなら、JavaScriptは勉強しておいた方が良いでしょう。

もし、私のように年齢的にギリギリで時間がない方はCSSに集中しましょう。CSSだけでも、面白いことはたくさんできます。

 

スポンサードリンク

 

最後に

未経験の28歳がWEBデザイナーを目指したとき、周りはネガティブな発言ばかりします。「いやー、未経験では厳しいでしょう」って言います。

でも、本当にWEBデザイナーになりたいなら、無視しましょう。忘れましょう。少なくとも、28歳ならまだ大丈夫。

とりあえず、飛び込んでみて下さい。

 

気づいたら、こんなに長文になってた!

 

焦らず頑張りましょう\(^o^)/

 

追記(2016年7月3日)

WEBデザイナーになって、約10ヶ月になりました。この期間働いてきた中で、いくつか追記したいことがあったので書いておきます。

 

デザインについて

WEBデザインをする上で、最低限知っておいて欲しい点をいくつかここに挙げておきます。

  • 配色。色の組み合わせ、WEBサイトやブランドイメージとカラーの関係。色の与える印象。
  • フォント。フォントの種類。適切なフォントの組み合わせ。行間、文字間。
  • サイトの目的とデザインの関係。
  • デザインのトレンド。
  • ユーザー目線に立ったデザイン。UI/UX。

この辺りは今後詳しく記事にして書いてみようと思います。

CSSについて

CSSを学ぶ時にまず意識して欲しいのが、要素を自分の思い通りに配置できるか。初心者はまずこれをしっかり勉強するべきだと思います。カッコいいデザインを学ぶ前に、「配置」することを学びましょう。

ボタンや画像を中央に配置する。1カラム、2カラム、3カラムのコーディングをささっとできるようにする。絶対配置、相対配置を理解する。このような基本はマスターしておきましょう。

できれば勉強しておいた方がいいこと

これらはちょっと難しいけど、仕事で使うこともあると思うので予め勉強しておいた方が有利になりそうなこと。

  • WordPress
  • PHP
  • Sass
  • Git

以上をできるようにしておけば、恐らく転職にはめちゃくちゃ有利だと思います(難しいなら無理して覚えなくてもOK)。てか、私もまだまだ勉強中。頑張ります。

 

WEBデザイナーの知識を活かしてはてなブログのテーマも作ってます。

これが結構人気のテーマなんですよ!

 

他にもこんな記事を書いてます。

超初心者のためのHTML・CSS入門講座

WEBデザイナーの副業とフリーランスの話 - NO TITLE

WEBデザイナーやエンジニアに特化した求人サイト・転職サービス - NO TITLE