未経験からWebデザイナーに転職した僕が実行した超具体的な方法

未経験からWebデザイン・制作会社に転職した僕が、Webデザイナーになるための具体的な方法を紹介していきたいと思います。

Webデザイナー、クリエイターという職種は、人気の仕事のひとつで憧れを抱ている人が多いです。そんな僕も憧れていた人間の1人です。そこで未経験からWebデザイナーになった僕が転職するために実行したことや、勉強方法を具体的に紹介していきたいと思います。

27歳の未経験がWebデザイナーに転職

僕は27歳のときにWebデザインや制作を行っている会社へ転職することが出来ました。Web制作会社で働く上で必要になるHTML・CSS、Illustrator、Photoshopの３つの必須スキルを習得し、ポートフォリオサイトを作成しました。

では、どのように勉強しスキルを習得したのかを順に紹介していきます。

HTML・CSSを習得する

Webデザイン・制作会社はWebサイトの運営や、すでにあるWebサイトの更新作業の仕事が大量にあります。そのため、HTML・CSSのスキルを習得しておく必要があります。逆にいうとHTML・CSSをマスターしておくと採用される確率が上がります。

僕の場合はまず、勉強になるWebサイト・動画を見ながらHTML・CSSをおおまかに理解し、わからなかったところを参考書を見ながら覚えていく。そして最後は資格を取得するところまでやりました。（資格は取得していなくても問題ありません。あった方が良いというレベルです）

学習できるWebサイト

現在ではWeb上にたくさんの良質な情報が転がっています。Webの情報だけでもWebサイトを構築出来る人もいるくらいです。

わからないところはWebで調べて出来てしまう人と、参考書を使って勉強する人と2パターンの人がいると思いますがどちらでも問題ありません。ちなみに僕は参考書でさらっと勉強してから、わからないところはWebで調べるという感じです。

動画

動画に関しては勉強という感じではなく、空き時間などに「あ、なるほど」という感じで見るだけでも、とても勉強になりますのでぜひ見てください。

HTML・CSSおすすめ参考書籍 

HTML5&CSS3標準デザイン講座

Web制作者のためのCSS設計の教科書 モダンWeb開発に欠かせない「修正しやすいCSS」の設計手法

Webサイトや動画で大まかに学習した後は参考書を利用して基礎から覚えていくといいと思います。

一通りCSSを理解している人はわかると思いますが、CSSはうまく設計しないと複雑になりがちです。「Web制作者のためのCSS設計の教科書」CSSを設計するためにの強雨箇所で、更新しやすいCSSを教えてれる大変良い参考書です。この本は向上心のあるWebデザイナーなら必ず持っている有名な書籍です。

HTML・CSSの資格

Web業界において、資格はそれほど重要ではありませんが、未経験者の場合は資格を保有しているとそれなりに有利に働きます。実績がないためスキルを証明することが出来ませんので、資格を持っていると最低限のスキルがあること証明することが可能です。

• Web資格なら「HTML5プロフェッショナル認定試験」公式サイト
• Webクリエイター能力認定試験│資格検定のサーティファイ│あなたのスキルアップを応援します|

HTML5プロフェッショナル認定試験 レベル1 対策テキスト＆問題集 (Mynavi Examination Library)

HTTPの教科書

HTMLの主な資格は上記2つになりますが、HTML5の方がおすすめです。Level1、Level2に分かれていますが、Level1だけでも保有していると強みとなるでしょう。またLevel2の資格も保有しているとなお良いですが、JavaScriptが含まれるため難易度がそれなりに高くなります。

僕自身もHTML5のLevel1の資格を保有していますが、HTML5プロフェッショナルLevel1対策テキスト＆問題集だけで合格するには少し足りず（http関連の内容が薄い）、HTTPの教科書を読んでおくことをおすすめします。この2つのテキストが出来ればほぼ問題なく合格すると思います。 

Illustrator・Photoshopを習得する

Webのデザインは、ほぼIllustratorとPhotoshopで行います。デザイナーにもよりますが、最近ではIllustratorでデザインをする人の方が多いです。理由は一度作ったデザインの拡大や縮小が簡単に出来るからです。スマホ端末が普及してからは様々なデバイス（スマホ、タブレット、PC）に対応したデザインが必要であるため、拡大・縮小などを頻繁に行います。そのため写真や画像などはPhotoshopで加工し、実際のデザインはIllustratorで行うというわけです。

体験版を利用して無料ダウンロード

IllustratorとPhotoshopはAdobe社の有料ソフトであるため、パソコンへインストールするのにお金が発生してしまいます。一般的には「Adobe Creative Cloud」というAdobe製品ならなんでも使用出来るパックがありますが月額4,980円という費用がかかってしまい、少々お値段がかかってしまいます。

しかし、意外と知らない人が多いようですが、Creative Cloudは試用期間の30日間は無料で使用することができますので、Illustrator、Photoshop共に1ヶ月は無料使用することが出来るのです。

学習できるサイト

PhotoshopVIP

PhotoshopVIP - Photoshopの無料素材や、フリーフォント、最新ニュース、チュートリアルをいち早くお届けするデザインブログ

名前のとおりPhotoshopに関する記事を中心に、Illustrator、フォント、HTML/CSSなどデザイン関連で参考になる記事がとても多いブログです。Photoshopのチュートリアル系記事も豊富なため、初心者の頃は良く勉強させてもらいました。

Illustrator Mania

Illustrator Mania - Illustratorの基本的な使い方・チュートリアルなどを紹介！

illustratorに関する、Tips、チュートリアル、素材たくさん紹介されているブログです。Illustratorを使う方はブクマ必須となるおすすめコンテンツです。

参考書籍

世界一わかりやすいIllustrator 操作とデザインの教科書 (世界一わかりやすい教科書)

世界一わかりやすいPhotoshop 操作とデザインの教科書 (世界一わかりやすい教科書)

IllustratorやPhotoshopは、Web上だけで勉強するのは難しいため書籍を購入することをおすすめ致します。いくつか参考書を持っていますが下記の書籍が大変わかりやすくおすすめ致します。

Illustrator・Photoshopの資格

HTML同様に資格はそれほど重要ではありませんが、ないよりは有利になりますので一応載せておきます。ちなみに僕はPhotoshopのみ保有しています。

• Illustrator®（イラストレーター）クリエイター能力認定試験│資格検定のサーティファイ│あなたのスキルアップを応援します|
• Photoshop®（フォトショップ）クリエイター能力試験│資格検定のサーティファイ│あなたのスキルアップを応援します|

資格を取得する場合、どちらもエキスパートの方が良いでしょう。Photoshopのエキスパートの試験を受けたときは、時間ギリギリだったのを覚えています。意外と実技の問題が難しく時間がかかってしまいました。実務でもそうですが操作を早く出来るようになることも重要です。

デザインスキルを上げるためにはWebサイトの模写

クオリティが高いWebサイトを見つけては、ひたすら模写をするとデザインスキルが上達します。育てようとしてくれるWeb制作会社は、模写を勉強するように言われたりします。

下記、素敵なWebデザインまとめサイトから好きなデザインを選ぶと良いでしょう。

Webデザインギャラリーサイト

ポートフォリオサイトを作成する

ここで勉強してきた成果を発揮するために作成する、ポートフォリオサイトの説明です。実はこのポートフォリオこそが1番重要になってきます。資格を取得するよりも大切です。

ポートフォリオは採用するための基準となり、ポートフォリオがない時点で落としてしまう会社もたくさんあります。僕が面接官だとしてもポートフォリオがない場合は、HTML5、Illustratorエキスパート、Photoshopエキスパートを保有していて、かつWebサイト構築の課題を出してある程度できることを証明してもらって、はじめて採用をさせていただきます。

それくらい未経験から転職するにはポートフォリオの有無は重要になってきます。

ポートフォリオサイトとは

自己紹介やスキルのアピールするためのWebサイトです。主に自分でデザインした作品や作ったものを掲載します。架空のお店のHPを作ってもいいですし、すでにあるお店をブランディングして勝手にリニューアルしたものでもいいと思います。（名前や写真をアップする際は注意が必要です）

参考サイト

ポートフォリオは見やすく作成する必要があります。（見づらいとあまり印象が良くないため）ポートフォリオに関してはテンプレートを参考にすると良いでしょう。もしくはテンプレートをそのまま使用しても良いかと思います。

採用率を高める３つの方法

１．JavaScript（jQuery）、CSS3

最近のWebサイトは、写真のスライドだったりボタンエフェクトだったり動きのある要素が必要不可欠です。JavaScriptはプログラミングのためHTMLにくらべると習得難易度が少し高いですが、習得しておくとプラスアルファとしての価値はものすごくあがります。

僕の場合は、デザインに自身がなかったため、jQueryとCSS3覚えて、それらをたくさん使ったWebサイトを作りポートフォリオへ掲載しました。それが採用につながったと後から聞かされました。デザインもしますがコーディングの方が得意で、今ではPHPを使った仕事が1番多いです。

２．デザイン・イラストスキル

Webデザイナーの中にはHTMLやCSSのスキルがあまりない方も多いです。というのもデザインスキルやイラストのスキルがものすごく高い方はコーディングは一切せず、デザインオンリーの方も多いです。

僕が入社したWeb制作会社もデザインチームとコーディングチームに分かれていました。そのため、デザインやイラストに特化しているというのも一つの武器になりプラスアルファになります。

３．勉強会に参加する

Web業界は頻繁に勉強会を開いている地域が多いです。勉強会に積極的に参加して、人脈をつくりましょう。

初心者向けの勉強会も多く、気軽に参加できる勉強会もたくさんあります。Web業界は常に人手不足なので、よく「良い人いたら紹介して」という言葉を言い合ったりしています。

そのため知り合いから紹介してもらったりすることが頻繁にありますので、人脈を広げておくことは大切なわけです。（けっこうWeb業界の人は顔を広げたい人が多いので、1人で参加しても気軽に話しかけてくれたりしますよ）

さいごに

いかがでしたでしょうか。実際に僕が未経験からWebデザイナーに転職したときに実行した方法です。覚えることはたくさんありますが、Webデザイナーはやりがいのある仕事だと思います。目指してる方はぜひ参考にしてみてください。