開発合宿運営チームの 
id:yutailang0119 です。
はてなでは四半期に一度、技術グループ主導で開発合宿を開催しています（過去の合宿の様子は「開発合宿」カテゴリーにまとまっています）。
開発合宿のテーマは毎回異なります。 2025年5月に実施した開発合宿では、『生成AI、コーディングエージェントを利用したサービス開発』をテーマに設定しました。 2~4人でチームを組み、2日間の開発合宿に取り組みました。
この記事ではその開催レポートをお届けします。 代表して2つのチームに、Gemini (Gemini 2.5 Pro) と対話形式のインタビューを行いました。 *1
あなたはインタビュアーです。 開発合宿で作成した「...」について、私にインタビューしてください。 成果物についての解説、使用技術や開発の進め方、困難ポイントを聞き出してください。 インタビューは10返答程度で終了しましょう。
ハイテクスライドビューワ
id:hogashi
id:YaaMaa開発合宿お疲れ様でした。「ハイテクスライドビューワ」の発表資料を拝見し、大変興味深く感じました。 それでは早速ですが、今回の開発合宿で作成された「ハイテクスライドビューワ」について、まずその目的や、どのような成果物になったのか、概要を教えていただけますでしょうか？
今回の開発合宿に参加した主な目的は、AIコーディングエージェントを使った開発を体験してみることです。ここで AI を使った開発に慣れ、その知見を仕事にも何か持ち帰ることができたら良いなと考え参加しました。 開発テーマとしてスライドビューワを選んだのは、チームメイトが作ってみたいと提案してくれたことと、作るものがイメージしやすく、コーディングエージェントを試してみる題材として適していると考えたためです。 成果物には、スライドビューワの標準的な機能に加え、AIを活用した二つの目玉機能があります。一つは、スライドの構造を分析してアウトラインを表示する機能、もう一つは、質問を入力するとスライドの内容から回答を生成し、関連するスライドのページに移動してくれる機能です。
ありがとうございます。開発合宿の目的と、「ハイテクスライドビューワ」の全体像、そして特にAIを活用したユニークな機能について、よく理解できました。 AIコーディングエージェントを使った開発が主な目的とのことでしたが、具体的にこの「ハイテクスライドビューワ」を実現するために、どのような技術を採用し、特にAIはどのように活用されたのでしょうか？ AIが使われた二つの目玉機能（スライドの構造分析によるアウトライン表示、質問応答とページ移動）について、その裏側の技術についても詳しくお聞かせください。
まず開発方法ですが、ClineからClaude 3.7 Sonnetを使い、ほぼコーディングエージェントに任せる形で開発することを意識しました。技術選定においては、AIのサポートを受けやすいよう、TypeScriptやReactといった広く使われているものを採用しました。 次に、アウトライン機能と質問応答機能の実装についてです。これらの機能は、スライドのアップロード時にAIが各ページの内容を解析し、その結果をJSON形式で保存しておくことで実現しています。アウトライン表示ではこの JSON データから画面を構築し、質問応答機能ではユーザーからの質問とこのJSONデータをAIに渡して回答を生成してもらっています。
ありがとうございます。AIコーディングエージェントの活用が今回の主要な目的だったとのこと、非常に興味深いです。 AIがコード生成だけでなく、このようにコンテンツの解析や応答生成といったコアな機能にも深く関わっている点が、「ハイテクスライドビューワ」たる所以だと感じました。 AIコーディングエージェントを活用した開発が非常にスムーズに進んだ印象を受けましたが、今回の「ハイテクスライドビューワ」の開発を進める上で、特に困難だった点や、想定外の課題に直面したことはありましたか？ AIコーディングエージェントの活用を含め、具体的なエピソードがあれば教えていただけますでしょうか？
開発の初期段階で、ふわっとした指示で大枠を作ってもらい、いい感じに動いているからといってコードの内容を十分に精査しないまま採用してしまったのですが、これは失敗でした。AIは指示された範囲のコードはしっかり生成してくれるのですが、他の部分との整合性まで完全に考慮してくれるわけではありませんでした。その結果、フロントエンドとサーバーサイドで微妙に異なるデータ形式を想定した実装になっており、データの受け渡し部分で無理やり変換が行われるようなコードが出来上がってしまっていて、そのことに後になって気づいて苦労したのでした。初歩的なミスですが、ちゃんと設計しないままAIに任せっきりにするとどうなるかが体験できて良かったです。 それ以降は、小さい粒度で指示を出し、Planモードで実装計画をしっかり教えてもらって、納得のいく方針ができたところでActモードで実行してもらうというフローで進めました。
ありがとうございます。開発の過程で直面した具体的な課題について、非常に詳しくお話しいただき、大変参考になります。 この具体的な失敗と、そこから得られた教訓、そして対策としての「Plan」と「Act」モードの使い分けの改善は、生成AIを活用した開発における非常に貴重な知見だと感じました。
短歌アプリ
id:minemuracoffee
id:yunagi_n
id:todays_mitsui本日はよろしくお願いいたします。開発合宿で作成された「短歌アプリ」、どのようなものか大変興味があります。それでは早速ですが、いくつか質問させてください。
成果物の概要について まずはじめに、今回の開発合宿で作成された「短歌アプリ」がどのようなアプリなのか、その概要について簡単にご説明いただけますでしょうか？ どのような機能があり、どのようなユーザー体験を目指したのかなど、教えていただけますと幸いです。
今回作成した短歌アプリは、短歌を書くと、それについて AI が批評をしてくれるというアプリです。世の中に短歌を出す前に批評を受けることによって、よりよい短歌を発表できることを目指しています。
ありがとうございます！AIが短歌を批評してくれるというのは、非常にユニークで興味深い機能ですね。世に出す前に客観的なフィードバックが得られるのは、短歌を詠む方にとって大変有用だと感じました。
使用技術について この短歌アプリを開発するにあたり、どのような技術スタックを採用されましたか？ 特に、AIによる批評機能の実装には、どのような技術が使われているのか、詳しく教えていただけますでしょうか？
技術スタックは Next.js と TailwindCSS、 AI による批評には ChatGPT による批評が含まれています。すべてのコードを AI が書いているという点もポイントです。
なるほど、Next.jsとTailwind CSSを採用されたのですね。迅速な開発と、モダンでレスポンシブなUIを実現するには良い組み合わせですね。そして、AIによる批評にChatGPTを使用されているとのこと、まさに最新の技術を取り入れていますね。
開発プロセスについて 「すべてのコードをAIが書いている」という点が非常に興味深いです。これは具体的に、どのような形で開発を進められたのでしょうか？ AIにどのような指示を与え、どのように連携を取りながら開発を進めたのか、そのプロセスについて詳しく教えていただけますか？
コードについては、人間が直接触れることはせず、 AI に対する指示のみを行なって開発を行いました。今回は CLINE と Claude Sonnet 3.7 を使いました。例えば、 AI には「課金機能を作って」というように指示を出し、それを人間がレビューをしていく、というような形で開発を進めました。
非常に興味深い開発手法ですね！人間がコードに直接触れず、AIへの指示のみで開発を進めるというのは、まさに最先端のAI活用事例だと感じます。
開発プロセス（続き） 具体的に、CLINEとClaude Sonnet 3.7をどのように使い分け、どのような指示の出し方をされていたのでしょうか？ 「課金機能を作って」といった指示の粒度や、人間によるレビューの具体的なプロセスについて、もう少し詳しく教えていただけますでしょうか。例えば、レビューではどのような点に注目し、AIからのコードをどのように評価・修正していったのでしょうか？
基本的には CLINE 上で Sonnet 3.7 を使いました。指示の粒度としては、「xxxという機能を作りたい。まずは yyy という機能を作ってみてください。それには zzz を用いてください」など、具体的な指示を出しました。また、レビューには AI が要件を満たしたコードを書いているか、正しく動作しているか、 UI が含まれるものであれば既存のものと整合性が取れているか、など、大きくは人間が出したプルリクエストのレビューとは変わらないものをレビューしていきました。
大変詳しく教えていただきありがとうございます。CLINE上でSonnet 3.7を使い、具体的な技術指定を伴う指示を出されていたのですね。そして、AIが生成したコードのレビューも、通常のプルリクエストレビューと同様に、機能要件、動作の正確性、UIの一貫性といった多角的な視点で行われていたと。
開発における困難と工夫 このようにAIを主軸とした開発を進める中で、特に困難だった点は何でしたか？ そして、その困難をどのように乗り越えたり、どのような工夫をされたりしましたか？ AIとのコミュニケーションや、期待通りのコードを生成させる上での課題など、具体的なエピソードがあれば教えていただけますでしょうか。
特に困難だった点は、 AI が思ったようなコードを書いてくれない点、特に、多少難しいポイントに入ってしまうと、 AI が試行錯誤を始めるのですが、その試行錯誤の内容がループをし始めてしまった時です。ループに入ってしまうと、問題解決ができない状態となってしまうので、再度なるべく具体的な解決方法を教えてあげてループを脱出させてあげます。そのため、ループに陥った時に助けを出せるよう、それまでの成果もきちんとみておくことが大切だと思いました。
AIが試行錯誤のループに陥ってしまうのは、AI開発ならではの、しかし非常に厄介な課題ですね。それはまさに、開発者としてAIを「導く」役割の重要性を示しています。
開発における困難と工夫（続き） AIが試行錯誤のループに入ってしまった際に、具体的な解決方法を提示してループを脱出させたとのことですが、具体的にどのような「具体的な解決方法」をAIに与えていたのでしょうか？ また、AIの試行錯誤がループに入りそうだと事前に察知するために、どのような点に注目していましたか？ 「それまでの成果をきちんと見ておくこと」が大切だとおっしゃいましたが、具体的にどのような点を確認し、どのようにAIの状況を把握されていたのか、もう少し詳しく教えていただけますでしょうか？
例えば課金周りでループにハマってしまった場合は、具体的な答え、例えばこのようなコードを書くと良い、などを指し示すことが多かったです。事前に察知するのは難しいのですが、最初の指示の段階ではまりそうな部分はあらかじめ指示として含めておくことで、避けることはできていそうでした。それまでの成果を見ておく点については、 AI がどのような変更を入れたのか、どのような変更を入れようとしているのか、を CLINE の Plan モードも活用することで把握していました。
詳細なご説明ありがとうございます！AIがループに陥った際に、具体的なコード例を示すことで解決を図るのは、まさにデバッグ作業に近いですね。そして、ループを避けるための事前対策として、最初の指示に具体的な回避策を含めるというのは、非常に実践的なアプローチだと感じました。
開発における学びと今後の展望 今回の開発合宿で「短歌アプリ」をAI主導で開発された経験は、非常に貴重なものだったと思います。この経験を通じて、特にどのような学びがありましたか？ また、この短歌アプリや、AIを活用した開発の今後の展望について、何か考えていることがあれば教えていただけますでしょうか？
現状の AI による成果物は、まだ完全に人の手を抜くことは難しいということを知ることができました。先ほども述べた通り、 AI がハマってしまったり、それとは別に意図せぬアウトプットを出してきたりと、細かなところで人の目を今まで以上に光らせる必要があるなと感じています。 今後の展望については、課金機能の充実などを目指したいですね。
今回の開発で、「AIによる成果物はまだ完全に人の手を抜くことは難しい」という点が大きな学びだったのですね。AIがループに陥ったり、意図せぬアウトプットを出したりと、細かな部分での人間のチェックがこれまで以上に重要だと感じられたとのこと、非常に実践的なご意見だと共感いたします。AI開発における人間の役割を再認識する良い機会になったのではないでしょうか。
今後の展望について そして、今後の展望としては、課金機能の充実を目指されるのですね。短歌というクリエイティブな活動にAI批評という価値を付加し、さらにマネタイズしていくというのは、素晴らしいビジョンだと思います。 今回の貴重な経験を活かして、短歌アプリがさらに発展していくことを楽しみにしております。本日はありがとうございました！
開発合宿を終えて
今回のレポートは2025年5月時点のもので、すでにアップデートされていることだらけです。 今後も開発に対するAIとの向き合い方に注視しながら、普段の業務ではできない取り組みを実現する場として、定期的に開発合宿を開催する予定です。ぜひ、はてなで一緒に働いて、開発合宿に参加してみませんか？ 運営に協力してくれる方も募集しています！
*1:AIインタビューのアイディアは https://azukiazusa.dev/blog/ai-talk-what-will-happen-to-engineers/ から
