--- title: AIスライドは、なぜダサいのか — Claude Fable 5 に「センス」ではなく「仕組み」を与えた話 tags: author: [のむらや](https://www.docswell.com/user/nomuraya) site: [Docswell](https://www.docswell.com/) thumbnail: https://bcdn.docswell.com/page/Y76WDRLZ7V.jpg?width=480 description: AIにスライドを作らせると「文字の壁」が返ってくる——犯人はセンスではなく、図解レイヤーの欠如でした。同じ内容のまま独立採点 5.5→9.0 を実証し、①1枚=1HTMLキャンバス+SVG図解 ②1デッキ=1テーマCSS（デザイン契約+機械検査）③生成AIとは別のAIによる採点ループ、の3つの仕組みに落とし込んだ話。ChatGPT部LT（2026.07）発表資料。このスライド自体も、本文で説明している仕組みで制作・検品されています。 published: July 11, 26 canonical: https://www.docswell.com/s/nomuraya/ZN7XLL-2026-07-11-ChatGPT-club --- # Page. 1 ![Page Image](https://bcdn.docswell.com/page/Y76WDRLZ7V.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya CHATGPT部 LT AIスライドは、 なぜダサいのか — Claude Fable 5 に「センス」ではなく「仕組み」を与えたら どこまで行けるか試した話 — 2026.07 - LT 10min CHATGPT部 LT 01 / 12 # Page. 2 ![Page Image](https://bcdn.docswell.com/page/G75M381974.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya PROBLEM AIに頼むと「文字の壁」が返ってくる ISSUE - AGENTIC GUARDRAILS 3層に切る 層 操作の例 扱い 一・可逆 調査・コード生成・PR作成 自由に委譲(速度を取る) 二・条件付き 確認を挟めば実行可 逃げ道つきガード 三・不可逆 本番マージ・デプロイ・課金 逃げ道ゼロで物理ブロック さっきの本番マージは三・不可逆だった - なのに無防備だった 8 構造を全部「文字」で語る 3層の防御構造を素の table で説明。図解が1枚もない 組版が粗い 約物のアキ未処理・ベタ組み。「CSSで組んだだけ」感の正体 全枚が同じレイアウト 中央揃えの縦積みだけ。「設計された瞬間」がない 実物：Marpで作った自分のスライド。独立レビュアー採点 5.5 / 10 採点：独立サブエージェント（プレゼンデザイナー視点・10点満点） 02 / 12 # Page. 3 ![Page Image](https://bcdn.docswell.com/page/9J29ZK15ER.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya DIAGNOSIS 犯人は、センスではなかった 仮説(当初) AIはデザインセンスがない。 CSSをもっと頑張らせよう 実測(独立採点の減点内訳) 配色・コピーは既に上位水準。 欠けていたのは図解のレイヤー デッキ全体 7/10 - 減点は「図解ゼロ・約物未処理・レイアウト単調」の3点に集中 03 / 12 # Page. 4 ![Page Image](https://bcdn.docswell.com/page/DEY4RNZ6JM.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya PROOF 同じ内容のまま、5.5 → 9.0 ISSUE - AGENTIC GUARDRAILS 3層に切る 層 操作の例 扱い 一・可逆 調査・コード生成・PR作成 自由に委譲(速度を取る) 二・条件付き 確認を挟めば実行可 逃げ道つきガード 三・不可逆 本番マージ・デプロイ・課金 逃げ道ゼロで物理ブロック さっきの本番マージは三・不可逆だった - なのに無防備だった 8 ISSUE - AGENTIC GUARDRAILS 3層に切る 一・可逆 REVERSIBLE 調査・コード生成・PR作成 自由に委譲 速度を取る 二・条件付き CONDITIONAL 確認を挟めば実行可 逃げ道つきガード YES と言えば通る 8 修正基準はたった1つ 「取り消せない 本番への副作用か?」 この問だけで、AIに任せる操作すべてを右の 3層に仕分けられる。 8 BEFORE markdownの表組み 5.5 AFTER HTMLキャンバス+レイヤー図解 9.0 変えたのは「危険度が下に行くほど壁が厚くなる」構造の視覚化と組版だけ。文章は1行も増やしていない。修正ループ2周で到達 採点は毎回別の独立エージェント（自己採点ではない） 04 / 12 # Page. 5 ![Page Image](https://bcdn.docswell.com/page/VJNYDXY178.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya MECHANISM 1 / 3 Markdownをやめ、1枚=1枚のHTMLキャンバスにする MARKDOWN(これまで) 上から下に「文字が流れる」だけ 図解・非対称レイアウトは構造的に書けない HTML CANVAS 1280×720(これから) 図解(SVG) 自由な配置 非対称グリッド 構造は文字でなく「絵」で描く 組版(palt・約物)もCSSで一度だけ解決 はみ出しは折返しでなく設計で解決する (1280×720 固定・overflow: hidden) PDF/PNG は Playwright、編集可能 PPTX は html2pptx で書き出し 05 / 12 # Page. 6 ![Page Image](https://bcdn.docswell.com/page/YE9PG8PYJ3.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya INTERLUDE - よくある疑い 「AIのSVG、信用できるの?」 - 幾何は◎、事故るのは 意味 GEOMETRY - 実測で裏取り < 1px 座標・整列・目盛の誤差。棒グラフはデータ比例偏差 0.05%。浮いた 線・ずれた矢尻・文字切れはゼロ タイムライン境界:理論値と誤差 0px マイルストーン位置:中心誤差 1.2px SEMANTICS - 実際に事故った 3件 いずれも「絵は正確なのに意味が壊れる」型 凡例にない中間色を透明度で発明（モノクロ印刷で誤読） 注釈の引き出し線が値ラベルを貫通 軸ラベルの規約が不統一（開始位置 vs 終了位置） 結論:検収で見るべきは座標ではなく、凡例と実色の一致・注釈の衝突・ラベル規約 検証:3種の図解（フロー図・タイムライン・チャート）をピクセル実測 06 / 12 # Page. 7 ![Page Image](https://bcdn.docswell.com/page/GE8DV8DKED.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya MECHANISM 2 / 3 デザインは「センス」でなく「契約」にする theme.css デザインの単一の正本 色14トークン / 書体4系統 部品(見出し・カード・SVG塗り) スライド01 - レイアウトのみ スライド02 - レイアウトのみ スライドN - 色・書体は書けない check-theme.sh 生の色・書体・契約外トークンを 全スライド機械検査で FAIL に 枚が増えてもデザインが漂流しない 逸脱は「気をつける」でなく、物理的に書けない テーマ差し替えだけで見た目が総入れ替え 全テーマ同一契約 - 研修の見た目 ⇄ 提案書の見た目が1ファイルで切り替わる このデッキも同じ契約で検査済み（12枚 PASS） 07 / 12 # Page. 8 ![Page Image](https://bcdn.docswell.com/page/LELM5RMP7R.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya MECHANISM 3 / 3 生成AIより、検証AI 生成 HTML + SVGを書く レンダリング 実物 PNG に焼く 独立採点 別のAIが実物を目視 出荷 8点以上のみ 8点未満は差し戻し 収束実績:1〜2周 (5.5→9.0 は2周 / テンプレ集の指摘解消は1周) ポイント:自己採点は禁止。生成した本人と別のコンテキストが採点するから辛口が出る 人間はループの外で「出荷判定」だけを見る 08 / 12 # Page. 9 ![Page Image](https://bcdn.docswell.com/page/4JMY3RY2JW.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya SCALE 同じ仕組みで、研修教材204本に展開した 204本 テーマ1ファイル(正本)に「出所フッター+ 透かし+ワードマーク」を焼き込み。転用さ れても出所が残る 27本 テーマ移行した教材を全数ビルド→全ページ 目視検証。破壊22本を検出し全て対処 79体 検証・修正に並列投入したエージェント数 (Workflow 3本合計)。人間の作業は方針判 断のみ ここでも原則は同じ - 手動同期は symlink で構造ごと廃止、運用注意は検査スクリプトに置換、 修正は「分割のみ・内容の削除禁止」の制約つきでAIに委譲 教材リポジトリ側:テーマ正本1ファイル+検査1コマンド運用 09 / 12 # Page. 10 ![Page Image](https://bcdn.docswell.com/page/PJR9QR9579.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya BYPRODUCT 検証AIは、人間が見落としていた既存バグまで掘った 01 コードブロックの「無音クリップ」 テーマの overflow:hidden で、溢れたコードがエラーなく消える構造。検知ルールや構成図の後半が受講生に届かないまま配布されていた - 複 数教材から検出し、全てスライド分割で復元 02 クライアント名フッターが本文に流し込み テーマに footer の配置定義がなく、案件教材でクライアント名が本文に浮いていた。絶対配置を定義して修正 03 「教材だと思っていたら中間資料だった」11本 全数ビルドして初めて、frontmatter が先頭にない=そもそもスライドとして成立していないファイル群を特定。台帳が実態に追いついた 全数を実物で見る検証は、目的（ブランド防衛）の外側の欠陥も拾う 10 / 12 # Page. 11 ![Page Image](https://bcdn.docswell.com/page/PEXQ5RQXJX.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya 一 センスは契約に置き換える 「いい感じに」は再現しない。トークンと部品と機械検査は再現する 二 生成AIより検証AI 品質は生成時でなく、別のAIが実物を目視するループで生まれる。自己申告は信じない 三 注意書きは構造で消す 「気をつけて使う」が要る仕組みは未完成。symlink・ガード・検査に置き換える AIに品質を出させる3か条 11 / 12 # Page. 12 ![Page Image](https://bcdn.docswell.com/page/3EK96R99ED.jpg) CHATGPT-BU · LT - SLIDES BUILT BY THE SYSTEM THEY DESCRIBE nomuraya このスライドも、 その仕組みで作られています テーマ契約✓ / 機械検査✓ / 独立採点ループ✓ CHATGPT部 LT - 2026.07 12 / 12