course-corporate-edition について
既存の公開講座サイトを、短縮してブランドを変更できる企業研修版に仕立てるスキルです。顧客向け教材を準備するチームを対象に、単一ファイルのページと公開講座の素材共有で重複を抑えます。
主な機能
- 01コースデータを内包したSPA
- 02企業ブランドと素材の差し替え
- 03公開講座素材へのフォールバック
- 04講義単元の選定と短縮
- 05納品フォルダーの検証
活用シーン
- 01複数日講座を1日の企業研修に短縮
- 02新規顧客向けにブランドを替えて複製
- 03顧客がホストできる教材フォルダーを準備
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ kevintsai1202/ teaching-site-skills --skill course-corporate-editionインストール後、Claude Code で/course-corporate-editionを入力して読み込まれたか確認します。
詳細
法人向けコース
スキーマの定義元:すべての
window.COURSEフィールド名は_shared/domain-primitives.mdに記載されています。ファイル名の規則(英語優先):法人向けエディションは
corporate-editions/{client}_{hours}h/配下に配置します。エディションごとのフォルダーにはmaterials/、assets/、index.html、README.mdを使用します。従来の中国語名(企業包班/、教學素材/)は非推奨です。
このスキルでは、既存の公開講座用サイトから、法人向けエディション(短時間で、ブランドをカスタマイズでき、単一フォルダーで納品できるもの)を作成します。
呼び出すタイミング
- ユーザーが完成済みの公開講座用サイト(例:4日間 × 6時間)を持っていて、クライアント向けに1日版を必要としている場合。
- ユーザーが既存の法人向けエディションを複製し、別のクライアント向けにブランディングを変更したい場合。
- ユーザーが、クライアントの IT 部門で zip 化してホスティングできる単一フォルダーでの納品を希望する場合。
2つのアーキテクチャ上の変更点
法人向けエディションでは、公開講座用アーキテクチャから意図的に2点を変更します。
変更点 1:単一ファイルの SPA(window.COURSE をインライン化)
公開講座:index.html + course-data.js(別ファイル)。
法人向け:course-data を <script>window.COURSE = { ... }</script> として index.html 内にインライン化します。
理由:法人クライアントはフォルダーを zip 化して、自らホスティングします。ファイルが1つなら、管理する要素が1つ減ります。また、file:// からのダブルクリックでも動作します(別の JS を取得する際の問題がありません)。
コスト:データを編集するには HTML を変更する必要があります。法人向けエディションは納品後に再編集しないため、問題ありません。
変更点 2:アセットのフォールバックチェーン
法人向けエディションには専用の assets/ フォルダーがありますが、独自のアセットがない場合は公開講座用の assets/ にフォールバックします。
corporate-editions/client_6h/
├── index.html ← inline COURSE
├── assets/ ← corporate-specific overrides (logo, customised hero)
└── materials/ ← curated subset (~11 files vs. public's ~30)
↓ falls back to
project-root/assets/ ← public class's full asset library
project-root/course-package/materials/ ← public class's full material library
実装では、アセットの参照時にまず法人向けのパスを試し、404 の場合は公開講座用のパスを試します。同梱の ebook ビルダーも、compose レイヤーで同じ処理を行います。
const ASSET_ROOTS = [
path.join(CORP_DIR, 'assets'),
path.join(PUBLIC_ROOT, 'assets'),
];
async function findAsset(filename) {
for (const root of ASSET_ROOTS) {
try { await fs.access(path.join(root, filename)); return path.join(root, filename); }
catch { /* try next */ }
}
return null;
}
理由:そうしないと、クライアント向けエディションごとにイラストを200 MB以上複製することになります。変更するもの(ブランド、ヒーロー画像)だけを上書きし、それ以外は共有します。
フォルダーの規則
project-root/
├── (all public-class files)
├── corporate-editions/
│ ├── clientA_6h/ ← Generic edition (fictional case, sellable to many clients)
│ │ ├── index.html
│ │ ├── README.md ← shipping / HR onboarding notes
│ │ ├── assets/ ← edition-specific overrides
│ │ └── materials/ ← edition-specific curated materials
│ └── clientB_condensed/ ← Real-client custom edition
│ └── (same shape)
└── assets/ ← public-class full asset library (fallback target)
汎用エディションとカスタムエディション:汎用エディションでは、事例として架空の会社名(例:「GreenField Select」)を使い、複数のクライアントに販売できるようにします。カスタムエディションでは、必要に応じて実際のクライアントデータに差し替えます。
短縮の方針(24時間 → 6時間)
どのユニットを残すかの選定が最も難しい部分です。目安は次のとおりです。
- 一般的な概念を扱うユニットを削除する(例:「AI の歴史」、「プロンプトの基礎」)。法人向けの受講者が求めているのは、基礎ではなく、すぐに得られる ROI です。
- 具体的な成果物のあるユニットを残す。法人向けで成功を測る基準は「何を持ち帰れたか」です。持ち帰れる成果物を7~8点用意することを目指します。
- 共通シナリオを絞り込む。公開講座では複数のブランドを繰り返し使用しますが、法人向けでは1つ(クライアントの業界に最もなじみやすいもの)にします。
- 類似するユニットを統合する。公開講座の関連する2つのユニットは、多くの場合、1つのユニットにまとめます(例:「プロンプトの作成」+「Gem の作成」→「Gem 封装の実践」)。
- 時間構成を組み直す。公開講座は「日」単位ですが、法人向けでは通常「午前/午後」単位です(例:午前3時間+午後3時間、昼休憩1時間)。
window.COURSE.day1.titleもそれに合わせて調整します("Day1: 上午"、"Day2: 下午")。
ユニット選定ワークシート
短縮版を計画するときは、次のような表を作成します。
| 法人向けユニット | 参照元 | 時間 | 残す理由 |
|---|---|---|---|
| 1.1 オープニング+自己評価 | (新規) | 25分 | その日の基準点 |
| 1.2 Gem の概念+マルチプラットフォーム向けコピー | 公開講座 Day 1 u2-u4 | 95分 | ROI が最も高く、具体的な成果物が得られる |
| 1.3 NotebookLM × Gem の統合 | 公開講座 Day 3 u1 | 25分 | 差別化要素 |
| ... | ... | ... | ... |
この表が法人向け index.html を構成する際の信頼できる参照元になります。すべてのユニットの参照元を追跡できるようにしてください。
ブランディングのカスタマイズ変数
クライアント固有のテキストはすべて、インライン化した COURSE の先頭にある1つのブロックにまとめます。
window.COURSE = {
meta: {
title: '電商團隊 AI 即戰力',
audience: '3–30 人企業內訓',
client: '景笙顧問', // ← swap per client
hours: 6,
schedule: '09:00–16:00',
classroom: '客戶端(由企業指定,實體 / 線上同步皆可)',
},
// ...
};
新しいクライアント向けに複製する場合:フォルダーをコピーし、クライアント名を検索・置換して、assets/ 内のブランドアセットを差し替えます。
単一フォルダーでの納品チェック
クライアントに送る前に、フォルダーだけで本当に完結していることを確認してください。
// scripts/verify-corp-self-contained.mjs
// Walk the folder, parse every src/href, ensure no path goes outside this folder
// EXCEPT for the documented public-class fallback paths.
../assets/foo.png のような参照が紛れ込んでいると、クライアント側の IT 担当者は、解凍後に画像が表示されないことに気づきます。
検証用スクリプト
サンプルのワークショップには次のスクリプトが含まれています。新しい企業版に合わせて調整してください。
| スクリプト | チェック内容 |
|---|---|
scripts/verify-corp-{name}.mjs | Playwright:読み込み、複数のビューポートでのスクリーンショット、サイドバー/スクロールスパイ/進捗状況 |
scripts/verify-corp-{name}-404.mjs | すべてのアセットをクロールし、404 がないことを確認 |
scripts/audit-corp-{name}-content.mjs | インライン化された COURSE とソースの Markdown を差分比較し、内容のずれを検出 |
scripts/diagnose-corp-{name}-{topic}.mjs | 問題ごとの診断(DOM ゾーン、日の表示状況) |
基本方針:懸念事項ごとに検証スクリプトを用意し、すべて scripts/ に corp-{name} プレフィックスを付けて配置します。
避けるべきパターン
- アセットフォルダー全体を複製する — フォールバックチェーンの意味がなくなります。
- 企業版で「動作するように」公開クラスのサイトを編集する — 両者は分離しておきます。企業版は公開クラスのアセットを読み取り専用で使用します。
- 汎用版にクライアントの実際のデータをハードコードする — 汎用版では架空の事例を使い、必要に応じてのみカスタマイズします。
file://の制約を忘れる — 企業クライアントはindex.htmlをダブルクリックします。ローカル JSON のfetch()や、実際の HTTP サーバーを必要とする機能は避けてください(localStorage は問題なく使えます)。
引き渡し
このスキルの完了時には、次の状態になっています。
corporate-editions/{client}_{hours}h/に、ZIP 化の準備ができた新しいフォルダーが作成されています。- フォルダー内の
README.mdに、起動方法(ダブルクリック)、人事向けの注意事項、コースの概要が記載されています。 - 検証スクリプトがすべて正常に実行されています。
クライアントが印刷用 PDF/DOCX 納品物も希望している場合は、それは course-ebook-publishing の担当です。続けてそちらを実行してください。