
制作背景
「インストラクショナルデザイン演習」とは、効果的な教材の制作方法について学ぶ授業です。
今回私たちのグループは、「Web制作を行ったことはあるけど、企画やコンセプトから決めてサイト制作はしたことがない人」向けに、Webサイト制作の一連の流れを勉強できるサイトを制作しました。
限られた時間での制作だったため、教材の文章制作やコーディングにはAIを使用しながら、内容のわかりやすさなどは人の手でチェックしながら制作していきました。
制作時期
2026年 7月
(大学3年)
メンバー
2人(同級生 / 私)
担当箇所
教材内容(共同)、教材ページ、クイズページのコーディング(共同)
技術スタック
- HTML/CSS
- JavaScript
- AI
Journey
教材内容制作
Figjamで教材内容を書き出していきます。メンバーが2人ともWeb制作を長くやってきた人間だったので、今までの授業での知識と、2人の経験を教材に反映させていきました。今回は教材制作の授業だったので、サイト自体よりも教材内容のクオリティを上げることを意識して制作しました。
サイト制作
デザインとコーディングはまずAIに任せて、その後改良したい部分を自分の手で改良していく形で進めていきました。
付録:チートシート
付録として、教材で勉強したWeb制作の一連の流れを一目で復習できるチートシートを制作しました。これにより、教材ユーザーは本教材で勉強後、ユーザー自身でWebサイトを制作する際に教材の内容をすぐに見返してサイト制作に生かすことができます。


