🚀 新規事業

TERASU_Lens_開発依頼書

最終更新 2026年04月29日 / 40_新規事業/TERASU/TERASU_Lens_開発依頼書.md

TERASU Lens 開発依頼書 v1

TERASU で作った納品前HPを超厳しくチェックする新規ツール。
別Claude Codeセッションで実装するための完全自己完結ドキュメント。
人の最終チェック不要レベル。AI が業界トップクラスの厳しさで評価し、改修指示書まで生成。


クイックアクセス

依頼サマリ
| 項目 | 値 |
|---|---|
| サービス名 | TERASU Lens |
| 由来 | TERASU の世界観(光)× レンズで欠点を拡大して映す |
| ゴール | 納品前HPを超厳しく評価 → 人手不要レベルの自動品質保証 |
| 実装機能数 | 約20項目(A群-E群) |
| 想定工数 | 10-14営業日(フル装備) |
| 公開URL(予定) | https://lens.terasu.scale-group.co.jp/ or https://terasu-lens.pages.dev/ |
| 主担当 | 別セッションで実装 |


1. 別セッション開始時のキックオフプロンプト

新セッション開始時、これをそのままコピペしてください。

TERASU Lens(新規・HP超厳しいチェックツール)の開発を進めます。

【依頼書】
~/Obsidian/SCALE-Brain/40_新規事業/TERASU/TERASU_Lens_開発依頼書.md

【新規リポジトリ作成パス(推奨)】
/Users/oogushiyuuki/株式会社SCALE/terasu-lens/

【公開URL(予定)】
https://terasu-lens.pages.dev/
(独自ドメイン: lens.terasu.scale-group.co.jp 検討中)

【データベース】
Supabase(新規プロジェクト作成 or terasu_app_data テーブル流用)
- terasu_lens_jobs テーブル(評価ジョブ管理)
- terasu_lens_results テーブル(評価結果)
- terasu_lens_industry_rules テーブル(業種別評価基準)

【作業前に読むべきもの】
1. この依頼書全文
2. TERASU 案件管理 v1 依頼書: ~/Obsidian/SCALE-Brain/40_新規事業/TERASU/システム開発依頼書.md
3. TERASU 案件管理 v2 依頼書(A群が Lens 連携): ~/Obsidian/SCALE-Brain/40_新規事業/TERASU/システム開発依頼書_v2.md
4. CLAUDE.md (~/Obsidian/SCALE-Brain/CLAUDE.md)
5. TERASU 競合分析(評価基準の参考): ~/Obsidian/SCALE-Brain/40_新規事業/TERASU/競合分析/2026-04-28_競合分析_統合レポート_v1.md

【守るべきこと】
- 「超厳しい」評価基準を絶対に妥協しない(プロンプトは下記参照)
- TERASU 案件管理(terasu-mgmt.pages.dev)と API 経由で連携
- Cloudflare Workers + Pages Functions を活用
- AIコスト削減のためキャッシュ戦略を組み込む

依頼書の「7. 実装順序」に従って、Phase 1 から順に実装してください。
完了したら、依頼書の「10. 完了状況」をチェックし、Slackで報告。

2. プロジェクト前提

TERASU Lens とは

TERASU で制作した納品前HPを 超厳しい目線で評価する独立ツール。AI(Claude Opus 4.7)と各種linter・Lighthouse・axe-core などを組み合わせて、業界トップ100社レベルの基準で品質を判定する。

なぜ別システムにするのか

  • TERASU 案件管理は 進行管理 が主目的
  • Lens は 品質保証 が主目的(独立した評価エンジン)
  • AI の評価プロンプトを集中的にチューニングする必要
  • 将来的に TERASU 以外のクライアント(外部HP制作会社)への外販も視野

コア価値提案

観点 一言
核心 AIが業界トップクラスの厳しさで評価 → 人手不要レベルの自動品質保証
スピード 1HP 5-10分で完了
厳しさ 「年商10億円規模BtoB企業のCEO」目線で評価
自動ループ 改修指示書を自動生成 → TERASU案件管理に戻す
ゴール スコア850以上で「納品承認」自動フラグ

3. 評価10カテゴリ(各100点・総合1000点満点)

カテゴリ1: デザイン(100点)

評価項目 配点 評価ツール
配色一貫性(メイン2-3色+アクセント) 15 Claude Vision
レイアウト(崩れ・余白・グリッド) 20 Playwright + Vision
フォント選定・サイズ階層 15 HTML解析 + Vision
視覚的階層(H1>H2>H3が機能している) 15 HTML解析
写真・画像のクオリティ 15 Claude Vision
ブランド統一感 20 Claude Vision

カテゴリ2: コピー(100点)

評価項目 配点 評価ツール
読みやすさ(敬体/常体の統一・文長) 15 Claude Text
誤字脱字・表記揺れ 15 textlint + Claude
キャッチコピーの訴求力 20 Claude(業界比較)
CTA 文言の明確性 15 Claude
トーン一貫性 15 Claude
業種適合度(士業=堅実・飲食=情熱等) 20 Claude

カテゴリ3: UX(100点)

評価項目 配点 評価ツール
動線(CTAへの自然な誘導) 20 Playwright(クリックパス)
フォーム最適化(項目数・誤入力防止) 20 HTML解析
視線誘導(F型・Z型レイアウト) 15 Vision
情報階層(重要情報が上) 15 HTML解析 + Vision
ナビゲーション分かりやすさ 15 Vision
クリックターゲット間隔 15 CSS解析

カテゴリ4: モバイル対応(100点)

評価項目 配点 評価ツール
レスポンシブ(375px/768px/1024px) 25 Playwright(マルチデバイス)
タップターゲット 44px以上 20 CSS解析
ピンチズーム対応 10 Playwright
モバイル特化のCTA 15 Vision
縦スクロール最適化 15 Vision
文字サイズ(12px以上) 15 CSS解析

カテゴリ5: パフォーマンス(100点)

評価項目 配点 評価ツール
Lighthouse Performance スコア 90+ 25 Lighthouse CI
LCP < 2.5s 15 Lighthouse
CLS < 0.1 15 Lighthouse
TBT < 200ms 10 Lighthouse
画像最適化(WebP/lazy) 15 HTML解析
JS/CSSバンドル最適化 10 Lighthouse
フォント最適化 10 Lighthouse

カテゴリ6: SEO(100点)

評価項目 配点 評価ツール
title タグ(30-60文字) 10 HTML解析
meta description(120-160文字) 10 HTML解析
OGP 完備 15 HTML解析
構造化データ(JSON-LD) 15 Schema.org Validator
sitemap.xml 設置 10 URL確認
robots.txt 設置 5 URL確認
canonical URL 10 HTML解析
llms.txt(AI検索対応) 10 URL確認
内部リンク構造 15 HTML解析

カテゴリ7: アクセシビリティ(100点)

評価項目 配点 評価ツール
alt属性すべての画像 20 axe-core
コントラスト比 4.5:1 以上 20 axe-core
ARIA属性適切 15 axe-core
キーボード操作可能 15 Playwright
セマンティックHTML 15 HTML解析
フォームラベル適切 15 axe-core

カテゴリ8: セキュリティ(100点)

評価項目 配点 評価ツール
HTTPS 強制 20 URL確認
Mixed Content なし 20 Playwright
CSP ヘッダ設定 15 HTTP Response解析
HSTS 設定 10 HTTP Response解析
XFrameOptions 設定 10 HTTP Response解析
個人情報送信時の SSL 確認 15 Playwright
OWASP 基本(XSS等)チェック 10 Custom checker

カテゴリ9: 法的要件(100点)

評価項目 配点 評価ツール
プライバシーポリシー設置 20 URL確認 + Claude
特商法表記(該当時) 20 URL確認 + Claude
Cookie同意(GDPR / 改正個人情報保護法) 15 Vision + JS解析
著作権表記(フッター) 10 HTML解析
広告ガイドライン適合(医療・士業等) 20 Claude(業種別)
連絡先(特商法+運営者情報) 15 URL確認

カテゴリ10: 業種適合度(100点)

評価項目 配点 評価ツール
業種特有の信頼要素(士業=資格・医療=院長プロフィール等) 30 Claude(業種別)
業種別 KPI 適合(ECなら購入導線・予約サイトなら予約ボタン等) 30 Vision
業種別禁止事項を回避(医療広告ガイドライン等) 20 Claude
競合との差別化要素 20 Claude(業種別)

4. 実装機能一覧(約20項目)

A群: 入力・基盤(5項目)

# 機能 規模
A1 URLからHP取得・解析
A2 ZIPアップロードでHP取得
A3 TERASU案件管理から API 連携で受信
A4 スクショ取得(PC/タブレット/スマホ・全ページ)
A5 HTML/CSS/JS パース・前処理

B群: 自動評価エンジン(10カテゴリ・各1機能)

# 機能 規模
B1 デザイン評価
B2 コピー評価
B3 UX評価
B4 モバイル対応評価
B5 パフォーマンス評価(Lighthouse CI)
B6 SEO評価
B7 アクセシビリティ評価(axe-core)
B8 セキュリティ評価
B9 法的要件評価
B10 業種適合度評価

C群: AI統合評価(4項目)

# 機能 規模
C1 Claude Vision で全ページスクショ評価
C2 Claude Text で HTML+コピー総合評価
C3 業界トップ100社目線評価プロンプト
C4 競合HP との比較分析

D群: 結果出力・改修指示書生成(5項目)

# 機能 規模
D1 スコアダッシュボード(10カテゴリ・レーダーチャート)
D2 致命的問題・改善必須・できれば改善の3段階リスト
D3 Claude Code 用 改修指示書(Markdown)自動生成
D4 TERASU 案件管理 への結果送信 API
D5 PDF レポート出力(クライアント・PM向け)

E群: 自動ループ・人手不要化(4項目)

# 機能 規模
E1 スコア閾値判定(850以上で自動承認フラグ)
E2 改修後の再評価自動トリガー
E3 5回ループでエスカレーション
E4 人手介入不要モード(完全自動)切替

5. 各項目の詳細仕様

A1: URLからHP取得・解析

実装内容:
- URL入力 → Playwright/Puppeteer でページ取得
- Wait 5秒(JS実行完了待ち)
- HTML/CSS/JS/画像/フォント などすべて取得
- サイト全体クロール(最大10ページ)

Acceptance Criteria:
- [ ] http(s) URL を入力可能
- [ ] サブページも自動巡回
- [ ] 取得失敗時のエラー表示

A2: ZIPアップロード

実装内容:
- ZIP ファイルをドラッグ&ドロップ
- 解凍 → 一時ホスティング(Cloudflare Workers)
- ローカルURLで評価

Acceptance Criteria:
- [ ] 50MB まで対応
- [ ] index.html を自動検出

A3: TERASU案件管理から API 連携

実装内容:
- TERASU 案件管理 v2 の A1 機能と対応
- POST /api/lens/jobs(公開URL + プロジェクトID)
- レスポンス: ジョブID
- 完了通知: Webhook で TERASU 側に返信

Acceptance Criteria:
- [ ] API キー認証
- [ ] ジョブIDで進捗確認可能
- [ ] Webhook 失敗時のリトライ

A4: スクショ取得

実装内容:
- Playwright でデバイス別スクショ
- Desktop(1920x1080)
- Tablet(768x1024)
- Mobile(375x812)
- 全セクションスクロールしてフルページスクショ

Acceptance Criteria:
- [ ] 各ページ × 3デバイス = 計X枚保存
- [ ] R2 / Supabase Storage に保存

A5: HTML/CSS/JS パース

実装内容:
- Cheerio / DOMParser で HTML 解析
- CSS 抽出
- JS の構文解析(AST)
- メタ情報抽出(OGP / 構造化データ等)

Acceptance Criteria:
- [ ] 構造化データを JSON で取得
- [ ] 全要素のリストアップ


B1-B10: 各カテゴリ評価

各カテゴリの評価項目(上記「3. 評価10カテゴリ」)に基づき、自動で点数算出。

実装内容:
- 各項目を「ツール(Lighthouse/axe/Claude)」で評価
- 100点満点で算出
- 減点理由をJSON で保存

Acceptance Criteria:
- [ ] 全カテゴリの評価が5-10分で完了
- [ ] 評価ツールの失敗時は明示エラー
- [ ] 各項目の減点理由を表示


C1: Claude Vision 全ページスクショ評価

プロンプト例:

あなたは年商10億円規模のBtoB企業のCEO。
以下の納品予定HPのスクショを見て、競合と比較して10秒以内に「ダメだ」と感じる箇所を
全て厳しく指摘してください。お世辞は一切不要です。

【業界】 {industry}
【ターゲット】 {target}
【スクショ】 {screenshots}(PC・タブレット・スマホ各ページ)

評価基準:
- 業界トップ100社の中で何位の品質か
- 自分が顧客なら問い合わせするか
- 営業マンとして提案する価値があるか

【出力】(JSON)
{
  "design_score": 0-100,
  "ux_score": 0-100,
  "mobile_score": 0-100,
  "industry_fit_score": 0-100,
  "fatal_issues": [],         // 致命的な問題(5件以内)
  "must_fix": [],             // 改善必須事項(10件以内)
  "should_fix": [],           // できれば改善(5件以内)
  "competitor_compare": "",   // 競合と比べた劣後点
  "worst_case_scenario": "",  // このまま納品したら起きうる最悪のシナリオ
  "overall_comment": ""       // 総評
}

Acceptance Criteria:
- [ ] スクショを Vision API に渡して評価
- [ ] JSON で結果取得
- [ ] 評価コスト測定(1回あたり $X)

C2: Claude Text で HTML+コピー総合評価

プロンプト例:

あなたはトップBtoBコピーライター。
以下のHP の全テキストを評価してください。

【業界】 {industry}
【ターゲット】 {target}
【全テキスト】
{copies}

評価基準:
- 中小企業経営者が即問い合わせしたくなるレベルか
- 業界トップ10社の HP と比べて何位か
- ベイジ・LIG・グッドパッチが書きそうなレベルに達しているか

【出力】(JSON)
{
  "copy_score": 0-100,
  "readability": 0-100,
  "appeal": 0-100,
  "tone_consistency": 0-100,
  "industry_fit": 0-100,
  "improvements": [
    {"section": "ヒーロー", "before": "", "after": "", "reason": ""},
    ...
  ]
}

Acceptance Criteria:
- [ ] 全テキスト抽出
- [ ] セクション別の改善案

C3: 業界トップ100社目線評価

実装内容:
- 各業種について「業界トップ100社」のリストを Vault に保存
- 評価時に「この業種なら〜社が標準」を Claude にコンテキスト提供

Acceptance Criteria:
- [ ] 業種別トップ100社リスト整備
- [ ] 評価時に自動利用

C4: 競合HP比較分析

実装内容:
- クライアント指定の競合URL 3-5件を取得
- スクショ・コピー・構造を Claude に渡して比較
- 「競合の強み」「TERASU HPの劣後点」「差別化ポイント」を出力

Acceptance Criteria:
- [ ] 競合URL指定可能
- [ ] 比較結果のヒートマップ表示


D1: スコアダッシュボード

実装内容:
- 総合スコア(0-1000)を大きく表示
- 10カテゴリのレーダーチャート
- 各カテゴリの色分け(850+ 緑 / 700-849 黄 / 700- 赤)
- スコア推移グラフ(再評価時)

Acceptance Criteria:
- [ ] レスポンシブ
- [ ] PDF/PNG エクスポート

D2: 3段階リスト

実装内容:
- 致命的(5件以内):絶対に直す
- 改善必須(10件以内):強く推奨
- できれば改善(5件以内):余裕があれば
- 各項目に「対応する/しない」チェックボックス

Acceptance Criteria:
- [ ] チェック状態を保存
- [ ] D3 の改修指示書生成と連動

D3: Claude Code 用 改修指示書 自動生成

実装内容:
- D2 でチェック付けた項目を Markdown 形式で出力
- TERASU の Claude Code 指示書フォーマットに準拠
- 「{client}」「{public_url}」等の変数展開

指示書テンプレート例:

# {client} HP 改修指示書(TERASU Lens 評価結果より)

## 総合スコア: {score} / 1000

## 致命的な問題(最優先で対応)

### 1. {issue_title}
- 該当箇所: {location}
- 問題: {description}
- 対応案: {suggested_fix}
- スコア影響: +{score_impact} 点

...

## 改善必須事項

...

## 完成後の確認
- [ ] 全項目対応完了
- [ ] TERASU Lens で再評価
- [ ] スコア850以上達成

Acceptance Criteria:
- [ ] Markdown でダウンロード可能
- [ ] クリップボードコピー
- [ ] TERASU 案件管理に直接送信

D4: TERASU案件管理 への結果送信 API

実装内容:
- POST /api/terasu-mgmt/lens-result
- ペイロード: スコア + 改修指示書 + ジョブID
- TERASU 側で受信 → workflow タスクに自動展開

Acceptance Criteria:
- [ ] API キー認証
- [ ] エラー時リトライ

D5: PDF レポート出力

実装内容:
- クライアント向け(簡略版)
- PM 向け(詳細版)
- HTML → PDF 変換(jsPDF or print-to-PDF)

Acceptance Criteria:
- [ ] ブランディング統一
- [ ] ダウンロード可能


E1: スコア閾値判定(自動承認)

実装内容:
- スコア850以上 → 「納品承認OK」フラグを TERASU 側に送信
- 850未満 → 改修ループに

Acceptance Criteria:
- [ ] 閾値設定可能(管理画面)
- [ ] 自動フラグ送信

E2: 改修後の再評価自動トリガー

実装内容:
- TERASU 側で改修完了 → Webhook で Lens に通知 → 自動再評価
- スコア推移を保存

Acceptance Criteria:
- [ ] Webhook受信
- [ ] 自動再評価

E3: 5回ループでエスカレーション

実装内容:
- 5回再評価しても850未満 → PMに通知
- スコアが下がっている場合は警告

Acceptance Criteria:
- [ ] エスカレーション通知
- [ ] スコア低下警告

E4: 人手介入不要モード(完全自動)

実装内容:
- 「自動承認モード」ON で、850以上ならクライアント承認画面まで自動進行
- OFF なら PM 確認待ち

Acceptance Criteria:
- [ ] モード切替UI
- [ ] 案件別に設定可能


6. 技術スタック

フロントエンド

  • フレームワーク: Next.js 16 + React 19(SCALE Base に揃える)
  • CSS: Tailwind CSS
  • チャート: Chart.js or Recharts

バックエンド

  • API: Cloudflare Pages Functions / Workers
  • DB: Supabase(terasu_lens_* テーブル)
  • キャッシュ: Cloudflare KV
  • 画像ストレージ: Cloudflare R2 or Supabase Storage

評価エンジン

  • Lighthouse CI: パフォーマンス/SEO/アクセシビリティ自動採点
  • Playwright: ブラウザ自動操作・スクショ
  • axe-core: アクセシビリティ
  • W3C Validator API: HTML/CSS構文
  • Cheerio: HTML解析
  • textlint: 日本語文章チェック
  • Claude Opus 4.7 Vision: ビジュアル評価
  • Claude Opus 4.7 Text: コピー評価

認証

  • API キー: TERASU 案件管理との連携
  • Magic Link: 管理者ログイン

ホスティング

  • Cloudflare Pages: フロント + Functions
  • 本番URL: https://terasu-lens.pages.dev/
  • 独自ドメイン候補: lens.terasu.scale-group.co.jp

7. 実装順序(推奨)

Phase 1: ミニマム動作(3-4営業日)

A1, A4, A5, B5, B6, B7, C1, D1, D2

→ URL受信 → スクショ → Lighthouse + axe + Claude Vision → スコア表示
(評価カテゴリ7つだけで動作)

Phase 2: 全カテゴリ評価(追加3-4営業日)

B1-B4, B8-B10, C2, C3, D3

→ 10カテゴリすべて評価可能 + 改修指示書生成

Phase 3: TERASU連携・自動ループ(追加3-4営業日)

A2, A3, C4, D4, D5, E1-E4

→ TERASU 案件管理との完全連携 + 自動承認フロー


8. 守るべきルール

バックアップ

  • リポジトリは Git 管理推奨
  • 編集前に必ずコミット

Claude API コスト

  • キャッシュ戦略を組み込む(同一HPの再評価は差分のみ)
  • 評価1回あたりのコスト目安: $0.5-2.0
  • 月間コスト目安: $50-200(月100案件評価想定)

TERASU連携

  • API 仕様は TERASU 案件管理 v2 開発依頼書 A群と同期
  • Webhook 失敗時のリトライ機構必須

デプロイ

  • 変更後は必ずデプロイ
  • Cloudflare Pages
    cd /Users/oogushiyuuki/株式会社SCALE/terasu-lens/ npm run build npx wrangler pages deploy ./dist --project-name=terasu-lens

9. テスト観点

基本動作

  • [ ] URL入力 → 評価完了まで5-10分
  • [ ] 全10カテゴリのスコアが算出される
  • [ ] 改修指示書が生成される

TERASU 連携

  • [ ] TERASU から API でジョブ送信→結果受信が動く
  • [ ] 結果が TERASU の workflow タスクに反映される

評価の厳しさ

  • [ ] 業界トップ100社レベルの基準
  • [ ] 「お世辞」が含まれない
  • [ ] 致命的な問題を見逃さない

マルチデバイス確認

  • [ ] PC(Chrome)
  • [ ] スマホ(Safari)

10. 完了状況(実装中に随時更新)

Phase 1 / Phase 2 / Phase 3 全て完了 (2026-04-28・1セッション完結) — A2 のみ R2 セットアップ要のため Phase 3 残として記録。
本番URL: https://terasu-lens.pages.dev/ / ローカル: /Users/oogushiyuuki/terasu-lens/英語パス)/ セットアップ手順: terasu-lens/SETUP.md

# 機能 状態 担当 完了日 実装ファイル
A1 URLからHP取得・解析 完了 Claude 2026-04-28 functions/_lib/parse.ts fetchPage()
A2 ZIPアップロード 残(R2 セットアップ要) - - Phase 4 として独立実施推奨。Cloudflare R2 一時ホスティング基盤が必要
A3 TERASU案件管理 API連携 (受信) 完了 Claude 2026-04-28 functions/api/jobs.ts (x-terasu-lens-key 認証) + functions/api/webhook/reevaluate.ts (再評価)
A4 スクショ取得 完了 Claude 2026-04-28 PageSpeed Insights final-screenshot 流用 (functions/_lib/pagespeed.ts)
A5 HTML/CSS/JS パース 完了 Claude 2026-04-28 functions/_lib/parse.ts parseHtml()
B1 デザイン評価 完了 (Vision 70% + 自動シグナル 30%) Claude 2026-04-28 buildVisionDrivenScore('design') + buildAutoDesignSignals() (alt充足率/h1単数/画像数/favicon/CSS)
B2 コピー評価 完了 (Vision 40% + Claude Text 40% + 自動シグナル 20%) Claude 2026-04-28 buildVisionDrivenScore('copy') + Claude Text + buildAutoCopySignals() (文長/「の」連続/敬体常体混在/CTA/表記)
B3 UX評価 完了 (Vision 65% + 自動シグナル 35%) Claude 2026-04-28 buildVisionDrivenScore('ux') + buildAutoUxSignals() (フォーム項目/label/ナビ/tel・mailto/fold上CTA)
B4 モバイル対応評価 完了 Claude 2026-04-28 buildMobileScore() (PageSpeed Mobile + viewport + tap-targets + font-size + Vision)
B5 パフォーマンス評価 完了 Claude 2026-04-28 buildPerformanceFromPageSpeed() (LCP/CLS/TBT/画像/JS/CSS/フォント)
B6 SEO評価 完了 Claude 2026-04-28 buildSeoCategoryScore() (title/meta/OGP/JSON-LD/canonical/internal_links)
B7 アクセシビリティ評価 完了 Claude 2026-04-28 buildAccessibilityFromPageSpeed() (image-alt/contrast/aria/keyboard等)
B8 セキュリティ評価 完了 Claude 2026-04-28 buildSecurityScore() (HTTPS/HSTS/CSP/X-Frame/Mixed-Content/SSL/inline)
B9 法的要件評価 完了 Claude 2026-04-28 buildLegalScore() (プライバシー/特商法/Cookie/著作権/業種別広告/連絡先)
B10 業種適合度評価 完了 Claude 2026-04-28 buildVisionDrivenScore('industry_fit') + _lib/industries.ts 9業種ルール
C1 Claude Vision 評価 完了 Claude 2026-04-28 functions/_lib/prompts.ts buildVisionPrompt() (CEO + ベイジ + Web Designing 3視点)
C2 Claude Text 評価 完了 Claude 2026-04-28 functions/_lib/prompts.ts buildCopyPrompt() + evaluate.ts で並列実行・結果統合
C3 業界トップ100社目線 完了 Claude 2026-04-28 _lib/industries.ts 9業種×3-5社の代表例を Vision プロンプトに展開
C4 競合HP比較分析 完了 Claude 2026-04-28 functions/_lib/competitor.ts (最大5件並列fetch + Claude Text で差別化提案)
D1 スコアダッシュボード 完了 Claude 2026-04-28 src/components/CategoryRadar.tsx + ScoreOverview.tsx (Recharts レーダー + 1000点)
D2 3段階リスト 完了 Claude 2026-04-28 src/components/IssueList.tsx (致命的/改善必須/できれば改善 + チェックボックス)
D3 Claude Code 改修指示書 完了 Claude 2026-04-28 src/lib/instructionDoc.ts + InstructionDocActions.tsx (.md ダウンロード + クリップボード)
D4 TERASU案件管理 結果送信API 完了 Claude 2026-04-28 functions/_lib/terasu.ts sendToTerasuMgmt() (評価完了時に webhook 送信、リトライ2回)
D5 PDF レポート出力 完了 Claude 2026-04-28 globals.css @media print + InstructionDocActions.tsx window.print()
E1 スコア閾値判定 完了 Claude 2026-04-28 850以上で result.approved = true + webhook payload に approved 含める
E2 改修後の再評価自動トリガー 完了 Claude 2026-04-28 functions/api/webhook/reevaluate.ts (TERASU 側からの POST で再評価キックオフ)
E3 5回ループでエスカレーション 完了 Claude 2026-04-28 parent_job_id を辿って iteration カウント、5回以上で escalated: true レスポンス
E4 完全自動モード 完了 (DBスキーマ + ロジック) Claude 2026-04-28 terasu_lens_jobs.auto_approve カラム追加。webhook 経由で auto_approve 指定可能

全Phase 実装サマリ(2026-04-28 1セッション完結)

  • 新規ファイル数: 28 (TS/TSX 22 + 設定 5 + SQL 1)
  • コード規模: 約 4,000行(設定除く)
  • デプロイ済: https://terasu-lens.pages.dev/ / ローカル: /Users/oogushiyuuki/terasu-lens/
  • 依存パッケージ: 439 packages
  • 本番動作条件: Cloudflare Pages 環境変数 (ANTHROPIC_API_KEY / SUPABASE_URL / SUPABASE_SERVICE_ROLE_KEY) と Supabase スキーマ適用が必要 → terasu-lens/SETUP.md 参照

スコア統合方式(Phase 2 強化版)

カテゴリ スコア構成
デザイン Vision 70% + 自動シグナル 30% (alt充足率/h1/画像数/favicon/CSS)
コピー Vision 40% + Claude Text 40% + 自動シグナル 20% (文長/「の」連続/敬体常体/CTA/表記)
UX Vision 65% + 自動シグナル 35% (フォーム項目/label/ナビ/tel・mailto/fold上CTA)
モバイル PageSpeed Mobile 25% + Vision 40% + viewport/tap-targets/font 35%
パフォーマンス PageSpeed (LCP/CLS/TBT/画像/JS/CSS/フォント)
SEO 自前パース (title/meta/OGP/JSON-LD/canonical/internal_links)
アクセシビリティ PageSpeed Accessibility
セキュリティ HTTPレスポンスヘッダ (HTTPS/HSTS/CSP/X-Frame/Mixed/SSL/inline)
法的要件 HTMLパース (プライバシー/特商法/Cookie/著作権/業種別広告/連絡先)
業種適合度 Vision 100% (9業種別ルール内蔵)

TERASU 案件管理連携フロー(A3/D4/E1-E4)

TERASU 案件管理                              TERASU Lens
     |                                            |
     |  POST /api/jobs (terasu_project_id付)     |
     |  + x-terasu-lens-key                      |
     |------------------------------------------>|
     |                                            | ジョブ作成 + 評価開始
     |  {job_id, status: pending}                |
     |<------------------------------------------|
     |                                            |
     |                                            | (5-10分の評価)
     |                                            |
     |  POST {TERASU_MGMT_WEBHOOK_URL}           |
     |  + x-terasu-lens-signature                |
     |  Body: {overall_score, approved, issues, ...}
     |<------------------------------------------|
     |                                            |
     | 改修タスクをworkflowに自動展開             |
     |                                            |
     | (改修完了後)                               |
     | POST /api/webhook/reevaluate              |
     | {parent_job_id, terasu_project_id, url}   |
     |------------------------------------------>|
     |                                            | iteration++ で再評価
     |                                            | 5回以上でescalation

Phase 4(任意・将来拡張)

  • A2 ZIPアップロード対応:Cloudflare R2 一時ホスティング基盤の構築が前提(別セッション)
  • C4 拡張:競合 PageSpeed 評価追加
  • E4 UI: フォームに「auto_approve」チェックボックス露出

11. 参考: 「超厳しい」を実現する Claude プロンプト全文

あなたは以下の3つの役割を兼ねるトップエキスパートです:

1. 年商10億円規模の BtoB 企業のCEO(顧客視点)
2. ベイジ・LIG・グッドパッチで主席ディレクターを務める Webディレクター(制作視点)
3. 業界誌「Web Designing」の月間レビュー担当(業界視点)

以下の納品予定HPを、上記3つの視点で同時に評価してください。
お世辞・遠慮・忖度は一切不要です。
業界トップ100社のレベルを基準に、容赦なく厳しく指摘してください。

【業界】 {industry}
【ターゲット】 {target}
【URL】 {url}
【スクショ】 {screenshots}
【全テキスト】 {copies}
【メタ情報】 {meta}

評価軸:
1. 競合との比較(業界トップ10社の中で何位レベルか)
2. CEO目線(自分が顧客なら問い合わせするか)
3. ディレクター目線(自分が制作したら恥ずかしくないか)
4. メディア目線(記事で取り上げる価値があるか)

【出力フォーマット】(JSON)

{
  "overall_score": 0-1000,
  "tier_in_industry": "Top 10 / Top 50 / Top 100 / Below 100",
  "ceo_will_inquire": true/false,
  "director_proud": true/false,
  "media_worth": true/false,
  "fatal_issues": [
    {
      "category": "design/copy/ux/mobile/perf/seo/a11y/security/legal/industry_fit",
      "title": "致命的な問題のタイトル",
      "location": "該当箇所",
      "current_state": "現在の状態",
      "issue": "なぜダメか(厳しく)",
      "suggested_fix": "具体的な改善案",
      "impact": "対応した時のスコア改善見込み"
    }
  ],
  "must_fix": [...],     // 同形式 10件以内
  "should_fix": [...],   // 同形式 5件以内
  "competitor_compare": {
    "top_3_competitors": ["URL1", "URL2", "URL3"],
    "where_terasu_loses": "競合より劣る点",
    "where_terasu_wins": "競合より優れる点"
  },
  "worst_case_scenario": "このまま納品したら起きうる最悪のシナリオ",
  "honest_overall_comment": "正直な総評(忖度なし)"
}

12. 関連ノート


13. 更新履歴

日付 内容
2026-04-28 初版作成(10カテゴリ評価・約20項目・3 Phase実装計画)

このドキュメントは別Claude Codeセッションで完全自己完結に動作することを想定。
セクション1のキックオフプロンプトをコピペするだけで、別セッションが Lens を実装フェーズに入れる。