学習の進め方

torikumuでは大きく分けて、デザインとコーディングの学習ができます。
まずは基礎からスタートし、最終的にはオリジナルの制作物を作成します。

どこから進めていただいても構いませんが、基本がしっかりできると応用までスムーズに進めるので、焦らずに学習を進めてください。

この記事でお伝えすること

STEP1|学習の全体像とロードマップを知る
学習時間の目安・4〜5ヶ月分の進め方

STEP2|学習の進め方のコツ
動画学習の4ステップ・レビューの受け方

STEP3|学習を記録する
学習日報の使い方・記録を残すメリット

STEP4|制作物を公開するときの注意
スクール課題の明記・トレース・ベーシック認証

STEP5|イベント・アーカイブを活用する
参加方法・おすすめアーカイブ

補足の説明を追加しました。あわせてご覧ください。

トリペン先生

授業コースの方はこちらもみてね!

トリペン先生

仕事にする目的の人はこちらも見てくださいね!

あわせて読みたい
Web系のスキルで仕事にするためには? 目的別のロードマップを知ろう 進め方やスピードは人それぞれですが、目的別の大まかな道筋があります。そちらについて説明していますので、参考にしてください! 手に...
記事の内容

STEP1|学習の全体像とロードマップを知る

学習をはじめる前に、よくいただく疑問にお答えしておきます。
気になる項目をクリックすると開きます。

デザインとコーディングは、どっちも学習が必要なのか?

Webサイト制作を1人で完結するためには、必要になります。
ただ向き不向きがあったり、学習時間の確保も必然的に多くなるため、どちらも触れてみて、できることから進めていくほうがいいと感じています。

両方を同時に学習して問題ない人もいれば、難しい場合もあります。
まずは自分で体験してみてください!

でも、両方できた方がいいですよね?

トリペン先生

それは、あなたが何をしていきたいか?によるかなと思います。
全部作れるようになって関わっていきたいなら必要だし、コーディングはしたくないなら、その分2倍くらいデザインの学習に時間を使えばいいと思いますよ!

全部を完璧にできないといけないのか?

これも気にされる方が多いのですが、仕事において完璧はありませんよね。
学習の段階でも完璧を目指す必要はありません。

torikumuも1つずつ進めて飛ばしてはいけない、と思ってしまう方もいますが、そんなことはありません。飛ばしてもいいし、興味のある部分をメインに進めてもいいです。

まずは、最終的に制作物が完成すればいいのです。
初めから全てを器用にこなすことは難しいので、自分ができることを理解して、できる範囲で制作物を完成させていってください。そうしていくうちに、自然と前に進んでいるはずです。

学習時間の目安

・週に10〜15時間
・月に40時間以上
・トータル300〜350時間を6ヶ月ほど


このくらいのペースで進められるスケジュールが理想です。
ただ難しい場合もあると思うので、あくまでも目安としてお考えください。

torikumuの学習ロードマップ

ロードマップは、あくまでも一般的な目安です。
おおよその期間を、事前に把握しておきましょう!
転職と副業など目的で少し変わりますが、身に付けることは大体同じになります。

下のタブで「デザインメイン」「コーディングメイン」を切り替えられます。

STEP
【1ヶ月目】ツール操作・デザイン基礎知識・バナーデザイン

まずは、ツール操作に慣れていきましょう!
普段のPC操作とは少し変わるので、PCに慣れていない人も、まずは触りながら体験するのが習得が早いです。

ポイント

完璧を目指すのではなく、完成を目指して慣れることを考えて進めてみましょう!
スポーツと同じなので、反復すれば自然と身につきます。

あわせて読みたい
あわせて読みたい
あわせて読みたい
あわせて読みたい
STEP
【2ヶ月目】課題にチャレンジ!

デザインなら、広告バナー・チラシ・名刺など。

ひとまず簡単なものから、手を動かして制作していくことをおすすめします。
トレースも練習になるので、試してみましょう!

STEP
【3ヶ月目】Webデザインの学習

3ヶ月目になる頃には、コツコツ続けていれば操作に関しては、多少つまずきがあっても挫折することはないでしょう。

デザインはランディングページや、WebデザインなどWebで見れるデザインに取り掛かってみるといいですね。

あわせて読みたい
STEP
【4ヶ月目】オリジナルデザインを作成しよう

実践と制作物が必要になりますので、どんどん制作していきましょう!
ポートフォリオにも掲載するように考えて、課題に取り組んでください。

オリジナルと言っても、最初は簡単なものでもOKです。
これまでスクール課題を中心に取り掛かることが多かったため、0から作る経験がありません。スキルがまだまだでも、ここで一度0から作成する経験をしておくといいでしょう。

◎受講生さんでよくあるパターン
・自分のサイトの作成(ポートフォリオ)
・知人のサイトの作成
・知り合いの会社のサイトの作成
・過去に働いていた職場のサイト作成
など

過去の受講生様の制作物
https://www.notion.so/startkit/1bd47a3520e349d898b065a447302f82
※就職が決まると削除する方も多いので、参考程度にご覧ください

この時点での個人制作は、コンテンツにこだわらなくても大丈夫です。
まずは自身で興味のある、作りやすいテーマで作成してください。

STEP2|学習の進め方のコツ

オンラインでも学習はできますが、どうしても動画を見るだけになりやすく、自分のペースすぎてダラダラしてしまうことがあります
分かったつもりや、勉強した雰囲気だけを感じることはないでしょうか
そういった場合、このように学習を区切るといいですよ。

動画学習のながれ

① 動画やテキストなどで、まずは全体像を見る(ながし見程度でもOK)
② 教材と一緒に手を動かしてみる
③ 何も見ずに自分だけでチャレンジする
④ 別パターンも試してみる(オリジナル)
※課題に少し変化を加える程度でも力が付きます

この順番で学習すると時間がかかるように見えますが、長期的に考えると実は効率が良くなります
1つ1つをしっかりと身に付けていけば、忘れて学び直すことも少なくなるからです。

ちなみに、いちばん大事なのは③④の部分です。
『自分で』というところが非常に重要です。用意されたものだけこなしていても、成長はすぐに止まってしまいます。

課題は提出してレビューを受ける

教材だけの学習では、実践的なことが身につきにくいです。
そのため、レビュー(添削)を受けましょう!

① 依頼(課題) ⇒ ② レビュー ⇒ ③ ブラッシュアップ
この流れがいいですね。
レビューも大事ですが、その後のブラッシュアップが一番してほしいことです。

トリペン先生

必須依頼はなるべく提出して、早くレベルアップしていきましょう!

プロ目線でのレビューもいいですが、一般目線での意見や印象なども聞くと勉強になります。

トリペン先生

制作の正解はないので、様々なシーンに対応するためにも、いろいろな人に見ていただくことをオススメします。
考え方は色々あるので、フィードバックを通じて自分の考えも固まってくるでしょう。

STEP3|学習を記録する

これから学習していくうえで、ぜひ学習の記録をつけてください!
あとで振り返るときにも役立ちますが、何より自分の自信になります。

学習記録って、やっぱりつけたほうがいいのかな?

トリペン先生

もちろんです!
自分の振り返りももちろんですが、どのくらい学習継続ができたのか?は、転職の場合だとアピールポイントになりますよ。
目的が転職でなくても、記録することがモチベーション維持に繋がります。

学習日報の使い方

画面の右下にある「今日の学び」をクリックしましょう!

入力画面とSNS共有・記録の確認方法(画像つき)

クリックすると以下のような画面が出ます。内容や時間を記録しましょう!

入力してボタンをクリックすると、SNSで共有できるようになっています。

マイページで学習記録の確認

マイページから学習記録の確認ができます。
一覧ページで、過去の記録を修正・削除できます。

記録を貯めるメリット(学習貯金)

学習日報を貯めるメリットと、貯めない場合のデメリットを、あるとき〜、無いとき〜の551方式で解説します!

学習記録がないとき〜

① 制作物以外に見せられるものがない(過程・経験・思考)
② 学習の記録がないので、振り返りが出来ない
③ 記録がないので学習改善ができない
④ なにをどう頑張ったのか?を共有する証拠がない

学習記録があるとき〜

① 制作物以外の頑張りも評価されやすい
② 学習の記録が残るので、振り返りやすい
③ 振り返りができるので、改善がしやすく学習効率が上がる
④ 転職のときに有利(見せることが前提)

トリペン先生

学習日報のように資産になるようなものは、早い段階から積み立てていきましょう。
あとでやろうと考えていると、結局やらないことが多いので、最初からやるスタンスでいくといいかもしれません。

記録を残す・まとめる場所

学習日報に加えて、外に向けて残せる場所があるとさらに効果的です。
外の世界に発信することは、あなたと誰かをつなげる架け橋になる可能性があります。Webを通じて仕事につながったり、人のつながりが増えたりします。

いざやろう!と思っても普段していないことは、いきなりできません
そのため勉強段階から、Web業界の世界に慣れてほしいです!

デザイン系の記録なら Instagram

デザイン系を軸にしたお仕事をしていきたい場合は、Instagramがおすすめです。
写真で制作物がぱっと見れるので、実績ギャラリーとして使えます

Instagramの場合、ハッシュタグが強力なので上手くいけばお仕事につながります。
フォロワー数に依存せずに手軽に反応をもらえるのも大きなポイントです。

どういう投稿をすればいいかわからないな〜?

トリペン先生

初めは、参考になりそうな人のアカウントを真似してみるといいかもね。
パクリはダメだけど、投稿内容などを勉強させていただく感じでOK。
制作物の実績として、制作過程や考えていることなどを中心にまとめるといいかも。

じっくりまとめるならブログ(WordPress)

あとで見返せるように、自分用のブログを立ち上げてまとめていくのもおすすめです。
WordPressで立ち上げることが多いので、WordPressの勉強にもなり転職にも有利になりますよ。
※WordPressとは、サイトやブログを運用できるサービスです。

Webデザイナーだと文章に触れたり、コンテンツ設計にも関係してくるので、自分でコンテンツ作成をした経験は仕事で必ず活かせます!

自分用の整理なら Notion

基本はメモ帳のように使えますが、少しカスタマイズすると便利に使えるので、勉強のまとめを作るのに最適です。

あわせて読みたい
notionを使おう!初心者向け講座 コードスニペット雛形https://startkit.notion.site/f69daf65568a4811ab0dde29d91063dd?pvs=25学習・アクションプランテンプレートhttps://startkit.notion.site/98fd86...
トリペン先生

早速、学習日報を記録していきましょう!
手始めに、今日進めた内容や学んだことを記録してください。

STEP4|制作物を公開するときの注意

トリペン先生

いますぐは関係なくても、実績を公開するときには必ず注意してくださいね。

制作物はスクール課題とわかるように

スクールの課題をポートフォリオに掲載する際は、誰が見てもわかるように「スクール課題」と記載してください。※もしくは【架空】など。
スクールの課題を掲載すること自体は、まったく構いません。

見る人によっては、オリジナルと勘違いされる場合もありますので、記載を必ずお願いします。

デザイントレースの掲載には注意

トレースを実績に載せるのは、極力やめておきましょう!
あくまでも練習なので、掲載する必要性がありません。

練習の一環で掲載する際は、以下を徹底してください。
・トレースとわかるように記載すること
・トレース元も載せること

トリペン先生

トレースやサイト分析をブログやnoteにまとめて、勉強記録としている場合は共有した方がいいです。
制作物として出すことはNGなので、ご注意ください。

参考になる記事

サーバーにアップしたサイトには、ベーシック認証をかける

課題でコーディングしたものをサーバーにアップする際は、必ずベーシック認証とnoindexの設定をお願いします。

そのままアップしてしまうと通常公開されてしまい、世の中の人たちに見られてしまいます。
問題ないこともありますが、検索で出てしまわないように配慮しておきましょう!

ベーシック認証の方法
https://torikumu.com/member/guild_lesson_detail/1219-7/

noindexは、こちらのタグをheadの中に入れてください。

<meta name="robots" content="noindex">

学習初期はどうしても実績が作りにくく、オリジナル制作物が少なくなります。
そのため架空のものを制作したり、課題を制作物として見せるのは構いません。正しい明記をすれば問題ないため、扱いに少しだけ注意をお願いいたします。

著作権については、こちらのアーカイブで詳しく解説しています。大事な項目なので目を通しておいてください。

あわせて読みたい
Web制作者が知っておきたい著作権講座 https://vimeo.com/593561727/07df94685c 動画内の質問 建造物の写真は?インスタの写真の埋め込みは? 引用元を書いていたとしてもNGな場合の例があれば教えていただき...

STEP5|イベント・アーカイブを活用する

定期的にイベントや講座を行っております。
過去のアーカイブもまとめているので、ぜひご覧ください。ボリュームがあるので、あとでゆっくりでも大丈夫です!

トリペン先生

イベントはリアルタイムでも参加できるので、ぜひご参加ください!

参加に関しては、Slackの内部イベントチャットで共有しています。
Slackを普段あまり見ない習慣だと見逃しが多くなりますので、なるべくチェックしてくださいね。

イベントに参加するのが不安な方へ

イベントに参加するにはどうすればいいの?
わたしでも参加していいのかな・・

トリペン先生

大丈夫ですよ!
基本的には誰でも参加は可能になります。
はじめは少しハードルが高いかもですが、それを超えてしまえば楽になりますよ。

イベント参加で悩まれること

基本的にはウェルカムなのですが、初めての場所は緊張しますよね。
でも、強制的に何かをしてもらうことはないのでご安心ください
質問の話題をみんなに振ることはありますが、大体は他の方も見る専門なので全然大丈夫ですよ。

参加したら体験を共有しよう

強制ではないですが、イベントや勉強会に参加したら感想を共有してください!
これは運営への共有ではなく、SNSなどで学べたことや感じたことを書くことです。ブログやnoteでもいいですね。

何を書こうか迷って、なかなか書けないんですよね。。

トリペン先生

そこまで深く考えすぎなくても大丈夫ですよ!
自分が学べたと思ったことを、少し書いて記録する日記みたいなものです。
何のためにするかというと、自分の考えていることの言語化の練習や、継続の練習になります。

おすすめのアーカイブ動画

ジャンル別にまとめています。気になるジャンルをクリックすると開きます。

スクール活用・勉強継続系
あわせて読みたい
受講生に聞くスクール活用の方法 スクール活用方法についての話は、18分くらいからです。それまでは各自の自己紹介と制作物の共有をしていただいています。
デザイン系

Webデザイナーでも、チラシの依頼が来ることがあります。その際に困らないようにアーカイブがあります。

あわせて読みたい
駆け出しWEBデザイナーがチラシを頼まれちゃったら 使用した素材https://www.dropbox.com/sh/lyke53ijq61bvuu/AAAbRkLi_GbDy6G1KjEEl-g-a?dl=0 ▼使用したテキスト▼Papa Will Make Dinner HolidayMUSIC GOHAN FESTIVALToda...

写真レタッチ講座です。毎月開催しています!
レタッチ講座のアーカイブ

コーディング系

コーディングが苦手な人向けに開催した講座です。

あわせて読みたい
コーディングが苦手な人のための講座 ◎素材https://www.dropbox.com/sh/ta22hh97atj4r8h/AACsguI1bUaIxNRd4ZI9XEm3a?dl=0

WordPressのLIVE講座になります。全部で7回(14時間)ほどの内容です。

あわせて読みたい
転職・副業・キャリア系
あわせて読みたい
転職Night〜転職の基本〜 卒業生のポートフォリオhttps://www.notion.so/startkit/1bd47a3520e349d898b065a447302f82 卒業生のブログhttps://www.notion.so/startkit/5abdd08adce846258bfa75b8ba...

転職した卒業生の話が聞けるアーカイブです。

あわせて読みたい
ホンマでっか!?CF【転職1年以内の先輩の話】 #02の動画 https://youtu.be/zUdnQjUkCyU 参加いただいた林さん転職記事https://www.chan-m0ca.com/archives/1124 #01の動画
あわせて読みたい
途中で挫折しない勉強の楽しみ方 当日の資料https://xd.adobe.com/view/ddb90cf9-09ee-417d-9cc0-2cd32ce075eb-88ea/

学習のあとは、次のアクションにつなげる

はじめのアクションプランを思い出してみてください。
勉強もしつつですが、次のプランに進んでみましょう。実務や実践に進めると、緊張感も違い一気に成長できます。

この時点で、Webサイトのボリュームくらいのオリジナル制作物が2〜3つくらいあると、非常にいいペースです。
次に繋げるにしても、制作実績がないと話が進みません。知り合いからでもお仕事をいただけるなら、早めに声掛けしておきましょう!

トリペン先生

転職や副業のステップはこのあたりから進めていく方が多いです。
もちろん足りない点のほうが多いですが、まずはスタートしてみることです!
やらないといけないことは無限にありますが、今できることで試してみることも大事です。

あわせて読みたい
副業・フリーランス講座 個人で仕事をしていくには、それなりのスキルと経験が必要になります。制作の会社員経験がなく、そのままチャレンジする場合は小さい仕事から時間をかけていくようにス...
あわせて読みたい
【転職】Webに転職するための流れと動き方 転職した受講生の転職活動感想をまとめています!参考になることが多いので、ぜひご確認ください。https://www.notion.so/startkit/e940998477794b2783c21ed17bd48296 ...
あわせて読みたい
【副業】Webで副業したい人のためのステップ 集中講座をまとめているので、個人で仕事にしていく人は御覧ください。 https://torikumu.com/member/guild_lesson/sales/ ▼個人の仕事にまつわるイベント動画▼ https:/...

質問・不具合があったときは?

torikumuに関する要望や、不具合を見つけた場合は、Slackにてご連絡ください。

トリペン先生

こちらのチャンネルで教えてね。
17-torikumu_要望_不具合
https://cfall.slack.com/archives/C025F5FTBG9

講座を完了したらクリックしてね!

記事の内容