--- title: Iが入って、チーム開発はどう変わったか 〜エンジニア以外もPRを作る、AI駆動開発の実践〜 tags: author: [あおき](https://www.docswell.com/user/aozame) site: [Docswell](https://www.docswell.com/) thumbnail: https://bcdn.docswell.com/page/4EZL5R2G73.jpg?width=480 description: Iが入って、チーム開発はどう変わったか 〜エンジニア以外もPRを作る、AI駆動開発の実践〜 by あおき published: October 09, 26 canonical: https://www.docswell.com/s/aozame/KWRYDP-2026-10-09-182710 --- # Page. 1 ![Page Image](https://bcdn.docswell.com/page/4EZL5R2G73.jpg) AI駆動開発勉強会 名古屋支部#2 2026.10.09 AIが入って、 チーム開発はどう変わったか 〜エンジニア以外もPRを作る、AI駆動開発の実践〜 青木大地 株式会社コラボスタイル シニアフロントエンドエンジニア 𝕏 @aozame_dev # Page. 2 ![Page Image](https://bcdn.docswell.com/page/Y76W9RVQ7V.jpg) AI駆動開発勉強会 名古屋支部#2 青木大地 株式会社コラボスタイル @aozame_dev シニアフロントエンドエンジニア 東京オフィスに出勤 横浜出身。最近、木更津市に引っ越し 個人開発：音声会話AIエージェント 最近ハマってること：CQRS + ES で、設計・開発 𝕏 𝕏 @aozame_dev # Page. 3 ![Page Image](https://bcdn.docswell.com/page/G75MN8D274.jpg) AIの精度が上がった今、みなさんに聞かせてください プログラム、どうやって作っていますか？ ✋ 2 そのコードを、AIに書いてもらっている ✋ 自分では1行も書いていない 3 コードは100% AIが書いている 🙌 1 プログラムを作っている # Page. 4 ![Page Image](https://bcdn.docswell.com/page/9J295K81ER.jpg) コードを書くのは、 必ずしも担当者でなくていいのでは？ # Page. 5 ![Page Image](https://bcdn.docswell.com/page/DEY4KN64JM.jpg) コラボスタイルのフロントエンドは、 デザイナーも PRを出せるようにしました # Page. 6 ![Page Image](https://bcdn.docswell.com/page/VJNYRXZ678.jpg) 今日話すこと 1 デザイナーもPRを出せるようになって、どうだったか 2 デザイナーもPRを出せるようにした3つの基盤 6 # Page. 7 ![Page Image](https://bcdn.docswell.com/page/YE9PM8ZRJ3.jpg) 修正の流れが、こう変わった 導入前 導入後 🎨 → 💻 → 💻 → 🎨 デザイナー エンジニア エンジニア デザイナー から依頼 が実装 がレビュー から事前相談 が実装 がレビュー 🎨 🎨 💻 デザイナー → デザイナー → エンジニア が確認 7 # Page. 8 ![Page Image](https://bcdn.docswell.com/page/GE8DL81GED.jpg) 実際に来たPR 月 5〜6本 デザイナーが作成したPR （2名） スクロールバーやホバーなど、細かい見た目の調整 バッジ・アイコン・文言を、デザインの決まりに揃える メニューの並びや、入力欄の幅の変更 UIパーツのカタログを整え、自動チェックを増やす 5本に1本ぐらいは修正が必要。作り替えや、バトンタッチで対応 8 # Page. 9 ![Page Image](https://bcdn.docswell.com/page/LELMLRQX7R.jpg) エンジニアにとって、よかったこと 🧭 諦めていた使いやすさに、手が入る 🤝 引き継ぎの時間が消えた 📦 依頼されるより、PRレビューの方が楽 🎯 修正内容が、具体的に分かる エンジニアは機能の実現と安定稼働が優先。 使いやすさは、デザイナーが直してくれる 簡単な修正でも、タスクだと管理コストに。 PRならレビューするだけ 依頼内容を聞き取る時間が不要に。 事前相談はさっと済む 言葉やカンプより、 PRのほうが「何をどう直すか」がはっきりする 他職種がプロダクトを触れる基盤を作るのも、エンジニアリング 9 # Page. 10 ![Page Image](https://bcdn.docswell.com/page/4JMYMR13JW.jpg) デザイナーにとって、よかったこと 😮‍💨 遠慮が消えた 🖼️ 既存画面の改善に、手を出せる 「こんな小さい修正を、今お願いしていいのか」 と迷わなくなった エンジニアのロードマップを待たずに、 自分たちの視点で手入れできる 🤝 やり取りが減った 🎬 動きまで触れる 説明や、説明のための整理、 実装修正後の確認などの工数が減った Figma だと、動きを作るのはコストがかかる。 アニメーションや操作感にも手を入れられる 10 # Page. 11 ![Page Image](https://bcdn.docswell.com/page/PJR9VRLR79.jpg) でも、デザイナーがPRを出すとなると… 🎨 デザイナー側 💻 エンジニア側 2 開発環境やプロダクトを、 壊してしまわないか？ 要修正のPRが増えて、 2 自分たちの負担が増えない？ git や GitHub、その他ツールを 1 ルール通りに使いこなせる？ 本当に修正できる？ 3 ソースコードを、 何度も聞いて、負担にならない？ 1 デザイナーの負担が増えて、 本来の業務に支障が出ない？ 採用できるPRが 3 そもそも、 作成されるのか？ 11 # Page. 12 ![Page Image](https://bcdn.docswell.com/page/PEXQZRWYJX.jpg) デザイナーもPRを出せるようにした3つの基盤 1 2 3 🤖 🏗️ AI以前からある 🤝 ルールづくり・ AIが開発手順を 辿れるようにした ローカルで動かせる プレビューデプロイ PRの段階で一定の品質 見るのは、動きだけ。 迷ったら、聞ける AI活用の基盤 開発基盤 サポート体制 # Page. 13 ![Page Image](https://bcdn.docswell.com/page/3EK98RV4ED.jpg) 基盤 ① AI活用の基盤 開発の工程ごとにスキルを整備し、プラグインとしてチームに設定 🛠️ 📝 💾 課題作成 → チケットから → 実装 コミット /fe:create-issue /fe:auto-issue /fe:commit /fe:auto-issue → 🔀 PR作成 /fe:create-pr 🔍 → レビュー /fe:review-code チケット番号を渡すだけで、実装からPR作成まで 一気に デザイナーが知っておくことは最低限。やり方はAIが知っている 13 # Page. 14 ![Page Image](https://bcdn.docswell.com/page/L73W28MD75.jpg) 基盤 ② AI以前からある開発基盤 誰でも簡単にローカルで動かせる セットアップの簡略化で、つまずく人ゼロへ ガイドと mise の1コマンドで、OSに関わらずミドルウェアのバージョンが揃う 重いバックエンドなしで、フロントの全機能を開発できる モックで動かせる。共通バックエンドにつないで、実データでの確認もできる これがなければ、デザイナーは実装に参加できなかった 14 # Page. 15 ![Page Image](https://bcdn.docswell.com/page/87DKZM62JG.jpg) 基盤 ② AI以前からある開発基盤 PRごとにプレビューデプロイされる PRごとにプレビュー環境 URLを開くだけで、ブラウザで確認できる PRごとに Storybook UIパーツ単位でも確認できる AIで増えるPRを、ローカルで起動せずに確認できる 15 # Page. 16 ![Page Image](https://bcdn.docswell.com/page/VJPKDRYLE8.jpg) 基盤 ② AI以前からある開発基盤 PRの段階で一定以上の品質になる 💾 コミット時 型チェック・lint・format lint・build・test build・Storybook build E2E /fe:commit が pnpm check を実行 🔀 PR時 GitHub Actions ／ Vitest 壊れていればコミットできない プレビュー環境に Playwright Vitest pnpm audit test 脆弱性監査 AIが最後まで修正を回すから、PRの時点で品質が揃う 16 # Page. 17 ![Page Image](https://bcdn.docswell.com/page/2EVV1RG6EQ.jpg) 基盤 ③ ルールづくり・サポート体制 コードは見なくていい 📏 ルール 確認するのは、期待した動きになっているか ワークショップ 🙌 サポート体制 環境構築からチケット・実装・PRまで全員が一通り 実装の問題はエンジニアが直す いつでも聞いてOK PRの説明文はAIに任せる 週1回のAI勉強会 要修正は5件につき1件ぐらい。無理ならバトンタッチ 分かりづらければエンジニアが直す PRで迷ったら、すぐ聞ける 2025年9月から毎週水曜、30回超 デザイナーはデザインの修正だけに集中。実装はPRの段階でエンジニアが管理する 17 # Page. 18 ![Page Image](https://bcdn.docswell.com/page/57GL2M82EL.jpg) 持ち帰ってほしいこと AIをチームで活用すれば、職種の境界を溶かせる 境界が溶けると、効率化と、専門性が届く場所が増える 効果的・持続的に運用するには、地道な基盤づくりが不可欠 1 AIが知っていて、 動ける環境 2 誰でも入れる環境 ご清聴ありがとうございました 𝕏 @aozame_dev 3 専門性に注力できる ルールづくり 18