Digital of eXperience |体験の見える化から、組織は変わる。

特別高等支援学校からひらく、新しい進路のカタチ。——「かんたんホームページ作成ツール」で学ぶ“やさしいWeb制作”

「卒業したら、清掃か軽作業くらいしか仕事がない」
特別支援教育の現場で、こんな空気をなんとなく前提にしてしまっていないでしょうか。

もちろん、清掃や軽作業は尊い仕事です。でも、それ「しか」選べないのだとしたら、それは生徒の力不足ではなく、大人側の“進路設計”の貧しさかもしれません。

そこで今回つくったのが、特別高等支援学校の生徒向けに設計した
**「テーマジェネレーター Pro v2.1(パステルカラー版)」**です。

このツールは、WordPressのプロ用テーマを作る“本気仕様”でありながら、画面に出てくるメッセージは徹底してやさしく、日本語でシンプルにしています。

「働いたときをイメージして、会社のホームページを作ってみよう」

というメッセージから始まるこのツールを通じて、
Web制作やAI活用に興味を持つ生徒が1人でも増えてほしい——
そんな願いを込めています。


1. 「清掃か軽作業」だけがゴールじゃない

特別高等支援学校の進路先として、現状多いのは

  • 清掃業務
  • 工場での軽作業
  • 施設内の補助業務

といった仕事です。

それ自体を否定するつもりはまったくありません。むしろ、なくてはならない仕事です。

ただ、
「それ以外の選択肢」を、どれだけまじめに用意しようとしているか?
という視点が、保護者・学校・先生・教育委員会にもっと必要だと感じています。

たとえば生徒の中には、

  • パソコン操作が好き
  • 文字を打つのが好き
  • 色を選んだり、配置を考えたりするのが楽しい
  • 細かいレイアウトの調整なら集中できる

そんなタイプの子が必ずいます。

そういう生徒に対しても、
「卒業後は清掃か軽作業」
というコース“だけ”を想定するのは、あまりにももったいない。

そこで一つの具体的な「別ルート」として提示したいのが、
Web制作やデジタルコンテンツづくりの仕事です。


2. テーマジェネレーター Pro v2.1 は何をするツール?

このツールは、WordPress用のテーマを自動生成するWebアプリです。
といっても、難しいコードを書かせるわけではありません。

生徒がやることは、ざっくり言うとこの3つだけです。

  1. 「どんなお店で働きたいか」を選ぶ
    • カフェ ☕
    • パン屋 🥐
    • ケーキ屋 🍰
    • 飲食店 🍽️
    • スーパー 🛒
    • IT企業 💻
  2. 色を選ぶ・調整する
    • 「そら色」「わかば」「さくら色」などのパステルカラーをプリセットから選ぶ
    • もっとこだわりたい子は、ヘッダーやフッターの色を自分で微調整
  3. お店の名前・キャッチフレーズを入力する
    • 例)「カフェひだまり」
    • 例)「みんながほっと一息つける場所」

それだけで、
WordPressにアップロードしてそのまま使えるテーマ(zipファイル)がダウンロードされます。

中身はちゃんとしたプロ仕様で、

  • style.css
  • functions.php
  • header.php
  • footer.php
  • index.php
  • single.php
  • page.php
  • sidebar.php

など、テーマに必要なファイルが一式そろっています。
でも、生徒側はソースコードを一切触らなくても成立するように設計しています。

「働く自分」をイメージしながら、「自分のお店の公式サイト」をつくる——
この体験そのものが、進路学習とWeb制作学習を同時に叶えてくれる教材になり得ます。


3. なぜ特別高等支援学校向けにしたのか

特別高等支援学校で使うことを意識して、次の点にかなりこだわりました。

① 日本語・やさしいUI・3ステップ

  • 「STEP1 お店をえらぶ」
  • 「STEP2 色をえらぶ」
  • 「STEP3 ダウンロード」

という3ステップ構成にして、
画面にも大きく番号付きで表示しています。

専門用語はできるだけ排除し、

  • 「お店のひとこと」
  • 「ホームページを作る!」
  • 「ファイルがダウンロードされるよ」

といった “会話寄りの日本語” で統一しています。

② パステルカラー・丸ゴシックの「怖くないデザイン」

  • フォントは「Zen Maru Gothic」などの丸ゴシック
  • 背景はグリーンやブルーのパステルグラデーション
  • ボタンやタブも角を丸く、影をやわらかく

「デベロッパーツールを開いた瞬間、心が折れる」
みたいな“エンジニアあるある”の真逆を目指しています。

「あ、これなら触ってみたい」
そう思えることが、特別支援教育ではとても大事だと思うからです。

③ AI・Google連携を“未来の余白”として置いておく

実はこのツール、オプションで

  • Googleフォームによるお問い合わせフォーム埋め込み
  • Googleカレンダーの予定表示

にも対応しています。

授業では無理に使わなくてOKですが、

「こういうのを組み合わせると、“予約が取れるホームページ”にもできるんだよ」

という**“未来の余白”**として見せられます。

ここに、AIやGoogle Workspaceとつなげた将来の仕事像を重ねていくことができます。


4. AIを使えるスキルが、就職の「幅」を広げる

AIは、たしかに魔法ではありません。
でも、仕事の中でAIを自然に使える人は、確実に価値が上がっていきます。

特に、特別高等支援学校を卒業する生徒にとっては、

  • 苦手なところをAIにサポートしてもらう
  • 得意なところを仕事の中心に据える

という形で、働き方の調整がしやすくなる技術でもあります。

たとえば、このツールでつくったWordPressサイトに対して、

  • 文章はAIに下書きを手伝ってもらう
  • 仕上げのチェックや画像選びは生徒が担当する
  • 色やレイアウトは自分の感性で調整する

といった分担も可能です。

AIを前提としたWeb制作スキルを身につけることで、

  • 在宅ワーク
  • 時短勤務
  • 部分的な制作工程の受託

など、身体的・認知的な特性に合わせた働き方を提案しやすくなります。


5. 授業での使い方イメージ

先生方・教育委員会に向けて、簡単な授業案のイメージも書いておきます。

(1)1時間目:自分の「お店」を考える時間

  • 「もし自分がお店をやるなら、どんなお店がいい?」
  • 「どんな人に来てほしい?」
  • 「どんな雰囲気のお店にしたい?」

ワークシートに書き出したり、グループで話し合ったりしながら、
“働く自分のイメージ”をふくらませる時間にします。

(2)2時間目:テーマジェネレーターでサイトを作る

  • お店のジャンルを選ぶ
  • 色を選ぶ
  • お店の名前・キャッチコピーを入力する
  • WordPressテーマをダウンロードする

画面右側には「プレビュー」が表示されるので、
色や文字を変えるとリアルタイムに見た目が変わる体験ができます。

(3)3時間目:発表と「仕事」としてのWeb制作の話

  • 自分のつくったサイトデザインをみんなに見せる
  • 「ここを工夫した」「この色が気に入っている」などをプレゼン
  • 先生からは
    • 「こういう仕事は世の中に実際にある」
    • 「AIと組み合わせると、こんな働き方もできる」
      といった現実の職業への橋渡しをします。

この3コマだけでも、

「清掃・軽作業だけじゃなくて、
パソコンを使う仕事も、自分の進路の選択肢に入れていいんだ」

という感覚を、生徒に持ってもらえるはずです。


6. 学校と教育委員会へのお願い

特別高等支援学校の役割は、
「できることベースで生徒を並べ替える」ことではなく、
「その子の得意を、社会につなげる道を一緒に探す」こと
だと思っています。

  • Web制作
  • デジタルデザイン
  • AIを活用した資料づくり
  • 文字起こしやチェック作業

こういった仕事は、環境さえ整えれば、特別支援の生徒が力を発揮しやすい分野です。

その入口として、
「テーマジェネレーター Pro v2.1」のようなやさしいツールを
授業の中に少しだけ取り入れてみてほしいのです。


おわりに:AIとWeb制作で「自立」のイメージを増やしたい

このツールを作った一番の理由は、

AIとWeb制作のスキルを身につけることで、
就職先の幅を広げ、自立した生活ができる生徒が一人でも増えてほしい

という願いです。

  • 「自分で考えたお店のサイトをつくれた」
  • 「色や言葉を選ぶのが楽しかった」
  • 「また別のお店バージョンも作ってみたい」

そんな小さな成功体験が、
やがて 「自分にもこういう仕事ができるかもしれない」 という自己イメージにつながっていきます。

清掃も、軽作業も、Web制作も、AIの仕事も——
その全部を「同じレベルの選択肢」としてテーブルに並べられる教育環境を、
少しずつでも一緒につくっていけたらうれしいです。