職業訓練の授業はこんな感じ！

職業訓練の授業は1コマ50分です。

午前3コマ・午後3コマで、1日を通して同じ科目を学習します。

「え、どういうこと!?」ってなった方、多いのではないでしょうか。

職業訓練校では、月曜日はデザインの日、火曜日はコーディングの日というように1日単位で科目が決まっています。

最後の授業から1時間は自習が許可されているので、友達と一種に残って、授業内容まとめたり、先生に質問したり、ポートフォリオに載せる作品を作ったりすることもありました。

5ヶ月間の学習内容

私はWebデザイナーと動画クリエイターになるために必要なスキルを身につけるコースを受講していました！

5ヶ月間の学習内容を大きく分けるとこのようになります。

• 学科
• 就活支援
• デザイン（Adobe Illustrator / Adobe Photoshop）
• コーディング（HTMLとCSS / JavascriptとjQuery）
• 動画制作
• チーム実制作
• 企業実習

一つずつ説明していきましょう！

学科（5日間）

学科では主に3つのことを学習しました。

1つ目はWeb基本知識です。

Webの基本知識としてWebがどのように発達したのか、著作権や個人情報保護法などWebに関わる上で基本となる知識を学びました。

2つ目はインターネットビジネス概論です。

インターネットビジネス概論では広告やオークションなどインターネット上で行われているビジネスや、Webサイト制作に関わる職種について学習しました。

3つ目はWeb総合概論です。

Web総合概論では各メディアの特徴とWebサイトとの関係、Web制作の流れについて学習しました。

就活支援（3日間）

応募書類を作るために長所短所置き換えワーク、自分にとって重要な価値観、面接ロールプレイ、過去の振り返りと将来のキャリアプラン深掘りなどを通して自己分析をしました。

またWeb業界の就職活動でよく使われている求人サイトや、面接時に気をつけたいことなどについても学びました。

Adobe Illustrator（4日間）

IllustratorとはAdobeが提供しているグラフィックツールです。

ロゴやイラスト作成、チラシなど印刷物を扱うことが多い印象です。

授業では、最初に基本的なカラーモードの設定やアートボードのサイズ設定について学びました。

その後、名刺・チラシ・地図のトレース・バナーなど、実際に作品を作りながら、文字入力の方法、長方形ツール、色の変え方、ペンツール、グラデーションツール、パターンの繰り返しなどの基本的な機能の操作スキルを身につけます。

Illustratorの最後の授業で作ったバナーがこちらです。

Adobe Photoshop（6日間）

PhotoshopとはAdobeが提供する画像編集&デザインソフトです。

Photoshopの授業内容は3日間ずつ前半・後半に分けてご紹介します。

まず前半はIllustrator同様、作品を作りながらツールの使い方を学びます。

Illustratorと比較するとぱっと見はあまり差異がないように感じるのですが、使ってみると違いが見えてきて、IllustratorからPhotoshopへと頭を切り替えるのが大変でした。

また、レイヤーマスクの使い方、写真の切り抜き、画像のリタッチ、エフェクト（影や境界線など）の付け方なども学習しました。

前半で作った作品がこちらです。

酷いとしか言いようがありません😂

…が、3日間なのでこの程度のスキルしか身につける時間はなかったのもまた、事実です。

昔の作品をブラッシュアップするのも楽しそうですね。

今度やってみたいと思います!!

前半が終わり、後半からはデザインカンプを制作しました。

皆さんは「デザインカンプ」という言葉を聞いたことがあるでしょうか?

「デザインカンプ」とはWebサイトの完成見本になるデザインのことです。

自分でデザインするわけではありません。

先生が事前に用意してきてくださるデザインがあるので、それと同じになるように先生の真似をしながら、3日間かけて制作しました。

先ほど見ていただいた海鮮丼のバナーとは異なり、Webサイトは「見てくれる人が使いやすいか」ということも非常に重要です。

デザインカンプを作りながら先生から「ここはこんなふうに工夫しています」やというようなお話を聞けたのもとても勉強になりました。

HTMLとCSS（12日間）

HTML&CSSの授業ではVisual Studio CodeとAdobe Dreamweaverというソフトを使用しました。

しかし、Adobe Dreamweaverは2022年に開発サポートが終了しているので、今後、職業訓練校ではVisual Studio Codeを使うのではないかと思います。

HTMLとCSSって何?という方おられると思います。

これらはWebで使われている別々の言語です。

HTMLは文字や画像などをWeb上に表示するWebサイトの骨組みで、CSSは文字の色を変えたり、画像のサイズを小さくしたりする、骨組みを装飾できるものだと理解していただければ良いかと思います。

HTMLとCSSの授業では6日間ずつ、前半と後半で学習内容が異なります。

前半の6日間はManaさんというWebデザイナーの著書『1冊で全て身につくHTML&CSSデザイン入門講座』を教科書として使い、学習しました。

前半6日間のうち4日間は基礎学習でコードの書き方・タグの役割を学習し、教科書と同じ状態のウェブサイトが表示されるようにコードを書いて体に覚え込ませていました。

前半のうち残りの2日間は応用として、著書に記載されているサンプルサイトを1からコーディングしました。

教科書に答えが全て載っているし、先生の見本もあるので、読んで真似してミスなく打てれば、完成させることができます。

後半の6日間は先生が作ってくださったお花屋さんのデザインカンプを見ながら、実際にコードを書いていく授業です。

先生が、自分でコードを書く力を身につけさせるために、まずは自分でやってみる時間をとって、そのあと答えを教えるというように授業を進めてくださいました。

前半とは違い、教科書も答えもありません。

教科書で習ったこと、サンプルサイトを作りながら学んだことを思い出しながら、必死で書いてはみるものの、全く思うようにならず泣きそうになりながらコードを書いていました。

教科書を使っていたときはコーディングができる気になっていましたが、実際にサイトを作ってみると比較にならないくらいぶっちぎりで難しかったです。

私を含め、訓練生の多くはだいたいここで挫折していました…

私がこの挫折乗り越えた勉強法ついては改めて書こうと思っていますが、この時自分に合った勉強法を見つけたおかげでコーディングが好きになりました。

JavascriptとjQuery（5日間）

HTMLとCSSの授業が終わり、JavascriptとjQueryが5日間ありました。

JavascriptとjQueryはWebサイトのアニメーションで使われることの多い言語でHTMLやCSSとは書き方が全く異なります。

例えば、皆さんがスマートフォンでWebサイトを見る時、上の方に3本線があるのをご存知ですか?

このサイトでは2本になっているのですが…

3本線を押すとメニューが出てきて、2本の線が×になるというアニメーションです。

これにもJavascriptとjQueryが使われています。

授業ではまずJavascriptとjQueryがどのような言語なのか、コードの書き方などについて学びました。

5日間で自分でコードを書くことは不可能だということで、「プラグイン」と呼ばれる予めコードが準備されたファイルを使って、アニメーションを実装しました。

プラグインを使うと、数行書き加えるだけでアニメーションが動くようになるので、とても便利です。

授業ではDrawerとslick、の実装方法を中心に学習しました。

動画制作（16日間）

動画制作の授業は学科2日間、実技10日間、実制作4日間でした。

学科では動画の活用方法や、フレームレートや解像度等動画素材の基本知識、撮影時のディレクション、BGMの探し方などについて学習しました。

実技ではAdobe Premiere Proというソフトを使って、先生の真似をしながら動画を作って操作スキルを身につけました。

プロジェクトの基本設定、素材の読み込み方、音に合わせて素材をカットする方法、動画素材の色調補正、アニメーションの付け方、テロップの打ち方など多岐にわたって学習しました。

制作した動画作品もPVを作ったり、YouTubeの動画広告を作ったりして、私は授業の中で一番楽しかったです。

実技で作った動画がこちらです！

実制作では実際に企業様から、『Webサイトに掲載する動画』の案件を受け、クラスで４チームに分かれて同じ案件に対してそれぞれ動画を制作しました。

絵コンテを書いて、サンプル動画を制作し、企画書と一緒に企業に送付したり、撮影時には初のディレクションも経験しました。

コロナ禍だったため、ZOOMでディレクションをすることになり、四苦八苦したのをよく覚えています。

私のチームは選ばれませんでしたが、チームで作品を作るのはこの時が初めてだったのでとても楽しく取り組みました。

チーム実制作（21日間）

チーム実制作とは動画の実制作同様、企業様からいただいたWebサイト制作の案件に、３チームに分かれて取り組みました。

チーム実制作は以下の流れで進めました。

1. ヒアリング(1日)
2. 企画(1日)
3. デザイン2案制作(8日)
4. 中間プレゼンテーションリハーサル(1日)
5. 中間プレゼンテーション(1日)
6. 各チーム1案選ばれる
7. コーディング(5日)
8. 検証(1日)
9. 最終プレゼンテーションリハーサル(1日)
10. 最終プレゼンテーション(1日)
11. 結果発表

チームで制作するとはいえ、初めてのWebサイト制作は本当に大変でした。

ヒアリングした内容をもとに、企画でコンセプトやターゲット、使う色などを決めるのですが、年代も価値観も違うメンバーが集まっているので、私のチームはなかなか決まりませんでした。

企画ができたらチーム内で2つにわかれてデザインカンプ2案の制作が始まります。

当時デザインに苦手意識があったので、コンセプトを守ってデザインすることにとても苦戦しました。

また、普段からどれだけWebサイトを無意識でみているかを思い知りました。

中間プレゼンテーションを終えて各チーム1案が選ばれ、コーディングが始まります。

私自身コーディングが好きだったのと、チーム内にコーディングに詳しい方がいらっしゃったので、あまり苦戦せずに進めることができました。

しかし、デザイン性を重視したあまり、コーディングする時のことを考えていなかった…ということもあってたくさん学びを得た期間でもありました。

プレゼンテーションでは、企業の担当者様にむけて、『なぜこのようなWebサイトを制作したか』についてターゲット・コンセプト・業界分析など様々な角度からお話しさせていただきました。

デザインと同時並行でプレゼンテーションのスライドをIllustratorで作ったり、原稿も作らなければいけなかったので、授業内では間に合わず、徹夜で作業することもありました。

チーム内の争いが起きたり、就職活動や家庭の事情でメンバーが欠席して、1人で作業を進めたりしていたときは、焦りしかなく本当に辛かったです。

でも結果として自分のチームのWebサイトが企業様に選んでいただけたときは、言葉にならないくらい幸せで、頑張ってよかったと思いました。

本当に大切な経験だったと感じています。

ポートフォリオ制作（4日間）

自習のような感じで、それぞれがやりたい作業を進める時間でした。

4日間でポートフォリオサイトを作るのはほぼ不可能に近いです。

なので、事前に進めておいて、わからないところを先生に聞いたり、先生や訓練生からフィードバックをもらったりしていました。

他の訓練生のポートフォリオサイトを見れる機会でもあるので、ここだけの話ですが、いいデザインだなとかいいアニメーションだなと思ったものはこっそり盗ませてもらってました笑

企業実習（10日間）

実習開始の数週間前に訓練校から実習先の情報と実習内容が記載された資料が配られたので、資料と企業のサイトを見て、実習先を決めました。

内容は企業によって異なるので、必ずWebサイト制作ができるわけではなく、動画編集や印刷物の制作を行ったところもありました。

私は大阪市内の企業で実習をさせていただきました。

リアルタイムで進行中の案件を、自分ならどう作るか考え、10日間で1つのサイトを完成させるという課題を出していただきました。

実習担当の方は通常業務をしながら実習の対応をしてくださいました。

訓練校の実制作では、分担してWebサイトを制作していましたし、期間も21日間あったので、10日という限られた時間の中で1人でWebサイトが作れる自信が全くなく、とても不安でした。

そのため、10日間完成させられるように、細かくスケジュールを立て、次の日に円滑に進められるようにデザインを考えたり、コーディングでつまづきそうなところは自分で探すなどして実習に取り組みました。

私が4日間かけたコーディングが、Webコーダーさんの手にかかれば1日で終わってしまうと聞き、

「私はすごい業界に飛び込もうとしているんだな…」と思いました笑

Web制作の現場を実際に見て、雰囲気を肌で感じることができたので、Webデザイナーになりたい気持ちが強まり、さらにキャリアプランが明確になったと感じました。

実習当時も、今振り替えっても本当に大事な経験で、企業実習があったからこそ、実際に働くようになってからもギャップを感じることなく働けているように思います。

これから職業訓練へ申し込みをされる方は、ぜひ企業実習のあるコースを受けることをお勧めします！

今日のまとめ

改めて職業訓練校での5日間を振り返ってみると、それぞれの科目の学習期間がとても短くて驚きました。

当時はとにかく授業についていくことに必死だったので…

職業訓練校で『未経験でWebデザイナーになるのは不可能に近い』と言われ続けてきましたが、そんなことはありません。

しかし、実際にWebisで働くようになって、スキル不足を感じているのは事実です。

職業訓練校で学ぶことは基礎中の基礎なので、日々新しい学びがあって、勉強することもたくさんあります。

決して速いスピードではなくても、勉強を続けて理想のWebデザイナーになれるように頑張りたいと思います!!

最後までご覧いただきありがとうございました🙇🏻‍♀️

素敵な1日をお過ごしください😌