未経験からWebデザイナーなるには?現役デザイナーが解説します

未経験からwebデザイナーなるには?現役デザイナーが解説します

27歳の時に異業種からwebデザイナーにキャリアチェンジしたさなです。

この記事では、未経験からWebデザイナーになるためのスキル習得から転職までで役立ちそうなことをまとめました。

筆者

未経験から即フリーランスを目指す人もいますが、今回は自分の体験をもとにwebデザイナーとして会社への転職を目指す人向けに書いていきます。

筆者について

6年目webデザイナー
  • 新卒でメーカーに就職し、4年後退職
  • スクールに通ってwebデザインの勉強(約3ヶ月)
  • 通学中に広告会社でwebデザイナーのアルバイトをはじめ、半年で退職
  • web制作会社にwebデザイナーとして転職、3年後退職
  • フリーランスでwebデザインとライティング←現在
\ この記事はこんな人におすすめ /
  • 未経験からwebデザイナーに転職するまでの方法を知りたい人
  • webデザイナーにキャリアチェンジした人の体験談が知りたい人

webデザイナーがどんな仕事かイメージがわかない人は、こちらも↓。

Contents

webデザイナーに必要なスキルは?

そもそもwebサイトってどんな手順で作るの?

筆者

まずはデザインの画像データを作ってから、それをもとにインターネット上で見られるようにコーディングをしていくよ!

ほんとはもっと色々な工程を経てwebサイトができるけど簡単に言うとそんな感じ。

※コーディング…コンピューターが分かる言語(HTML・CSS・JavaScriptなど)を使って

web上で見られるようにデザインを表現すること。

じゃあwebデザイナーになるには、画像を作るスキルとコーディングの知識が必要ってこと?

筆者

そう、最低限必要なのはその2つ。

あとデザインをするためには、webデザインの基本的ルールについての知識もあると良いよ◎。下で詳しく説明するね。

webデザイナーになるために必要な3つのスキル
  • グラフィックソフトを使えること
  • HTML・CSS・JavaScriptの知識
  • webデザインの基本ルールへの理解

グラフィックソフトを使えること

Adobe Creative Cloud
出典:Adobe Creative Cloud

web制作の現場ではAdobephotoshopIllustratorXDを使用することが多いです。

なので、これらを使いこなせる知識が必要。

それぞれのツールの特徴は下記の通りです。

Photoshop

画像を合成したり、いらないものを消したり、明るさや鮮やかさを変えたりなど、画像編集に関するたくさんの機能を持つツール。

画像編集だけでなくweb制作の場で、webのワイヤーフレーム(構成案)、デザインカンプ(デザイン案)の制作に使用されることが多いです。

Illustrator

イラストや図形、ロゴなどを制作するためのツール。

主に、雑誌や書籍、広告など印刷物のデータ制作に使用されます。

XD

webサイトのプロトタイプ(試作)を検証するのに便利なツール。

アニメーションなどの動きをつけることができるので、実際にwebサイトが公開された時のスクロールやページ移動などの動作を確認すること可能です。

またそれをコーダーやプログラマーなど、他の制作担当者と共有する機能も優れています。

photoshopと同様に、主にwebサイトのワイヤーフレームやデザインカンプの制作に使用され、web制作の場では定番になってきています。

デザイン制作も動きの確認もできるならXDだけ使えればいいんじゃないの?

筆者

写真の加工とかパーツの細かなデザインとかphotoshopとIllustratorにしかできないこともあるから、この 3つは一通り使える方がいいよ◎。

そうなんだ!勉強すればちゃんと使いこなせるようになるのかな?
心配だなー。。。

筆者

3つとも多機能だから、最初から完璧に使いこなすのは難しいよ。
とりあえず最低限を勉強して、転職してからそこで必要なツールを深く使いこなせるようになれば大丈夫。

6年webデザイナーをしてるけど、まだまだ新たな発見をすることがあるよ!

なるほど、とりあえず3つとも基礎を勉強すればいいんだね。

HTML・CSS・JavaScriptの知識

デザインカンプが完成したら、HTML・CSS・JavaScriptを使ってインターネット上で見られるように作り込んでいきます。

デザインによってはインターネット上で再現するのが難しい場合もあるので、コーディングのことも考えてデザインをする必要があります。

自分で1からコーディングできるようになるのがベストですが、最初は見たらなんとなく分かる程度の知識でもOKです。

筆者

webデザイナーの役割は、会社やそのプロジェクトによってまちまちで、
コーディングまでできるwebデザイナーを求められることも多くあります。

なので、はじめはコーディングができなくても、働きながら勉強していくことでどんどん仕事の幅が広がります。

MEMO

webデザイナーの勉強をはじめると、自分がデザインが得意かコーディングが得意かなんとなくわかってくると思います。

両方できるに越したことはないですが、まずは得意な方を深く勉強するのが個人的にはおすすめです。

現役webデザイナーの中もデザインをメインでやっている人、コーディングをメインでやっている人がいます。

webデザインの基本ルールへの理解

色使いや余白の取り方、フォント選び、レイアウトの仕方、構成要素の選定など見やすく使いやすいデザインにはある程度ルールがあります

デザインをする時にはそれを念頭におきながらデザインしていくとより良いwebデザインに。

スクールや本で勉強したり、時間がある時に色々なwebサイトを見て良いデザインがあったら細かく見てみると良いと思います。

おすすめ書籍

色やフォント、レイアウトなど、デザインするってこうゆうことなんだというのがスッと入ってきて読みやすかったです。

webデザイナーになるための勉強方法

並べられたメガネ、キーボード、筆記用具

webデザイナーになるために必要なスキルはわかったけど、どこでどうやって勉強すればいいの?

筆者

おもな方法は下の4つだよ。

webデザイナーになるための勉強方法
  • スクールに通う
  • オンライン講座を受講する
  • ハロートレーニングに通う
  • 独学

色々な方法がありますが、途中で挫折しないためには自分に合った勉強方法を探すことが大切です。

それぞれについて書いていくので、迷っている方は参考にしてみてください。

スクールに通う

スクールに通うメリットは、効率的に必要なスキルが習得できたりスクールによっては転職サポートも受けられるところ。

一緒に受講している仲間もいるのでモチベーションが保ちやすいです。

筆者

私もスクール出身です。

全部で約3ヶ月の講座を受講しました。
DTP(印刷物のデザイン)とWebデザインの両方について学べるコースで、前半は平日ほぼ毎日、午前中から夕方まで授業を受けて、後半は週2くらい夜間のみの授業でした。( 7年前なのでうろ覚えなのですが、確かこんな感じのコースだと思います。)

後半に空き時間ができたので、未経験OKでwebデザイナーとして採用してくれるところを探してアルバイトをしながら通っていました。

筆者

話がそれますが、調べてみたら私が通っていたスクールは今はもうなくなっていました。。。良いスクールだったのに残念。

オンライン講座を受講する

オンライン講座の良いところはなんといっても自宅で受けられるという点。

家の近くに良いスクールがなかったり、子育て中のママだったりスクール通いが難しい方でも効率的にスキルが習得できます。

スクールとオンライン講座の受講料は?

スクールってオンライン含めてどのくらいの受講料がかかるの?

筆者

受講期間やカリキュラムによるけど、大体15万円〜50万円くらいの相場感だよ。

そんなに!!結構勇気のいる金額だね。。。

筆者

そうだよね!

当時いきなり受講申し込みをするのは怖かったから、いくつか無料体験とか無料カウンセリングとかに行って、自分に合いそうなところを受講することにしたよ。

筆者

あと、一般教育訓練給付金っていう国から受講料の最大20%(上限10万円)を給付してもらえる制度があって、その対象講座を開講してる民間のスクールもあるんだ。

給付条件があるからそれを満たしてるなら、教育訓練給付金対象の講座を選ぶのもおすすめ。

私もその制度を利用したよ。

筆者

同じスクールの講座でも、給付金対象の講座とそうじゃない講座があるので、無料相談の時などに要確認です!

ハロートレーニング(離職者支援訓練・求職者支援訓練)に通う

ハロートレーニングは厚生労働省が管理する公的な職業訓練制度です。

ハロートレーニングの魅力は、テキスト代のみで受講料無料で通うことができること。

ただ、タイミングや地域によってはwebデザインのトレーニングが開校していない場合もあります。

受講するためには、ハローワークで申し込み、面接・筆記試験に合格する必要があります。

厚生労働省 ハロートレーニング

無料でちゃんと使える知識が身につくの?

筆者

実際に私が働いていた会社でもハロートレーニング出身のwebデザイナーさんやコーダーさんが何人かいたよ。

地域や訓練校によると思うけど、みんなしっかり業務をこなしていたから、普通のスクールとかオンライン講座と同じように基礎が学べると思うよ。

独学

独学じゃ無理なの?

筆者

スクールの講座を受けるよりも効率は悪くなりがちだけど、独学でwebデザイナーになる人もいるから自分でしっかり勉強できれば大丈夫だよ。

自分の好きな時間にコストを抑えて勉強できるのが独学の良いところ。

webデザインについては書籍やインターネット上に公開されている情報で勉強することも可能です。

ただ、モチベーションが保ちにくかったり、何を勉強していいかわからず遠回りになってしまうことも。

独学でも何を勉強したらいいか目安になるものがあると学びやすいと思います。

結局webデザイナーになるにはどの方法がおすすめ?

どの方法が良いかは、人によってまちまちです。

たとえばスクールやオンラインスクールがおすすめかなと思うのは、このような人↓。

  • できるだけ早くWebデザイナーに転職したい。
  • 就職も視野に入れた勉強がしたい。

そして独学がおすすめな人は、下記の人です。

  • 仕事や家事の合間に勉強したい。
  • 今すぐではなくて、ゆくゆくはwebデザイナーとして働いてみたい。
  • webデザイナーの仕事がどんなものか知りたい。
筆者

1番大切なのは、自分に合った方法で勉強してくことだと思います。

未経験webデザイナーが就職するための準備

ある程度スキルが身に付いたら転職の準備をしていきます。

その準備がこちら。

webデザイナーに転職するための準備
  • ポートフォリオを作る
  • 転職サイトに登録する

作品・ポートフォリオを作る

就職活動の場ではほぼ作品やポートフォリオ(自分の作品をwebサイトか紙にまとめたもの)の提出を求められます。

採用する側の気持ちになって考えてみると、言葉や文章で「こんなことができます」「これが得意です」と言われるよりも実際の作品を見る方が説得力がありますよね。

なので、webデザイナーになるための知識がある程度身に付いたら、作品・ポートフォリオ作りに取りかかります。

ポートフォリオがなくても作品を見せるだけで採用されることもありますが、ポートフォリオの提出が必須のところもありますし、作品を個別に見せるよりも一覧になっている方がわかりやすいです。

また、魅力的なポートフォリオはそれ自体がアピールできる作品になるので、ぜひ準備したいものです。

ポートフォリオを作るのって難しそう。。。

筆者

スクール・オンライン講座・ハロートレーニングだと、カリキュラムにポートフォリオの制作が含まれていることがあるよ。

講師が作品・ポートフォリオ作りをサポートしてくれるところもあるから、そうゆうところを選ぶのも一つの手だよ!

転職サイトに登録する

就職をサポートしてくれるスクールもありますが、可能性を広げるために自分でも登録しておくと良いと思います。

web専門の転職エージェントはたくさんあるみたいだから、色々探してみてね!

評判◎のWebクリエイター向け求人情報サイト

就職後のキャリアは?

PCを使う女性と男性

転職する会社によって違いがあると思いますので、ここでは私の体験談をお話しします。

まず最初に就業したのは、広告を取り扱っている会社です。

そこでの仕事は、広告を出す時に必要なバナーやLP(ランディングページ)の制作でした。

たまに必要があるときに作れる人がいれば良いという感じでデザイナーは私1人、デザインの仕事がなくて事務的なことをやることもありました。

しばらく働かせてもらっているうちに、もっと制作をメインに行っていて先輩デザイナーさんがいるところで働きたいと思い、web制作会社に転職しました。

未経験だと最初から希望の仕事やお給料の会社に入るのはなかなか難しいのが現実です。

最初はある程度覚悟しておく必要がありますが、実務経験を積んでスキルアップすると転職・フリーランスなど自分の理想の働き方に近づけていけると思います。

webデザイナーになってよかった?

筆者

最初はできないことが多すぎて大変だったけど、働いているうちにどんどんスキルアップしてるのがわかったし、自分次第で柔軟に働き方を変えていけるから思い切って転職してよかったよ。

まとめ

長くなりましたので、webデザイナーになるために必要なスキルから学習方法、転職準備についてもう一度まとめます。

webデザイナーになるために必要なスキル

  1. グラフィックソフトを使えること
  2. HTML・CSS・JavaScriptの知識
  3. webデザインの基本ルールへの理解

webデザイナーになるための勉強方法

  1. スクールに通う
  2. オンライン講座を受講する
  3. ハロートレーニングに通う
  4. 独学

未経験webデザイナーが就職するための準備

  1. ポートフォリオを作る
  2. 転職サイトに登録する
筆者

最後までお付き合いいただき、ありがとうございました。
この記事がwebデザイナーへの転職が気になっている方のお役に立てたら嬉しいです。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
Contents