■ 1. 記事の概要
- 楽楽販売開発チームが「楽楽シリーズUI統一プロジェクト」において、実装ではなく実装後のセルフチェック工程にAIを活用した事例の紹介
- テーマは「作業の性質を見極め、AIの勘所を押さえる」こと
- AIに任せられる作業と人間が責任を持つべき作業を見極め、適切な領域にAIを投入する判断の記録
■ 2. プロジェクトの背景
- 楽楽シリーズ各商材のデザインがばらついており、ユーザーの戸惑いが生じていた
- シリーズ横断の大規模な取り組みとして、共通デザインシステムへの準拠でUIを再構築した
- プロジェクトはフェーズ1とフェーズ2の二段階に分けて進められた
■ 3. フェーズ1: AIに任せられない領域
- 対象: 一般ユーザー向け画面（56画面）、期間: 約1年、AI活用: なし
- AI自動実装を使わなかった理由:
- 長年運用されたコア画面は既存デザインとJavaScriptが複雑に絡み合っていた
- 自動化に任せると既存実装を壊すリスクが大きすぎた
- 画面ごとに個別の事情があり、汎用ルールで一律に変換できる作業ではなかった
- フェーズ1での学び: 「AIに任せられない領域が確かにある」という現場の体感を得た
■ 4. フェーズ2: 規模拡大がもたらした課題と AI 活用
- 対象: 設定系画面（350画面）、期間: 約半年、AI活用: Cursor Rulesによるセルフチェック
- フェーズ1比で画面数が約6倍であるにもかかわらず、開発期間は半分に収まった
- この差は対象画面の性質、明確な実装ルール、並列開発体制など複数要因によるもの
- 新たな課題:
- 350画面分のレビュー依頼が並行して発生する中、ルール遵守の機械的チェックを目視で行うのは現実的でなかった
- レビュアーが「アイコン置換の確認」「不要クラスの削除確認」に時間を取られ、人間の判断が必要な本質的なレビューに集中できなかった
- フェーズ2ではチームで詳細な実装ルールを事前に整備しており、変換パターンが網羅的にドキュメント化されていた
■ 5. AI 活用の設計: セルフチェックへの投入
- 実装そのものではなく「実装ルールに沿っているかのセルフチェック」にAIを投入した
- セルフチェック導入の効果:
- 実装者が手元でルール遵守を事前確認できる
- レビュー依頼時点でルール観点のチェックが完了した状態になる
- レビュアーが人間の判断が必要な部分（UI崩れ、挙動の異常、UX品質）に集中できる
■ 6. Cursor Rules の仕組み
- Cursorの「Rules」機能を活用: プロジェクトルートにルールファイルを置くとAIが常に参照する
- 実装ルールをbefore/afterの具体例付きで章立てしたルールファイルとして整形した
- 主なルールカテゴリ:
- 不要な装飾要素の削除ルール
- アイコン体系の置換ルール
- パンくず構造の修正ルール
- メッセージ表示パターンの置換ルール
- ページネーション・パネル構造の置換・調整ルール
- JavaScript関数名の置換ルール
- LinterやFormatterでなくLLMを選んだ理由:
- パンくずやパネルの構造変更など、HTMLの文脈や画面全体の構成を踏まえないと正しく判定できない観点が多かった
- 機械的なパターンマッチだけでは拾いきれない、変更内容の意味を汲んだ柔軟な判断が必要だった
■ 7. 運用の手応え
- 定量データは取得していないが、現場での体感として以下の効果があった
- 人間の目視という不確定要素の低減:
- 大量の実装ルールを人間が抜け漏れなくチェックすることは困難
- AIによる事前チェックにより、見落としリスクが大幅に低下した
- 人間の判断が必要な領域への集中:
- ルール遵守チェックをAIに任せた分、レビュアーはUXや挙動の異常など本質的な観点に注力できた
- 350画面の改修を約半年で完遂した
■ 8. 振り返りと一般化できる学び
- 作業の性質と AI 活用の相性:
- 複雑で固有性が高い作業は人間が向き合う方が効率的
- 機械的でルール化でき量が多い作業はAI支援の効果が出やすい
- この見極めは机上では難しく、現場で手を動かして得られる感覚
- AI活用はワークフロー全体で成立する:
- 「実装ルールを決める（人間）」→「ルールをAI向けに翻訳する（人間）」→「AIによるセルフチェック（AI）」→「人間の判断が必要な部分に集中してレビュー（人間）」という工程
- 純粋な「AIの仕事」はセルフチェック実行のみであり、残りは人間の作業
- 「翻訳作業」が成否の鍵:
- AIが解釈しやすい構造に整え、具体例を添え、抜け漏れなく記述することが重要
- 成否を分けたのはモデルの性能よりも「AIに何を、どう渡すか」という設計
- 今回の取り組みの本質: 「AIに仕事を任せた」ではなく、「AIが得意な領域へ仕事を再分配した」
- 大量ルールの機械的適用 → AI
- ルールの定義、例外の判断、最終的な品質責任 → 人間