Slide 1

Slide 1 text

bolt.new in 実務 2025 . 01 . 14 AI駆動開発勉強会 1 PRESENTER: @ko-hi-san BY CREATIONLINE.Inc

Slide 2

Slide 2 text

bolt.new in 実務 自己      紹介  CREATIONLINE.Inc 2 クリエーションライン株式会社 フルスタックエンジニア 好きなもの #うちの犬1匹 #うちの猫2匹 #妻1人 #田舎(香川) #コーヒー #beer #料理 #飲酒 #おしゃべり #アニメ鑑賞

Slide 3

Slide 3 text

bolt.new in 実務 目 次 CREATIONLINE.Inc 3 1. Outline(結論) 2. Intro-background(背景) 3. Adoption Hurdles(導入の壁) 4. dev flow(開発の流れ) 5. outcome(成果) 6. know-how & Challenges (ノウハウと課題) 7. Next-Step(展望)

Slide 4

Slide 4 text

“ bolt.new in 実務 CREATIONLINE.Inc まずは取り入れてみよう。 チームにあった導入方法を考え、 小さく使っていけば、 おのずと先が見えてくる。 4 outline 今日お伝えしたいこと その1

Slide 5

Slide 5 text

“ bolt.new in 実務 CREATIONLINE.Inc PoC開発にbolt.newを 採用したことで開発スピードが 向上した!!! 5 outline 今日お伝えしたいこと その2

Slide 6

Slide 6 text

bolt.new in 実務 Intro- background 背景 CREATIONLINE.Inc 6

Slide 7

Slide 7 text

bolt.new in 実務 CREATIONLINE.Inc 7 ● 全社のソフトウェア開発プロジェクトを採算管理 するシステム ● 2024/10~2025/12 の短期間(納期必達) ● 要求定義はある程度完了しているが、 要件定義はこれから ● 要件を落とさないと間に合わない ボリューム感 大企業の 社内システム開発 プロジェクト

Slide 8

Slide 8 text

bolt.new in 実務 CREATIONLINE.Inc 8 顧客 ● システム企画部 3名 開発チーム ● システム開発部 ○ プロダクトオーナー 1名 ○ エンジニア 4名 (うち3名が弊社) チーム体制

Slide 9

Slide 9 text

bolt.new in 実務 CREATIONLINE.Inc 9 ● 開発期間が短く、人員を増やすことの効果は乏し い ● 開発期間が短く、後から要件がひっくり返ると取り 返せない。 ● エンドユーザーの期待する機能を探りつつ、不要 な要件を落としていく 当時考えたこと

Slide 10

Slide 10 text

bolt.new in 実務 CREATIONLINE.Inc 10 1. アジャイル こまめに顧客からのFBが欲しい 手戻りを最小限に抑える 2. PoC まずは顧客の要求を形にし、実際に使えそうかイ メージを掴んでもらう 3. AIを活用した開発生産性の向上 PoCを爆速で作るために、bolt.newを採用する Cursor および Copilotを使用する 決めたこと

Slide 11

Slide 11 text

bolt.new in 実務 CREATIONLINE.Inc 11 <2024/11> ● リリース直後から社内チームが検証を開始 ● 11月後半には社内向けの勉強会開催 bolt.newを事前に触っていたことでメンバー間の知識 のベースラインが揃っており、すぐに使うことができる。 ツール特性として、コード全体を見ながら大きくコードを 生成してくれる。 なぜbolt.new?

Slide 12

Slide 12 text

bolt.new in 実務 Adoption Hurdles 導入の壁 CREATIONLINE.Inc 12

Slide 13

Slide 13 text

bolt.new in 実務 CREATIONLINE.Inc 13 セキュリティ面の考慮 データの取り扱いについて調査を実施 ● teamプランを採用(メールサポートの有無) ● 運営に学習に使用されないことを確認 ● 入力禁止用語等のガイドラインを作成し、準拠し て利用する ガバナンス

Slide 14

Slide 14 text

bolt.new in 実務 CREATIONLINE.Inc 14 不確実性回避 人間誰しも初めてのことは不安に感じるもの ● AIが生成するコード品質への心配 心理的不安 現実を整理する ● スピード面はAIに分がある ● 品質は私たちでカバーする

Slide 15

Slide 15 text

bolt.new in 実務 Dev Flow CREATIONLINE.Inc 15 開発の流れ

Slide 16

Slide 16 text

bolt.new in 実務 CREATIONLINE.Inc 16 動きはない状態で まずは必要な機能 について認識ズレ がないことを顧客と 合意する 開発者も全員同席 する 合意のとれた機能 からboltでコードを 生成する boltで実装の難し い箇所や 軽微な修正、 リファクタリング等 を実施する 完成した機能を顧 客に見てもらい、修 正点をバックログ に積んでいく ワイヤー作成 顧客との合意 bolt.new コーディング 顧客レビュー 1機能に対して、boltでの実装と手実装を明確に分離する。 boltは開発スピードを高めるためのサポートツールとして、boltで作り切ることに固 執しないよう意識した。

Slide 17

Slide 17 text

bolt.new in 実務 outcome CREATIONLINE.Inc 17 成 果

Slide 18

Slide 18 text

bolt.new in 実務 “一般的なWEBのUI” “PoCとしてプロダクトレベルの品質 を求めない” という前提であれば、 許容できる品質のものは手実装に比 べて倍以上のスピードがでることも。 ものによっては1ページが 30分ほど で完成する。 開発スピードの向上 50%↑ (感覚です。すみません。) 18 CREATIONLINE.Inc

Slide 19

Slide 19 text

顧客からの感謝 CREATIONLINE.Inc 実際に手を動かし始めてから約三週間ほどでメインの ユーザーストーリーを(フロントだけだが)顧客に見せる ことができた。 「大変な中で作り上げてくれてありがとう。」 「これからもよろしく。」 嬉しいコメントをいただけました。 まだまだ開発は続きますし、改善点もまだまだありま す。 引き続き頑張ろう。

Slide 20

Slide 20 text

bolt.new in 実務 Know-how & Challenges 20 ノウハウと課題 CREATIONLINE.Inc

Slide 21

Slide 21 text

bolt.new in 実務 CREATIONLINE.Inc 21 ” jspreadsheet ”という有料ライブラリを使用 ドキュメントを渡しても無理やりDOM操作で実現しようと してしまう… 結論、boltは使用せず手動でコーディングすることにし た AIの学習データの少なさが起因している可能性? 有料ライブラリ意外にも苦手な領域がきっとあるので、 導入フェーズでの認識合わせを推奨 ① 有料ライブラリ に弱い Know-how

Slide 22

Slide 22 text

bolt.new in 実務 CREATIONLINE.Inc 22 開発スピードが高速な分、コミュニケーション頻度を 高める必要がある。 ● 誰がどのバックログに着手するか ● 共通で使えるメソッドはないか など、これまで以上に密なコミュニケーションが求めら れる。 レビューは割り込みとして優先的に対応するなど、開 発体制もツールに合わせてブラッシュアップが必要。 ② メンバー間の コミュニケーション の重要性 Know-how

Slide 23

Slide 23 text

bolt.new in 実務 CREATIONLINE.Inc 23 「1箇所が完成しても、気づいたら別の機能がなくなって いる」という事象も。 → Next.jsのAppRouterを採用し、フォルダ単位で機 能を分けて生成することでリスクを軽減。 これについては現在StackBlitzチームが Github連携 を開発中とのこと。 ③ デグレ対応 Know-how Challenges

Slide 24

Slide 24 text

PRESENTATION NAME 24 Next-Step 展 望 CREATIONLINE.Inc

Slide 25

Slide 25 text

bolt.new in 実務 AI 駆動開発 テスト 駆動開発 25 CREATIONLINE.Inc

Slide 26

Slide 26 text

bolt.new in 実務 CREATIONLINE.Inc 26 テストリスト(todoリスト)を作り、テストコード含めて実装してもらう コード生成された時点で、以下ができていることに。 ①仕様を満たしている(仕様が明確になっている) ②テストコードがあるのでリファクタリングできる PoCから本番開発への移行がスムーズに AI駆動開発 × テスト駆動開発 = AI駆動テスト駆動開発 AIDTDD

Slide 27

Slide 27 text

“ bolt.new in 実務 CREATIONLINE.Inc まずは取り入れてみよう。 チームにあった導入方法を考え、 小さく使っていけば、 おのずと先が見えてくる。 27 outline 今日お伝えしたいこと その1

Slide 28

Slide 28 text

“ bolt.new in 実務 CREATIONLINE.Inc PoC開発にbolt.newを 採用したことで開発スピードが 向上した!!! 28 outline 今日お伝えしたいこと その2

Slide 29

Slide 29 text

THANK YOU 弊社に興味もってくれたかたは ぜひ一度カジュアル面談を! 29 ご清聴ありがとうございました!