未経験からWeb制作で稼げるようになるまで

未経験から副業でWebデザイナーになりたい!初期費用は何円かかる?

未経験からWeb制作で稼げるようになるまで

これからWebサイト制作の勉強をして、副業Webデザイナーになりたい!初期費用って何円くらい必要なのかな?

という方のために、実際に未経験から在宅Webデザイナーになった私が、初期費用として何にどれくらいお金をかけたのかをお伝えしていきます。

あなたのスタートアップの参考にして頂ければ幸いです。

それでは早速行ってみましょう!

①副業Webデザイナーになるための初期費用 ~機材編~

Webデザイナーが使う機材は以下になります。

  • パソコン
  • パソコン周辺機器(マウス、キーボード)
  • ディスプレイ
  • インターネット接続機器

Webサイト制作は、自宅にパソコンとインターネット環境さえ有れば、追加費用無しで始めることが出来ます。

私も以前から所有していたデスクトップパソコン(第8世代 core i5搭載)とインターネット環境を使用しています。

出費その① ディスプレイ(縦置き対応)

元々ディスプレイは1台持っていましたが、もう一台追加で購入しました。ディスプレイ2台(デュアルディスプレイ)で作業を行った方が圧倒的に効率が良いからです。

Webサイトを作る時は以下の①、②の作業を数えきれないほど繰り返すので、かなりのタイムロスになります。

  1. テキストエディタでコードを打つ
  2. コードを打った結果をブラウザで確認する

いちいちエディタとブラウザを切り替えてると日が暮れちゃうよ…

ということでこれを解決するべく、9,800円で中古のDELL製24インチ縦置き対応ディスプレイを購入しました。

右のディプレイでコードを打った結果が左のディスプレイに反映される(散らかっててすみまっせん!)

 

スマホレイアウトを作るときは縦置きの方が見やすい

 

場合によっては縦のディスプレイでコーディング

ご覧のように、縦置き対応のディスプレイがあると非常に捗ります。

機材費用合計: ¥9,800円(税抜)

②副業Webデザイナーになるための初期費用 ~ソフトウェア編~

Web制作案件で使うソフトウェアは、ザックリと以下になります。

  • テキストエディタ
  • ブラウザ
  • FTPソフト
  • 取引先との連絡用ツール(skype、chatworkなど)
  • 画像編集ソフト(Photoshop、illustrator)

コードを入力するためのテキストエディタや、完成したWebサイトのデータをアップロードするためのツール(FTPソフト)などは、高性能な物が無料で手に入ります。

そしてご存知の通り、ブラウザやskypeなどの連絡用ツールも無料で手に入りますね。

※以下の記事で無料で手に入るおすすめのソフトをご紹介しています。

【未経験からのWeb制作】3ステップで制作環境を作ろう!

【FTP?アップロード?】Web制作初心者にもわかるように解説

出費その② Adobeの画像編集ソフト

画像編集ソフト、Photoshop(フォトショップ)やillustrator(イラストレーター)は有料です。しかもWebサイト制作案件を受注するために必須のソフトになります。

なぜ必須なのかについてはAdobeソフトを購入しなければWeb制作案件が受注できない理由の記事で詳しく解説していますが、理由をザックリ言うとWebサイトのデザインデータを正しく表示するためです。

クライアントから「このデザイン通りに作って下さい」と言われて受け取ったデザインデータを正しく表示できなかったら…依頼通りのWebサイトを作ることが出来ません。

自分でデザインをしない場合でもPhotoshopやillustratorが必要なんだ…。

費用はPhotoshop単体プランで月額2,480円(12ヵ月契約時)illustrator単体プランも同じく月額2,480円(12ヵ月契約時)です

Adobe Creative Cloud(通称AdobeCC)という、フォトショップ・イラストレーターを含む全30種類以上のソフトが使える月額5,680円のプランも有ります。

た…高い!

写真やイラストのプロにも使われているハイスペックなソフトなので、その分値段も高めに設定されていますね…。

こればっかりは無料でダウンロードできるソフトでは代替品が無いのです。(私が初案件を受注した時、無料の代替ソフトで挑んで大失敗をしました…。)

ちなみに私はヒューマンアカデミー通信講座『たのまな』でAdobeCC(12ヶ月契約)のセットを購入しました。
キャンペーン中だったので通常の購入方法よりもガッツリ安く¥39,346円(月額約3,279円)で買えました。

(2020.01.17追記)
2020年1月14日~2020年3月31日の期間でキャンペーンが再開していました!
詳しくは以下の記事でご覧ください。

AdobeCC+通信講座購入で学割適用!「たのまな」を買ってみた
「たのまな」でAdobeCCと通信講座をセットで購入すると学割が効くので、他の方法で購入するのと比べて半額近い値段で買う事が出来ます。「在宅ワークや副業でAdobeソフト(Adobe Creative Cloud )が必要になりそう!」「でも値段が高すぎて購入する勇気が出ない!」こんな方にオススメです!

ソフトウェア費用合計: ¥39,346円(税抜)

なお、学生さんであればいつでも学割が適用されるので、コンプリートプラン12ヶ月(一括払い)を23,760円で購入する事が出来ます。羨ましすぎる!

③副業Webデザイナーになるための初期費用 ~教材編~

私は以下の教材を利用しました。

  • プロゲート
  • 書籍
  • 偉大な先人たちのブログ

プロゲートは環境構築不要でお手軽にコーディングの勉強が出来るサービスです。
詳しくは以下の記事で紹介していますが、未経験の人が入門するには最適の教材だと思います。

プロゲートだけで未経験のプログラマでも稼げる様になるのか
プログラミング初心者の心強い味方「プロゲート(Progate)」。今回は、実際に約半年間プロゲートを使用している私が、「プロゲートで勉強するだけで未経験プログラマでも稼げる様になるのか」についてお話していきます。

入門者向けのレッスンは無料で受けられますが、中級レベル以上は月額980円の有料会員限定レッスンになります。

出費その③ プロゲート有料会員、書籍購入

私は合計3ヶ月間有料会員でしたので、2,940円の出費

更に以下の書籍を2,508円で購入。(良書なのでこちらも超オススメです)

あとは作業が行き詰まった時に、Webデザイナーの先輩方が投稿してくださった技術系のブログ記事を読み漁って勉強しました。これはもちろん出費ゼロ!

教材費用合計: ¥5,448円(税抜)

④副業Webデザイナーになるための初期費用 ~ドメインレンタル代編~

クライアントに私たちのWebデザイナーとしての実力を見て貰うために、ポートフォリオと呼ばれる作品集を作成します。

実績が無い人はどんなポートフォリオサイトを作れば良い?【Webデザイン】の記事で詳しく解説していますが、ポートフォリオはサーバーへアップロードをして公開するのが良いです。

そのためにサーバーとドメインのレンタル代が掛かりますが、私の場合は当ブログ用に既にサーバーをレンタルしていたので、ドメイン代(12ヶ月レンタル)¥760(税抜)のみの出費でした。

合計金額発表

ということで、私が未経験からWebデザイナーのお仕事を受注して稼げる様になるまでに掛かった初期費用は…

合計: ¥52,354円(税抜)でした!

未経験の人は初期費用が掛からないHTML、CSSの勉強から!

ご覧頂いたように、HTMLとCSSの勉強なら数千円以内で始める事が出来ます。

実際の業務内容も7~8割はHTMLとCSSを使ってコードを打つことになるので、初めから無理してフォトショップやイラストレーターを買う必要は無いです!

まずは手軽にHTML、CSSの勉強を開始し、「続けられそう!」と判断したタイミングで画像編集ソフトを導入するという流れが、最も無理なく進められる方法だと考えています。

おわりに

これから副業でお小遣いを稼ぎたいのに「初期費用掛かるのか…」と残念に思った人もいるかもしれませんね。笑

でも、Webサイト制作案件を受注すればすぐに回収できるような金額です。

画像編集ソフトの操作スキルも同時に磨けられれば、Webデザイナーとしての仕事の幅が広がり、単価アップも目指せますし、挑戦してみる価値は大いにあると思いますよ!

副業Webデザイナーとしてバリバリ稼いでいる未来の自分を想像して、「今回はやるぞ!」と覚悟を決めてみませんか?

初期費用を少しでも安く済ませたいという方に、以下の記事もおすすめです。

AdobeCC+通信講座購入で学割適用!「たのまな」を買ってみた
「たのまな」でAdobeCCと通信講座をセットで購入すると学割が効くので、他の方法で購入するのと比べて半額近い値段で買う事が出来ます。「在宅ワークや副業でAdobeソフト(Adobe Creative Cloud )が必要になりそう!」「でも値段が高すぎて購入する勇気が出ない!」こんな方にオススメです!

それではまた!

トップページへ戻る