【ゼロから月30万】Webデザイン独学ロードマップ ▶︎

【ゼロからのWebデザイン】独学で稼ぐ4ステップ

【本記事を読むことによる目標到達点】

 

  • Webデザイナーとして現場で働けるスキルが身に付く
  • Web制作案件を受注して月収30万円以上の継続的な収入が手に入る

当メディアのWebデザイン独学ロードマップは、どの有料商材よりも、どの書籍よりもわかりやすく再現性の高い内容を目指して作成し改善を繰り返しております。もちろん無料で全てを公開しています。初心者の方はSTEP1から、中・上級者の方はSTEP4からご覧いただくことをおすすめします。

 

この記事の信頼性(筆者はこんな人)

  • 現役Webデザイナーが執筆
  • 継続して月収80万円超のフリーランス
  • 完全未経験から独学でWeb制作スキルを習得
  • TwitterにてWeb制作のメンター経験多数(→@twinzvlog_yk
  • 認定ランサー(ランサーズ最高ランク)

 

以下Twitterでの本記事の評判

 

 

 


この記事を読んでいる時点であなたは相当な熱意と行動力をお持ちなので、確実にスキルを習得できると断言します。独学だろうが未経験だろうが関係ありません。あとはやるだけです。

前置きはここまでにして、早速ロードマップを見ていきましょう!

 

【STEP1】Webデザインを学ぶ

まずはじめにWebデザインの入門としてAdobeツール(Photoshop・Illustrator・Adobe XD・Dreamweaver)の使い方や豆知識を解説していきます。AdobeツールはWeb制作の現場でも当たり前に使われているので必ずマスターしましょう。全て無料で学べます。

 

【もう迷わない】PhotoshopとIllustratorの違い|3分でわかる 【わかりやすい】Photoshopのインストール方法を図解|3分で完了 【もう迷わない】PhotoshopとElementsの違い|3分でわかる 【もう迷わない】Photoshopとクリスタの違い|3分でわかる 【現役Webデザイナー監修】Photoshopテクニック集9選 【失敗しない】Adobe XD『プラン選び』と『インストール方法』 【絶対に損しない】Adobe XDの料金プランを徹底比較 | 有料プラン 【無料配布】Adobe XD『UIキット』の使い方を完全攻略 | テンプレート 【知らないと損する】Adobe製品の『料金プラン』を徹底比較 | Webデザイン Adobe公式チュートリアルで無料学習ロードマップ|Webデザイン 【完全無料】Adobe Photoshop公式チュートリアルで完全攻略 【完全無料】Adobe イラストレーター公式チュートリアルでスキル習得 【絶対に損しない】Adobe XD公式チュートリアルで無料学習|Adobe XD Trail 【完全無料】Adobe Dreamweaver公式チュートリアルで完全攻略

 

【STEP2】コーディングを学ぶ

次にWebデザイナーに必要なコーディングを学んでいきます。ここでは筆者が実際に使用していた『Udemy』というサービスの動画教材を使って学習していただきます。知っている方は多いかもしれませんが、Udemy講座はセール中に購入することでスクール並の内容を1,000~2,000円ほどで学ぶことができます。この機会に必ずマスターしましょう。

 

『Udemyを選んでよかった』と感じた神サポート5選まとめ 【新規受講生割引】Udemy無料会員登録で人気講座が2000円以下 【挫折しない】Udemy『Bootstrap/HTML/CSS』おすすめ講座5選 【本当は教えたくない】Udemy『HTML/CSS/JavaScript』おすすめ講座5選 【もう失敗しない】Udemy『Webデザイン』おすすめ講座7選|独学向け 【もう失敗しない】Udemy『WordPress/PHP』おすすめ講座3選

 

【STEP3】ポートフォリオを作る

次にポートフォリオを作っていきます。ポートフォリオとは簡単にいうと実績を示すための作品集です。
自分はこれだけのことができるんだぞ!とアピールする際に使います。
もっと言うと、ポートフォリオはクライアントに自分のスキルをアピールするために重要な役割を持っています。例えば、Web制作会社にメール営業をする際にも優れたポートフォリオがあれば返信率や契約率が数倍も変わってきます。逆にいうとポートフォリオを持っていない場合、あなたがどれだけ高いスキルを持っていようが、どれだけ魅力的な人物だろうと『判断材料がない』ことで見向きもされないのでこの機会に必ず作りましょう。

 

【裏ワザ】WordPressテーマを無料で自作!ポートフォリオにも最適 【無料】WordPressポートフォリオサイトの作り方 【節約】ポートフォリオおすすめレンタルサーバーと公開方法|WordPress編 【就活で差がつく】未経験からポートフォリオサイトの作り方|学生必見 【あっと言わせる】Photoshopポートフォリオの作り方大全 【失敗しない】ポートフォリオサイトの作り方|イラストレーター向け

 

【STEP4】案件を獲得する

最後のステップでは案件の獲得方法を解説していきます。これまでの学習を活かして稼ぐためのステップです。筆者が実際にやってきた営業方法やその失敗談などを全て共有しているのでお役に立つはずです。ちなみにこの章で紹介する内容は有料記事として出す予定だったため、筆者が最も力を込めた『他にはない』濃厚で深みのある内容となっています。ぜひ最後までご覧ください。

 

(随時更新していきます。)

 

【営業は不要】Web制作フリーランスが案件に困らない方法 【Webデザイナーが解説】クラウドテックの評判・口コミ・登録方法 【3ヶ月で10万稼ぐ】本物のWebデザイナー独学ロードマップ

 

MEMO
残りの記事も執筆中なのでお持ちください。

 

【関連記事】

この章ではWebデザインで使える豆知識や素材をご紹介します。ぜひ学習に使ってみてください。

 

【厳選13選】2021年Udemyおすすめ『ランキング』|スキル別に講座紹介 【Qiitaでバズった】CSS画像背景『回転』アニメーション3選 【もう迷わない】ナビゲーションバーCSSデザインまとめ10選 スライダーマテリアルデザインをコピペで!CSSアニメーション3選【コード解説付】 【失敗しない】CSSでハンバーガーメニューデザイン3選【コピペのみ】 hover×transitionのCSSボタンエフェクト9選【コピペOK】