Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
VibeCodingで 加速する開発と支援
Search
永田哲平
June 10, 2025
0
790
VibeCodingで 加速する開発と支援
永田哲平
June 10, 2025
Tweet
Share
More Decks by 永田哲平
See All by 永田哲平
Claude Code VS Gemini CLI Let’s 競技Vibe Coding
teppei0717
1
200
「Devin!!! まだお前の口からまだ聞いてねェ!!! 『生きたい』と言えェ!!!!!!」
teppei0717
0
38
あなたの配信ワイワイたりていますか?? 配信を盛り上げるAI「waiwai-ai」を作った話
teppei0717
0
290
Featured
See All Featured
RailsConf 2023
tenderlove
30
1.2k
Mobile First: as difficult as doing things right
swwweet
223
9.9k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
We Have a Design System, Now What?
morganepeng
53
7.7k
Being A Developer After 40
akosma
90
590k
Unsuck your backbone
ammeep
671
58k
Facilitating Awesome Meetings
lara
55
6.5k
Automating Front-end Workflow
addyosmani
1370
200k
Six Lessons from altMBA
skipperchong
28
4k
The World Runs on Bad Software
bkeepers
PRO
70
11k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Transcript
1 VibeCodingで 加速する開発と⽀援 GMOペパボ株式会社 事業開発部 永⽥哲平
2 AI駆動開発・ AIツール活用 事例LT
3 AI駆動開発・ AIツール活用事例 LT 話すこと ・弊チームでのAI活用事例について 対象公聴者 ・AI活用事例について興味がある方 ・AIの推進や導入は進んでいるが、それがエンジニアに留 まってしまっていることに課題を感じたことがある方
4 ⾃⼰紹介 事業開発部 Alive Projectチーム 2024年 ⼊社 永⽥ 哲平 社内では「てつを。」と呼ばれています。 フロントエンドの開発することが多いです。
claude code ✖ git worktreeの並列開発体験が良す ぎてびっくりしています。 ゲーム(Valorant)とポーカーが趣味です。 • X : @tetsuwo0717
5
6
7 はじめに
8 OBSのフィルターの無料配布も 行なっている はじめに
9 OBSって? Open Broadcaster Softwareの略で、配信者がオンライン配信や録 画を行うためのオープンソースソフトウェア はじめに
10 OBSのフィルターって? 配信者が配信画面にエフェクト を加えるためのもので、例えば配信内 のソースの色を変えたり、画面の一部をモザイクにしたり、動きをつけ たりすることができる はじめに
11 OBSのフィルターって? →Luaスクリプトで作成することができる →フィルターのLuaスクリプトは主に、設定管理、レンダリング処理、 シェーダーコードの3つの構成要素から構成されている はじめに
12 一見すると「専門的な知識がないと作成できない」 弊チームではAIを活用することで、専門的な知識が無くてもフィル ターの作成を進める ことができ、かつ安全にリリースできるように取り 組んでいる。 はじめに
13 実際に以下のフィルターはSNSマーケター自らCursorを用いて作成 を行なった。 はじめに
14 アジェンダ 1. はじめに 2. 開発時のポイント 3. エンジニアとしての⽀援 4. まとめ
開発時のポイント 15 • Cursorで快適なVibe Codingをするために • ドキュメント化と知⾒の蓄積 開発時のポイント
Cursorで快適なVibe Codingをするために 開発時のポイント 16 Agent modeのON → デフォルトでoffになっている auto saveのON
→ on Focus Changeがおすすめ
Cursorで快適なVibe Codingをするために 開発時のポイント 17 rulesの整備 冗⻑なコメント/過剰なtry-catch/急な英語での返答、等々を抑制 →質の向上につながる 毎回伝えているプロンプトが不要 →速度の向上につながる
開発時のポイント 18 フィルターはスクリプトの中でOBS の機能を呼び出している。 OBSの機能を使ったフィルターで何 ができるのかを確認。 ドキュメント化と知⾒の蓄積
開発時のポイント 19 OBSの機能だけではできないことをAIと作ろうとしても存在 しない機能を使おうとして、いつまで経っても完成しない。 →OBSはOSSなのでソースコードが公開されている。 ドキュメント化と知⾒の蓄積
開発時のポイント 20 →できること。できないこと。してほしくないことをまとめる ドキュメント化と知⾒の蓄積
開発時のポイント Cursorにコンテキストとして与える →ワンパンの精度が劇的に向上した →「〇〇はできないですが〇〇ならできます」 のような代替案の提⽰まで 21 ドキュメント化と知⾒の蓄積
22 アジェンダ 1. はじめに 2. 開発時のポイント 3. エンジニアとしての⽀援 4. まとめ
エンジニアとしての⽀援 23 • すぐ試せる環境 • 既存のプロダクトが壊れないこと エンジニアとしての⽀援
24 OBSはもともとLuaスクリプトの変更が即時反映される仕組みを持ってい る→ワンクリックで結果をすぐ確認できる。 すぐ試せる環境 エンジニアとしての⽀援
25 フィルター配布は既存のプロダクトとは完全に 独⽴したリポジトリで管理している →「⾃分が作ったスクリプトをリリースすることによって既存のプロダクト が壊れてしまうかもしれない」という不安を払拭することができる。 既存のプロダクトが壊れないこと エンジニアとしての⽀援
26 アジェンダ 1. はじめに 2. 開発時のポイント 3. エンジニアとしての⽀援 4. まとめ
まとめ 「コードを書くこと」はエンジニアだけが⾏うものではなくなりつつある →イメージ(デザイン/スタイル/企画)を持つ本⼈がAIなどを活⽤して⾃ら 実装することで、役割をまたいだやりとりを省き、より効率的にアウトプッ トができた。 →エンジニアはAIが書くコードをより安全により楽にリリースできるように 努めるのも⼀つの⼿段。 27 まとめ
GMOペパボでは、新しい仲間を募集しています 募集中の職種や、詳しい社内の環境や制度に関しては GMOペパボ株式会社 採用サイト をご 覧ください。 28 まとめ
29 Thank you!