初めまして！未経験から、現在はWeb制作のお仕事を在宅でしているママコーダー/Webデザイナーの、こまです！
15年間アパレルの販売員として接客からお店作りをしていた私が、上の子の出産をきっかけに仕事の仕方を考え在宅で子供中心の生活に切り替えるまでの過程を紹介したいと思います！
コロナ禍を経て在宅ワークを経験し、通勤時間が無駄！在宅で仕事をして子供との時間を増やしたい！このように考えている方は多いのではないでしょうか？
在宅の仕事って何があるのかな。特に何かできる資格もないし、今の仕事とは特に関係もない、よくSNSでWeb制作って出てくるけど、どうなんだろう。。
そもそもパソコンて検索するぐらいしか使ってないし、、学生の時は指一本で打つレベル。そんな私にもできる？
たくさん広告が出てきて、「怪しいのではないか？」「本当に稼げるの？」私も学習を始めるまでに半年くらい調べまくって悩みまくっていました！
私のように指一本で打つほどでなくとも、本当に稼ぐことができるかなど不安がある方は、少なからずいらっしゃるのではないでしょうか？そんなママの不安を少しでも払拭して、一歩踏み出せずにいる方の背中を押すことができたらいいなぁと思い、ブログを書くことにしました！
この記事はこんな人にオススメ!
・副業や新しいことを始めたいけど、何にしようか迷っている。
・パソコンを使った仕事はしたことがないけれど、Webプログラミング(コーディング)に興味がある。
・通勤時間を削減して子供との時間を持てる仕事がしたい。
・育休中の時間を有意義に過ごしたい。
完全未経験からコーディングを始めた私も、現在では継続してお仕事を頂きフリーランスとして子供との時間を中心に在宅で自分のペースで仕事をしています！
2021年の夏に一心発起して学習を始めた自分がいたから、今の生活があると思っています。悩んでいるママの力に少しでもなれたらと思います！！
どうしてコーディングがおすすめなの？
副業や新しいことに挑戦するなら、取りかかりやすい簡単なものからの方が失敗しないのでは？
確かに、データ入力やポイントサイトなど特に知識の習得の必要のないジャンルの仕事は、始めやすいですし、ハードルがすごく下がります。
しかし、ハードルが下がる分、ライバルはものすごく多くなって、やりたい人も多いので単価も下がります。
そこで、何か人とは違って少しハードルが高くとも実力勝負で戦える技術を身につけることは、仕事の単価も上がり収入も大きく変わってくるので、おすすめなんです！
コーディングは、訳の分からない文字が並んでて無理。。とアレルギーを起こす方もいるかもしれませんが、まさに、少しハードルは高いけれど学習をきちんとすれば、ライバルもそこまで多くなく、お仕事として確率するコーディング業務。
事実、私は育休明け復職して得たお給料よりも3倍近い月収を稼ぐことができ、継続してお仕事をいただけることで、多少の波はあれど安定して収入を得ることができています！
こんな理由から、コーディングを学習することは、0から何か始めようとしている方々にとって、とってもオススメなお仕事と言えるんです！
パソコンに不慣れの人でも、Web制作の技術をつけることは可能です！
まず何から始めたら良いのかな？
当時の私はWeb制作に関して知識が浅すぎて、どこかスクールに入らないとダメなものだと思っていました。
今となっては、Youtubeで沢山講座をUPしてくださっている方もいらっしゃいますし、もっとお金をかけずとも学習をする環境は沢山あるので、私の例はあくまでもほんの一例ですがご紹介していきたいと思います！
色々なスクールがSNSでも流れてくるけれど、一体どんなところがいいのだろう？
当時私は育休中で、子供も2歳。ちょうどプレスクールに入学して半年経ち、3歳のタイミングで復職するかを迷っている時期でした。
子供がスクールに行っている間に学習する時間を設けられたら1番効率が良いなと思い、「FammのママWebデザイン養成コース」を受講することに！
ママ向けの講座でツールの仕様方法など全くの初心者でも参加しやすそうで、講座終了後にココナラ(スキルをサービスとして提供することができるサイトです。)での活動のサポートもして頂けるというスクールというのが決めポイントでした！
実際Photoshopの使い方、VsCodeでのコーディングの仕方の基本的な部分を習得は出来ました！
しかし、、結果として講座自体3ヶ月と短い限られた時間のもので、本当に基礎中の基礎の部分だけしか習得できず、終了後もココナラでバナーを数件発注して頂ける練習にはなりましたが、それをきっかけにして案件に繋がることはありませんでした。。
このサポートの部分は効果を感じることはなかったので、もっと他のスクールで徹底して学べたほうが良かったと思いました。
スクール選びは難しかったなというのが、正直な私の感想です。
スクールの講座が終わったけど、全然自信がない。。こんなレベルで仕事もらえるのかな？
とにかく講座が終わった後、全然スキル面で自身が持てるような状況にはなっていませんでした。
そもそも、コーディングが学びたかったけれど、講座はデザインの方に注力されていたので、その点でも情報量が足りておらず、余計に不安になっていました。
しかし当時、「iSaraというサイトの模写をすると自分の技術レベルが分かる」という情報があったので、実際にトライしてみるも、もちろん全く手が動きませんでした。
そこで、もっと何か学習する方法はないかと情報を漁り、結果独学で学習をしようと決意！
そんな時に知ったのが、かれこれ参加させて頂いて2年以上経った営業支援コミュニティのはらさんです!
YouTubeやXの配信をされていて、当時(今もですが)ものすごく刺さる言葉を発信されていて沢山ヒントをもらったのを今でもよく覚えています。
中でも、こちらの動画は勇気をもらって、フリーランスへの道を決めるきっかけにもなった動画です！
独学での学習でもコツコツ積み上げれば実力はつきます！
動画で勇気はもらったけれど、実際にはどんなことをやったらいいんだろう？
とにかく、誰かこの人だ！と思う方のロードマップを1周すること。
それが1番の近道です。
不安が多いと思うので、あちこちに手を出しがちですが、とにかくロードマップに乗っかって邁進するのみ！
ここからは、私が営業に入るまで走り切ったロードマップを紹介したいと思います！！
01.まずは無料でHTMLやCSSに慣れる！知っていくことから！
まずは王道とも言える以下の2サイトの講座からスタートすると取りかかりやすいと思います！
・Progate
・ドットインストール(現在はほぼ全ての講座が月額制の費用がかかっていました。@2024.05.21)
個人的には、今も無料でできるProgateの方が、ステップアップの仕方がゲームっぽくて、手軽にスマホでもできるので、空き時間や通勤中やランチタイムにサクッと学習できるのもオススメのポイントです！
ここで危ないのが、完璧を求めて、2周も3周もやって留まること！！時間がもったいないので、1周やって、「なるほど！」くらいの理解度でいいので次に進みます。
この学習段階で声を大にして言いたいのは、「学生時代の暗記をするような方法」はNGということ！とにかく「知る・慣れる」ことが大切だと実感しました！
02.デザインを見て、実際に手を動かしてみる
Progateやドットインストールを一周しても私はまだまだ不安要素が拭えなかったので、人気のある「1冊ですべて身につくHTML & CSSとWebデザイン入門講座［第2版］ (１冊ですべて身につく)」という書籍で、実際に手を動かしながら学習を進めました！
この一冊で結構理解が深まります。
最初の段階では、デザインを見てこうやってコードを書こうとまではならなくて当然です！
「こういう時はこうやって書くことで、実装できるのか」と、知りながら吸収していくイメージ。
これを繰り返すことで、ある程度パターンがわかったり、応用が効くようになっていきます！知識の積み上げですね。
こちらの書籍以外に、無料でデザインを提供してくださっているサイトも、ご紹介しておきたいと思います！
上記の書籍完了後、実際に私も使わせていただき、本当に勉強になりました！
・Codejump 作って学ぶコーディング学習サイト
このサイトはステップアップ形式でコーディングができるようになっていて、徐々に複雑な実装ができるようになっています！CSSの練習や、jQueryの練習など、私が使わせて頂いていた時よりもさらに充実した内容になっているようです。
・CompCamp
このサイトは、営業支援コミュニティcodolifeでメンターをされている現役デザイナー兼コーダーであるまさひろさんの運営しているサイトです。デザインの参考にもなる素敵なデザインカンプの集まったサイトで、随時更新されています！
・PEGIN BLOGさん
コーディングの解説動画も用意してくださっているサイト。初学者のころ、実装方法が分からない時にググるとよくこのPENGIN BLOGさんのサイトに辿り着くことがありました。とてもわかりやすく丁寧に解説されているので、おすすめのサイトです。
上記のサイトのようなデザインカンプを使用して練習をする際には、
手を動かすための環境作りから！
⭐️エディターの準備→Visual Studio Codeが使いやすくてオススメです！
使用方法は、SKILL HUBさんのBLOGを参考に導入から設定まで見ることができます。
⭐️デザインカンプが作られているソフトがあると、開いて作業を始めるにもとてもスムーズです！
・Adobe XD
・Illustrator
・Photo Shop
・Figma
この4つは触ることが出来ないと、実案件の際には苦労してしまうので、デザインカンプからの実装練習がてら使用方法も習得して、実案件に備えましょう！！
この段階で、「どうやったらこうなるのか？」ということをひたすら考えて、わからなかったらググる！という癖づけがとっても大事です！
実案件でも、ググるシーンはたくさんあります。ググって自力で解決できる力は最初からつけておくと、後でとっても役に立ちます！
03. Webサイトに動きをつけてみる！
ここまでは、特に動き(アニメーション)には拘らずに、とにかく最初はデザイン通りの見え方にすることに特化して練習をすることが大事です！しかし、実案件では、アニメーションは1つはついてくるもの。理解はしておきたい部分です。
オススメなのは以下の講座！
Udemyの動画講座
色々な動画のコンテンツがある中で、このUdemyは年に何回もSALEを実施していて、60%OFF-80%OFFなど破格で購入することが出来ます！SALE期間中に講座を購入しておくのは手です。
中でも、私が購入したJavaScriptの人気講座、
「【2023年最新】【JavaScript＆CSS】ガチで学びたい人のためのWEB開発実践入門（フロントエンド編）」
は難しかったですが、一緒に手を動かしていくので理解が深まり、Sassも紹介してくれていたので、一緒に学べてオススメです。
作って身につく・仕組みがわかる書籍 jQuery標準デザイン講座
各LESSONが、考え方や設計を説明する「講義」と、実際にコードを書いて作っていく「実習」で構成されていて、こちらも手を動かせる参考書。
メニューやナビゲーション、UIパーツなど、Webサイトでよく使われているサンプル作例を自分で作りながら、「使える」知識が習得できる1冊です！
確かな力が身につくJavaScript「超」入門 第2版
基礎の基礎からJavaScriptを学習できて、こちらも手を動かしながら動きを見ることができるので、不慣れな初学者の時にも挫折してやり直したいなと思う時にも手に取るといい1冊です。
04.アニメーションに挑戦！
今アニメーションができるようになりたいと思ったら、この教材一択だと思います！
りょーすけさんの「【たった”10日間”でWEBアニメーション実装スキル習得】GSAPマスター講座」です。
JavaScriptの基礎的な知識は必要ですが、長いコードを書かずとも、感覚的にアニメーションを実装することができるGSAP。アニメーションが苦手で、実案件でいつも沼っていた私ですが、この講座を受けてアニメーションへの苦手意識は減って以前よりもスムーズに実装ができるようになりました！！
手放せない最高の教科書です！今でも感覚を忘れないように、見返したり、追加されるコンテンツを見て実装をしてみたりと案件に登場したら即応用できる内容が盛り込まれているので、ぜひ覗いてみてください。
05.WordPressを習得
HTML・CSS・jQuery・JavaScriptを一通り学習したら、WordPressを学習します！
実案件だと、静的サイトだけというものもありますが、WordPressつまり、お客様がブログやお知らせなど更新作業を管理しやすくすることができるCMSは技術として習得しておいて間違いがないものです！
沼ってしまって嫌になる前に、わかりやすい教材から学んでスッと習得するのが1番なので、ここでは私が巡り巡って出会えたわかりやすい教材をご紹介したいと思います。
アキユキさんのYouTubeチャンネル
色々な本や、動画コンテンツを見て学習しましたが、1番わかりやすくて理解ができたのは、unazukiのアキユキさんのYouTube動画です！有料で動画学習講座を購入されるのもありですが、まずは無料でYouTube動画から学習をするだけでもかなり理解は深まります！！
このサイトで学習したのちに、再びWordPress化までする練習用のカンプで実践すると、出来るようになったことはもちろん、理解できていないところも分かって、さらにしっかりと学習することができるようになるので、とにかく手を動かして進んでいきましょう！
私が実際に学習した流れのまとめ
「Progate」・「ドットインストール」で慣れる(知る)
↓
実際に手を動かす！
(Codejump・CompCamp・PENGIN BLOGなど、
無料でデザインを配布してくれていて、解説もあるサイトも！)
↓
アニメーション(jQueryやJavaScript)を学ぶ
(Udemyの動画講座・書籍)
↓
アニメーションを学ぶ！
【たった”10日間”でWEBアニメーション実装スキル習得】GSの一択！
↓
WordPressを学ぶ
(アキユキさんの動画)
一通り学習が終了した！でもどうやって実践したら。。
毎日コツコツ5時間以上は時間を捻出して学習して、一通りのロードマップも終えた後、
実装は少しづつ出来ているけれど、自分に何が足りないのか知りたい！！
そう思うようになりました。
そこで知ったのが、しょーごログことしょーごさん(@samuraibrass)から添削レビューを頂けるコーディング演習課題！デザインカンプからのコーディングを体験できて、WordPress化までを案件対応のように実装できるこちら。
営業の時に使用するポートフォリオにも掲載ができるので、実績のない駆け出しのころにはとてもありがたかったです！
現在(2024年5月)は私がやらせて頂いた頃よりもデザインもバージョンアップしていて、より一層自信がつく内容になっていそうです！
しょーごさんのブログからとnoteからと2箇所で少し特典が違う内容で販売されているので、そこは注意です！
とりあえず、初級編が4,000円ちょっとなので、こちらをやって添削をしてもらうのが初学者の方にはいいステップアップだと思うので、noteからの購入をオススメします！
自分で見積もりを作って、時間もしっかり計測して、提出！！目標の時間内に出来て無事OKの評価をもらえたーーー！！！
こうして、2021年9月から始まった学習期間は一旦2022年4月で区切りをつけることが出来ました！
もちろん、この後も継続して苦手な部分の学習や、新たな知識の習得は今でも継続して行っています！しかし、営業Phaseに入るまでの基本的な学習というのは、この段階で区切りをつけることが出来ました。
デザインの学習を始めたきっかけと学習方法
継続してお仕事をくださっている制作会社の方から、「デザインをやってみない？」と言われたところから始まりました。せっかくやらせて頂けるならと、コーディングの案件と並走させながらデザインの学習もしようとスタート!
PhotoShopの基本的な使い方は「FammママWatchデザイン講座」で学習していたので、制作会社さんで使用する指示のあったFigmaを使用してデザインの学習をスタート！実際にこの学習を行なったことで、他のクライアント様からもコーディングとデザインを丸っと請負い、単価もUP！2023年の3月には60万超えの収入を得ることが出来ました！
絵を描くのも下手で子供にも何を描いたの？と聞かれるくらいの私でも頑張れて、案件を頂くことが出来るようになったデザインの学習法をここからご紹介したいと思います！
01.無料学習サービスchot.design
chot.designは無料の学習サービスで、初学者の人が学ぶには取りかかりやすいものです。私も所属しているコミュニティのデザイナーさんにデザインの学習方を相談した際にオススメしてもらい、さくっと概念などの学習ができてよかったです！デザインも完璧な理解は難しいので、7割くらい「そうなんだ！」と思えれば先に進んで実際に手を動かした方が良いです。
02.なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉
こちらの書籍は有名なので、見たことがある人も
03.メグミさんの神フィードバック集
なんと1度フィードバックをしていただけて、4,980円で購入が出来るすごい講座があります!
具体的にデザインの実例を拝見できて、初心者さんがありがちなデザインのミスやNGデザイン例の解説を見ることが出来ます！
「自分でもこうやってたかも」と気付かされることの多いフィードバックばかり。添削して頂くことの大切さを感じると思います。
04.現役Webデザイナーが教える「デザトレ-独学コース-」
デザイントレーニング「デザトレ」というコミュニティーを運営されているちこさん(@Chiko256)が出されている教材。とにかくすごいボリュームです！
完全独学でやっている私なので、デザトレに入るには時間を取れそうにない、でもこれなら自分で時間を捻出して取り組めば出来る！と思い購入し、本当に何度も見返している教材です。
そして、添削を2回もして頂けるんです！
上記のメグミさんの教材もですが、添削をしてもらえることがいかに大事か、身に沁みて感じたので、しっかり学んで添削をしてもらう！
それが1番のデザイナーへの近道だと思います！！
デザトレのコミュニティに入るには費用が・・という方もいると思うので、こちらの教材でしっかり学習するだけでも十分頑張った分の実力はつくので、ぜひ覗いてみてください！
まとめ
長くなってしまいましたが、いかがでしたでしょうか？
3年前よりも今はもっともっと情報に溢れています。自分の性格や使える時間・お金としっかり相談をして、自分の生活を変えるべく挑んで欲しいと思います！
もちろん、月50万円稼ぐのは決して楽ではないです。時間の捻出仕方の工夫、自分の時間はほとんどない。コーディングもデザインも日々進化しているので、情報を拾っていかないと置いてかれます。
でも、「子供との時間を中心にした生活にする！」と決めて、それを実現しながら収入も得ることができる環境、これって最高だと思うんです！
自分の子供といられる時間は、6歳に幼稚園を卒園する時点で約3割終わっていると言われるそうです。(先日娘のプレスクールの副校長から聞いて知りました！)
その時期を仕事をしっかりしていても、大切に過ごすことができる環境を作ることができる。もし私と同じような気持ちでいるお母さんたちがいたら、一緒に頑張りたいなと思います！
そして、私が経験してきたことが、誰かの役にたつ情報となったら幸いです！
最後まで読んでいただき、ありがとうございました！