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
750
VibeCodingで 加速する開発と支援
永田哲平
June 10, 2025
Tweet
Share
More Decks by 永田哲平
See All by 永田哲平
Claude Code VS Gemini CLI Let’s 競技Vibe Coding
teppei0717
1
160
「Devin!!! まだお前の口からまだ聞いてねェ!!! 『生きたい』と言えェ!!!!!!」
teppei0717
0
34
あなたの配信ワイワイたりていますか?? 配信を盛り上げるAI「waiwai-ai」を作った話
teppei0717
0
270
Featured
See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
990
Designing Experiences People Love
moore
142
24k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
710
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
29
9.6k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
47
9.6k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Statistics for Hackers
jakevdp
799
220k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
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!