職業訓練としてのウェブデザイン

技能競技大会にウェブデザイン部門があることをご存知でしょうか？
職業訓練生が出場できる技能競技大会はざっくり２つあります。

①若年者ものづくり競技大会

若年者ものづくり競技大会は、働く前の若者たちが技能を競う競技大会です。
対象：職業能力開発施設や工業高等学校等において技能を習得中の企業等に 就業していない20歳以下の若者

②技能五輪

技能五輪は、青年技能者の技能レベルの日本一を競う技能競技大会です。
対象：各都道府県職業能力開発協会等を通じて選抜された者（原則23才以下）
全国大会で勝ち抜くと国際大会への出場もあります。
若年者ものづくり競技大会より少しレベルが高そうですね！

ウェブデザイン職種はどんな競技？

「デザインができないとダメなの？デザインを競うの？」という疑問がありますが、
内容を見ていきましょう。

ウェブデザインとは、「インターネット上でドキュメントを発行することを目的に、計画、設計およびデザイン、またウェブサイトの維持管理を行うこと」と定義する。

と書いてあります。
つまり、ウェブデザイン＋フロントエンド＋バックエンドを踏まえたウェブサイト構築（と、それにまつわる小課題）で競うようです。

やってみる

若年者ものづくり競技大会 のウェブデザイン職種のモジュール2の競技「サイト設計・構築」に挑戦してみました。
今回は事前課題を作成してみました。

本番の時間配分はこちらです。
・ウェブサイトの説明資料の作成（1時間）
・ウェブサイトの構築（4時間）

課題（どんなサイトを作るか）については当日に発表されます。
一応、事前資料としてこんな感じというものが発表されています。
（本番では10％以上の変更ありと書かれています）

【テーマ】
新しく開業する「お好みタワー」という施設のウェブサイト

【制作要件】
※個人的な解釈も入っています。
ページ構成：
● トップページ
　　○ 「お好みタワー」施設の紹介
　　○ ランダムで3件の店舗のピックアップ表示
● 店舗検索
　　○ 店舗情報APIの情報を元にした店舗検索
● キャンペーン情報（ダミー）
● 「お好みタワー」へのアクセス（ダミー）

プレゼンテーション資料に
デザイン意図、デザイン意図やサイト制作背景に基づいて採用した仕様・機能、アピールポイント
が必要になります。

特筆すべきはこちらの点です。

競技用PCおよび検証用機材から、 インターネット（競技用ネットワーク外）へアクセスすることはできない 。また、選手が競技委員の指示なくネットワークの設定を変更することはできない。なお、競技用ネットワーク外へ故意にアクセスした場合は失格とする場合がある。

インターネットが使えない・・・
つまり、CSSをうろ覚えの状態でググればいいや！ではできないということですね。

しかし、4時間で企画デザインからコーディング、レスポンシブ対応までとは・・・難しい・・

設計（紙にざっくりWF）→（※オーサリングツールの指定があるので、本番ではしっかりデザインしないといけない様子）
HTMLコーディング
CSSコーディング

きっつい・・

途中ちょっと挫けそうになりました。
ググれないことと、時間の制約がスーパーきついです・・
調べきれていませんが、本などの持ち込みや、お昼休みとかも見ちゃダメなんでしょうか。。

完成したもの

自分なりのお好み焼きタワーのトップページのみが完成しました。
かかった時間は4時間弱です。（時間、アウトですね）

【PC】

【SP】

・デザイン設計 40分
・HTMLコーディング 60分
・PCのCSSコーディング 120分
・SPのCSS対応 40分
画像やテキストは、受賞作品を参考にしました。

感想

時間内に作りきれるデザインで作成することが大事だと思いました。
事前にある程度レイアウトのパターンをコーディングできる練習が必要そうです。
今回私が行わなかったAPIの読み込みやサーバーへのアップロードまであるので、さらに大変な作業が待っています。
こちらに出場した人は時間内に自力で企画し作りきれる人（しかも若い！）ということで、民間企業にいた身としては絶対新卒で欲しい人材だろうな～と思いました。

おわりに

様々な制約の中で自分の力だけでなにかを作り上げることは一度経験しておくとよいなと思います。
おまけに職業訓練校でないと出られなかったり、同世代の人たちと競い合うとても良い機会だと感じました。
当校でも、建築関連やメカトロニクス、フライス盤などに出場していますが、
ウェブデザイン職種にも出場してみませんか？