こんにちは! Webクリエイタースクール 「デジタルハリウッドSTUDIO by LIG」(通称:デジLIG)運営本部スタッフの天です!
弊スクールの個別説明会にご参加される方は、Webデザインを学ぶ方法を模索している方が多数です。
通学にするのか、オンラインスクールなのか、はたまた独学で学習できないか……と、いくつかの学習方法を検討されています。そもそも、未経験からWebデザイナーってなれるものなのでしょうか……?
結論からお伝えすると……なれます。
ただし、自分に合う学習方法や環境を整え、学習時間を作る必要があります。
この記事では、「未経験からWebデザイナーになるため方法」を紹介するとともに、現役のWebデザイナーに勉強法も聞いてきました。自分に合う最適な方法を見つける参考にしてもらえると嬉しいです!
- デザインの世界に飛び込んでみませんか?
- 「デジタルハリウッドSTUDIO by LIG」では未経験から6ヶ月で「現場レベルの」Webデザイナーを目指せます。働きながら学ぶ社会人も多数!
現役で活躍するプロから学べ、面接対策や就職斡旋など永続的な支援も受けることができます。
「デジタルハリウッドSTUDIO by LIG」の詳細をみてみる
目次
Webデザイナーになるには?
Webデザイナーになるには、必要なスキルや経験を身に付けていく必要があります。
必要な資格などはなく、年齢も重要視されないので、求められるスキルさえあれば未経験でもWebデザイナーになれます。スキルを習得するまでにかかる期間は3ヶ月〜半年ほど。
社会人をしながら学ぶ方でも目安として半年〜1年弱くらいで必要なスキルを習得しています。
そもそもWebデザイナーとはどんな仕事?
Webデザイナーとは、クライアント(企業/個人)から依頼を受け、Webサイトのデザインを制作する職業です。
お客様の要望をヒアリングし、Webサイトの方向性、構成、ユーザーの使いやすさを考えデザインを制作します。
Webデザイナーの仕事を具体的に解説
Webデザイナーの仕事は、クライアントの課題を解決するデザインを制作することです。業務範囲は以下のように多岐に渡ります。
Webサイトの構成と設計を考える
Webサイト全体の構成・レイアウト・イメージを決定します。Webサイトを利用するユーザーの目線に立ち、Webサイトを訪れたお客様にとって使いやすいUI(ユーザーインターフェイス)とUX(ユーザーエクスペリエンス)を設計し、ユーザーが求める顧客体験を実現させます。
Webサイト・Webページのデザイン
Adobe Photoshop、Adobe IllustratorといったグラフィックデザインソフトやAdobe XDというデザインツールを使用してデザインを制作します。
コーディング
HTML(エイチティーエムエル)、CSS(カスケーディングスタイルシート)、JavaScript(ジャバスクリプト)といったコンピューターの言語を用いてWebサイトを構築します。
Webサイト制作の流れ
クライアントからWebサイト制作の依頼を受け、公開に至るまでには以下の工程があります。
- 要件を定義する
- ワイヤーフレームを作る
- デザインを制作する
- コーディングをする
要件を定義する
要件定義とはWebサイトを何のために制作するのかを明確にする工程です。Webサイト制作によってどのような課題を解決していくのかををまとめます。
ワイヤーフレームを作る
要件定義を元にWebサイト全体のレイアウトやコンテンツの構成を考え、ワイヤフレーム(Webサイトの設計図)を作ります。
デザインを制作する
Adobe Photoshop、Adobe Illustrator、Adobe XDを使用し、Webサイトの全体のデザインカンプ(デザインの完成見本)というデザインデータを制作します。その際はパソコンだけでなく、スマートフォンから見たデザイン・ビジュアルも合わせて考えていきます。
コーディングをする
Webサイトを構築するためにコンピューターの言語を使いコーディングを行います。HTMLで文字や画像を記述し、CSSでWebサイトのレイアウト(見た目)を整えます。Webサイトに動きをつけるためには、JavaScriptというプログラミング言語を用いていきます。デザインされたものをコーディングすることで、Webサイトとして使用できるようになります。
コーディングは、テキストエディターやAdobe DreamweaverというWebサイト制作のソフトを使って行います。
Webデザイナーの働き方
Webデザイナーとしての働き方はさまざまです。制作会社・事業会社で正社員として働く場合は、安定した収入を得ながら、リモートワークやフレックスタイム制を活用した柔軟な働き方ができます。
派遣社員として働く場合は、有期雇用になりますが、専門職のため時給も高く、残業に関しても規定で守られているため、仕事のオンオフがつけやすいです。また実務経験を重ねてスキルを磨いた後に、副業やフリーランスのWebデザイナーとして活躍する人数も増加傾向にあります。それぞれの働き方について解説します。
制作会社のWebデザイナー
お客様(他の会社)から依頼を受け、Webサイト・アプリの制作や運用を行うWebデザイナーのことです。外部企業がクライアントになるため多種多様な業界・種類のデザインに携わる特徴があり、幅広い知識・技術・経験を身に付けていくことができます。Webデザイナーとしてデザインの技術やスキルアップを高めたいと考えている方におすすめです。
事業会社のWebデザイナー(インハウスデザイナー)
自社のWebサイト・アプリなどの制作や運用をする社内Webデザイナーのことです。自社サービスの制作を行うため、長期的により良いものを育てていくことができます。
クライアントが外部ではないため、納期の短縮や突発的な作業が起きづらく、仕事が調整しやすい特徴があります。また、インハウスデザイナーは、デザインだけでなくサイト運営全体に携わることが多いため、ディレクションを始め、クリエイティブの周辺業務(マーケティング、開発、デバッグなど)を通して、視野を広げてスキルを高めることができる働き方です。
フリーランスのWebデザイナー
組織に所属せず独立し、Webサイト制作や運用を行うWebデザイナーのことです。制作会社や事業会社のWebデザイナーと異なり、自由度の高い働き方を実現できます。
一方で会社員ではないため、安定した収入を得るための実力・実績が求められるでしょう。Webデザイナーとして経験を積み、スキルを高め、計画的に独立することがおすすめです。
仕事を獲得する際は人脈やフリーランス向けの案件紹介サイト、クラウドソーシングなどを活用してお仕事を得ていく必要があります。知識・技術・経験を身に付け、自分の裁量で仕事をしていきたい方におすすめです。
Webデザイナーのキャリアプランについて
WebデザイナーのキャリアプランはWebディレクター、UI・UXデザイナー、アートディレクターの3つに大別されます。それぞれのキャリアについて紹介していきます。
Webディレクター
Webディレクターは、Web制作におけるプロジェクト全体の進行管理者です。クライアントの意向をヒアリングし、納期までに制作を終えられるようなプロジェクトの進捗管理が仕事です。
Webデザイナー、プログラマーといったメンバーのマネジメント業務を行いながら、Web制作全般を管理します。制作会社・事業会社のWebデザイナーとして現場で経験を重ねていくことで、Webディレクターに必要なスキルを磨いていくことができるでしょう。
Webディレクターには、クライアントの要望をヒアリングし、制作メンバーをまとめていくコミュニケーション力が求められます。
UI・UXデザイナー
UIデザイナーはユーザーが使いやすいようにWebサイトやアプリの構成・ビジュアル・操作性をデザインする仕事です。UXデザイナーは、ユーザーにとっての価値ある体験(使いやすさや楽しさ)をデザインをするためにユーザーのニーズを分析し戦略を立てる仕事です。
UI・UXデザイナーになるには、ユーザー目線でデザインや設定を考えるスキルや、分析能力が求められます。
アートディレクター
アートディレクターはデザインの責任者としてデザインの方向性を決定し、デザインに関わるクリエイターたちを指揮する仕事。
アートディレクターになるには、クリエイティブの制作全般に関する専門知識とスキルが必要です。クライアントの要望を的確に掴むためのコミュニケーションスキル、ディレクションスキルが求められるため、Webデザイナー・Webディレクターとして実務経験が求められます。
6ヶ月で現場に通用するレベルのスキルを得れる「デジLIG」の詳細・無料説明会予約はこちらから
未経験からWebデザイナーになるための具体的な方法4選
未経験からWebデザイナーになるためには、必要なスキル(知識と技術)を身に付けていく必要があります。
ここでは現役デザイナーに聞いた「未経験からWebデザイナーになるための方法4選」と、そのメリット・デメリットを紹介していきます。
①独学でWebデザイナーになる
メリット |
|
---|---|
デメリット |
|
独学のポイント
専門書籍や動画教材を活用し、わからないことはインターネットで検索しながら学習を進めます。
Web制作に必要なAdobeのデザインソフトのチュートリアルを使用したり、YouTube動画でも多くの投稿があるため、比較的コストをかけずに学習が可能です。
独学でWebデザイナーになりたい方はこちらの記事も併せてご覧ください。 【実体験】独学でWebデザイナーになったWebデザイン勉強法
独学で学んだ現役デザイナーのコメント
独学は学習に費用がかからない点と、Webに関する知識や技術だけではなく、検索力や自己解決能力が身につくという点がメリットでした。
逆にデメリットと感じたのは、最短の学習方法や勉強に行き詰まったときに解決策を教えてくれる人がいないというところでしょうか。僕が学習していた時代と比べると現在は情報が多い時代なので当てはまるかはわかりませんが、学習にはとにかく時間がかかりました。
独学のため一緒に学習する仲間もおらず情報交換をすることも難しかったですね。
デジLIG 中里トレーナー
独学で大変なこともたくさんあったけれど自分には合っていました!
私は自分の好きなものを作るために勉強を頑張っていたので、好きなものが作れるようになることでモチベーションが上がりました。勉強もやりたいときに進められるのがメリットですね。
でも独学が全員にとっては正解じゃないと思います。就職支援などのサポートがないため、自分に合う会社がわからず、遠回りしてしまう可能性があります。あとは背中を押してくれる仲間がいないのでモチベーションの維持には工夫が必要ですね。
LIGデザイナー おまめ
②Webデザインスクール・専門学校に通ってWebデザイナーになる
メリット |
|
---|---|
デメリット |
|
Webスクールのポイント
最も一般的な方法であり、Webスクールのカリキュラムを活用して、Webデザイナーに必要なスキルを効率よく身に付けることが可能です。
学習期間はスクールによって異なり、1〜3ヶ月程度の短期集中から1年以上と期間も様々です。学習に使える時間をあらかじめ計算し、自分のライフスタイルに合ったスクールを検討していく必要があります。
学習を進める中でわからないことは、講師に対面で質問や相談できるのが大きな特徴です。スクールごとに学生同士のコミュニティや就職・転職支援サービスなどが充実しているところが多くあります。
💡おすすめのWebデザインスクール11校29コースをこちらでまとめています!
ぜひ自分に合ったスクールを見つけてくださいね!
スクールで学んだ現役デザイナーのコメント
Webデザインスクールを活用する学習のメリットは、なんといっても講師であるトレーナー陣からフィードバックをもらえることです!
初学者の多くがつまずくポイントは、自分が作ったデザインが本当に良いものになっているかどうかがわからないというところです。スキル上達の最短の近道は、講師からたくさんフィードバックをもらうこと。
デメリットは学習のためにまとまったお金が必要なことですね。でも、経験や時間を「買う」と考えたら、決して高くないと思います。
デジLIG 相原トレーナー
自分のサイトを形にできることが何より嬉しかったです。動画教材で無理なくステップアップしていけるので、モチベーションを保ったまま学習を続けられました。
また、現役のWebデザイナーの方々からお話を聞けるため、実際の働き方のイメージを持つこともできました。スクール時代のご縁で、卒業後に講師の方とお仕事をすることもあります。
キツかったのは、学費が高いこと。最高の施設・環境が揃っているので、その分しっかり元を取って欲しいと思います……!
デジLIG 石上トレーナー
③オンラインスクールでWebデザイナーになる
メリット |
|
---|---|
デメリット |
|
オンラインスクールのポイント
スクールが提供するWeb教材・動画教材を活用し学習を進め、スキルを身に付けていきます。オンライン学習で好きな時間に学習を進めることができるため、隙間時間を有効活用した効率的が学習が可能。オンラインスクールも学習期間・費用も様々なため、自分に合ったスクール選びが必要です。
講師とはオンライン上のコミュニケーションツールを活用しながら、決まった時間に質問ができます。オンラインセミナーやオンラインイベントが企画されているスクールも多いようです。
オンラインスクールに興味がある方はこちらの記事もおすすめです。 オンラインのWebデザインスクール11選!【2023年最新】
④未経験可の求人に応募し現場で学ぶ
メリット |
|
---|---|
デメリット |
|
未経験から現場で学ぶポイント
企業の社内研修を経て、Webデザイナーとしてスキルアップを目指します。Web制作の現場でスキルを磨きながら実務経験を積むことができることが大きな魅力ですが、求人数が少ないことが欠点。
中には未経験であっても「スクール卒であること」が条件となっているところもあります。
未経験可の求人からWebデザイナーになった現役デザイナー
求人数は少ないですが、未経験可の求人に応募し現場で実践的に学ぶことは、Webデザイナーの近道かなと思ってます! 私はインターンを活用して企業に飛び込んで働きながらWebデザインを学びました。
最初はわからないことだらけで辛い時期もあるかもしれませんが、自分のペースではなく、現場のペースで「勉強+仕事」をしなければならないので、グングン成長を感じることができました。
また、本や座学では学べないことを吸収できます。何より最前線で働く先輩Webデザイナーが身近にいることは、とっても刺激にもなります!
私は幸運なことにすごく素敵な環境で学ぶことができました。しかし場所によっては、未経験者に任せるのは雑用ばかりで、まったくWebデザイナーとして成長できない環境になってしまう場合などもあります。環境選びにはかなり注意が必要だと思います……!
LIGデザイナー まいまい
Webデザイナーの将来性は?
Web業界はテクノロジーの進化とともに拡大と成長を続けています。
令和4年に厚生労働省がおこなった「労働経済動向調査」では、情報通信業の労働者が不足気味であると判断されており、令和4年 内閣府・財務省「法人企業景気予測調査(BSI)」では情報通信業界の景気上昇も予測されています。
Webデザイナーとしてクライアントの要望を満たしていくためにコミュニケーション力や企画力を高め、Web業界のトレンドや最新技術のキャッチアップを行い、Webデザインに求められる知識や技術の変化に合わせたスキルアップを図ることが重要です。

Webデザイナーは将来性がない?市場動向と今後必要なスキルを解説
Webデザイナーの年収は?
Webデザイナー平均年収は約449万円となっています。全体の平均からすると高く、特に東京都は平均で493万円の高水準です。
パソコンがあればどこでも仕事ができる職種でもあるため、地方に生活の拠点を置きながら、東京の会社で仕事をしている人も多いです。
参考リンク:求人ボックス
Webデザイナーに求められる必要なスキル
ここではWebデザイナーに求められるスキルを紹介します。
デザインの基礎知識
デザインに関する基本的な知識を学び身に付ける必要があります。
レイアウト・配色・フォントといったデザインの知識を始め、最新のWebデザインのトレンドをキャッチアップすることが重要です。
グラフィックツールやソフトの操作スキル
Webデザイナーとして活躍するには、Adobe Illustrator、Adobe Photoshopといったグラフィックソフトの操作方法を身に付け、使いこなしていくことが必要です。
コーディングやプログラミングスキル
Webサイト構成するHTML・CSSのコーディングスキルと動きを表現するJavaScriptのプログラミングスキルが必要です。
コミュニケーションスキル
クライアントの要望をヒアリングするためにコミュニケーション力が必要です。
現役デザイナーにWebデザイナーに求められる役割とスキルをインタビューした記事はこちら。 【Webデザイナーになりたいアナタへ】LIGの現役Webデザイナーに聞く!本当に求められる役割やスキルとは
Webデザイナーになるために必要な準備は?
未経験からWebデザイナー目指すために必要なものを紹介します。
パソコンを用意する
Webデザインを行う上で、パソコンは必要不可欠なアイテムです。パソコンを選ぶ際は自分が行う作業に対してどこまでの性能が必要なのかを考え、予算を踏まえて検討しましょう。Webデザインの勉強をするにあたって、パソコンの購入を考えている場合、どのようなものがいいかを現役のWebデザイナーに質問してみました。
パソコンはMacかWindowsか?
業界的にパソコンはMacを使用しているデザイナーが多いです。Mac同士であればデータの送受信やりとりの手間が省けるメリットがありますが、必ずMacでなければらないというわけではありません。
パソコンのスペックに関して
メモリやストレージの大きさによって作業効率が大きく変わります。メモリは16GB程あればAdobeのソフトなどを開いたときでも、パッと画像が表示されたりと動作にストレスが少ないです。
ストレージは、256GB以上のものがおすすめです。128GBではAdobeのソフトを入れるだけで重くなってしまいますが、512GBあるとかなり余裕ができます。
Macの場合のインチ数は?
MacBookは15インチがおすすめです。Webデザインは縦長になる場合が多く、作業をしていると画面の縦幅が広いパソコンのほうが良いなと思うようになることがあります。
13インチのMacBookは、パソコン本体を持ち歩くことが多く本体の重さが気になる人におすすめです。また、自宅にサブモニターを置き、デュアルディスプレイ(2画面)にすることで効率よく作業することができます。サブモニターは、1〜2万円程度のものでもひとまずは十分です。
Windowsの場合の注意点は?
CPUはCorei5以上、メモリは16GB以上のものが望ましいです。Corei7・Corei9など数字が大きいほど性能が良くなる分価格も上がります。
デザインソフト・ツール
Adobe Photoshop
写真の編集や合成に用いる画像編集ソフトです。多くのWeb制作会社で使用されており、デザインカンプなどを作る際に使用されます。点の集まりでできた「ビットマップ」データを扱うソフトです。
Adobe Illustrator
Webサイトに使用されるロゴ・ボタン・アイコンやイラストパーツ作成に使用するソフトです。画像を拡大・縮小しても画質が劣化しない「ベクター」データを扱うソフトです。
Adobe XD
近年デザインの制作現場で使用されいる新しいデザインツールです。直感的な操作でWebサイトやアプリなどのUIデザインを設計するソフトです。コードなしでデザインのプロトタイプが作成でき、制作チームのメンバーに簡単に共有・共同作業ができ、効率的にデザインをブラッシュアップできます。
テキストエディタ
テキストファイルを作成・編集するためのテキストエディタです。HTMLやCSSなどを組み合わせ自由にデザインをすることができます。
Adobe社が提供するあらゆるWebデザイン・アプリデザインのためのソフトDreamweaver以外に、Windowsのメモ帳や、Macのテキストエディットなど、無料使えるテキストエディタもあるので、自分に合ったものを見つけるのがおすすめです。
まずは独学で学習をはじめてみよう!
興味はある。でも本当に自分に合っているのかわからない……。というそこのあなたへ、まずは独学で学習を初めてみてはどうでしょう? 学習を進める中でWebデザインの面白さと私がよく受講生さんにおすすめしている方法や、サイト、本などを詳細します!
おすすめの学習方法
いろんなデザインに触れる
まずはインターネット上でWebサイトを調べ、様々なWebデザインに触れてみましょう。この後に紹介させていただきますが、デザイン性の高いWebサイトがまとめられたWebサイトや、デザインを学ぶ書籍は数え切れないほどあります。自分の用途に合ったサイトまとめ集や、読み進めやすい本を見つけてみてください。
また街中にもデザインは溢れています。ポスター、看板、フリーペーパーなどを見た際には、なぜそのフォントなのか? なぜその配色なのか? を考えていくことでデザイン力を磨くトレーニングになります。
SNSの活用
良いデザインを発信している人をフォローし、毎日最新のデザイン情報を収集しましょう。
自身の学びを発信すると、同じ目標に向かう人と出会うきっかけにもなります。「#Webデザイン勉強中」などのハッシュタクで、一緒に頑張る仲間と出会うこともあります。
うまくいけば、知り合ったデザイナーさんに自分の作品のレビューをいただくような機会もあるので、ぜひ積極的に活用していきましょう。
バナートレース・サイトトレース
Webデザインの勉強していると、バナートレースやサイトトレースという言葉が出てきます。トレースは「模写・真似」するといものです。トレースを通して、IllustratorやPhotoshopの操作方法の理解を深めることができます。
さらにスキルを高めていくには、トレースの制限時間を決め時間内にどこまで作り込めるかに挑戦をしてみたり、デザインを分析しながら、なぜそのフォント・レイアウト・配色・写真なのか? を考えてトレースを行い、考察結果を記録していくことをおすすめします。
おすすめのデザインサイト
1guu.jp(イチグウ)
1guu.jp(イチグウ)は優れたWebサイトのデザインリンク集です。両サイドにあるバーから「国別、業種別」にWebサイトを絞り込むことができます。
I/O 3000
I/O 3000では国内外問わず、Webデザインの参考になるサイトがまとめられており、カテゴリー別、色別にも調べることが可能です。Webデザインのトレンドを掴むのにおすすめのサイトです。
Pinterestはお気に入りの画像や動画を発見し保存・整理・ブックマーク・シェアできるサービスです。多くのデザイナーさんがPinterestを活用しています! 気になるデザインをピン(保存)することができ、ボード(フォルダ)で整理整頓できるので、お気に入りのデザインをストックしておくことができます。
おすすめのデザイン書籍
ノンデザイナーズ・デザインブック
デザイナーの基本を学べる20年間愛されている名書です。デザインを勉強するなら一度は読むことをおすすめします。デザインの基本原則を踏まえて、レイアウトやフォントのお話しなど、デザインの基礎を押さえられる1冊です。
なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉
こちらも長らく愛されているデザイン本です。デザインに必要な考え方を図やイラストを通して目で見て楽しめる形でわかりやすく学習することができます。
ソシム株式会社さんの本
3冊一気にご紹介します。
それぞれのテーマに沿ったデザインサンプルが、左側にNGのデザイン、右側にOKデザインが見開きで紹介されています。いまいちさんの苦悩の声と、いまいちさんの悩みにたいする、しゅっと先輩によるアドバイスにもほっこりします。たくさんのフツーのデザインとおしゃれなデザインを比較できるのもこの本の魅力です。
まとめ
今回の記事では、未経験からWebデザイナーになりたいと考えている方に向けて、Webデザイナーの具体的なお仕事内容をはじめ、働き方、キャリア、Webデザイナーの将来性をご紹介しました。
社会の変化とともにリモートワーク・在宅ワークなどの働き方にも多様性が求められています。働き方を見つめ直し、専門性を高めるために手に職をつけたい、柔軟な働き方をしたいと考える方は増えているでしょう。
これからWebデザイナーになりたいと興味をお持ちの方は、自分に合う学習方法を見つけ、実際に行動してみてください。行動していくことが知識と技術を習得する最短ルートだと思います!
もしスクールに通うのが合っていると感じた方は、デジLIGの無料説明会にてお待ちしてます! まずはお気軽にご相談ください!