概要
Site Mechanic は総合的なウェブサイト診断プラットフォームです。URL を入力すると、SEO、パフォーマンス、アクセシビリティ、セキュリティ、タイポグラフィにわたる連携スキャンを実行し、その結果を優先度付きの改善提案とともに単一の重み付けスコアへと集約します。最初のコミットから収益化されたライブプロダクトまで、約 9 か月にわたる継続的な開発を経た、私の AI ポートフォリオの中で最もプロダクションとして鍛え上げられたプロジェクトです。
仕組み
スキャンエンジンは 10 の専門アナライザーを統括します。フォント検出、Core Web Vitals を含む Lighthouse のデスクトップ／モバイル監査、ベストプラクティス、WCAG アクセシビリティ、フォントライセンス、クロスブラウザチェック、リアルユーザーモニタリング、競合ベンチマーキングなどで、Puppeteer、Playwright、Lighthouse の上に構築されています。スキャンの進捗は Socket.IO を通じてブラウザにリアルタイムでストリーミングされ、完成したレポートは PDF に書き出せます。
AI レイヤー
Pro プラン限定のレコメンデーション機能がスキャン結果を Anthropic の Claude に送信すると、サイトの最も弱い領域に合わせた戦略的で平易な言葉のアドバイスが返ってきます。Claude はフォントペアリング分析も担っています。AI レイヤーはフィーチャーフラグで制御され、API キーがない場合はグレースフルに機能を縮退します。管理パネルではモデルごとの AI 支出を追跡でき、モデルピッカーで構成を切り替えられます（コスト重視なら Haiku、デフォルトは Sonnet、深い分析には Opus）。
エンジニアリングのハイライト
- プランごとに機能を制御するサーバーサイドのエンタイトルメントシステム。Stripe のサブスクリプション、デイパス、単発レポート購入に対応
- 両エンジンの並行テストスイートを走らせながら、稼働中に SQLite から PostgreSQL への移行を実施
- オートスケーリングとネットワークポリシーを備えた Kubernetes デプロイマニフェスト、Prometheus メトリクス、GitHub Actions による CI/CD
- フロントエンドフレームワークに依存しない 8 ロケール対応の独自 i18n レイヤー — 高速で依存の少ないバニラ JS
成果
190 を超えるコミットによる持続的なイテレーションを経た、収益化可能なライブ SaaS です。AI で強化されたプロダクトを、アイデアからアーキテクチャ、堅牢化、運用まで一貫して育て上げた証となっています。