10
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

IBM Bob に Phoenix LiveView のアプリケーションを設計・実装させてみた

10
Last updated at Posted at 2025-12-30

はじめに

IBM Bob は 「AI ソフトウェア開発パートナー」です

GitHub Copilot「副操縦士」 で、開発者の支援をしてくれる存在ですが、

Bob は 「パートナー」 として要件定義から設計、実装まで全ての工程を一緒に進めてくれます

CursorClaude Code が Plan モードを追加したり、 Amazon が Kiro をリリースしたり、 2025 年は「AI がコーディングを支援する」から「AI がシステム開発全体を行う」に変化した年と言えます

そんな中で IBM が満を持して発表したのが Bob です

現在はテクニカルプレビュー中で、公式サイトから申し込むことで使用できます

今なら毎月 200K トークンまで無料です

本記事では IBM Bob を使用して Phoniex LiveView による Web アプリを構築してみて、 Bob の特長を見つけていきます

実装した結果のコードはこちら

※2025年12月現在の情報なのでご注意ください

使用感

VSCode を fork して作っているため、 VSCode を使っている人は何の違和感もなく使えます

もちろん、インストール後に設定や Extension を VSCode からインポート可能です

インストール方法や初期設定等は簡単なので省略します

チャット

チャットの基本的な使い方は GitHub Copilot と同じです

画面上部のテキスト入力(コマンドパレット)の右に Bob のアイコンがあり、それをクリックすることで画面右にチャットが開きます

スクリーンショット 2025-12-29 17.27.54.png

モード

チャットの左下でモードが選択できます

スクリーンショット 2025-12-29 17.38.21.png

Plan モードで要件定義、設計を行い、 Code モードで実装します

コマンド実行まで含めて何でもやってもらいたい場合は Advanced モードを指定します(GitHub Copilot での Agent モード)

使用量確認

チャットの右上に現在のトークン残量が表示されていて、カーソルを合わせると詳細が確認できます

スクリーンショット 2025-12-29 17.33.04.png

会話履歴

チャットの右上「…」を開くと「History」があります

スクリーンショット 2025-12-29 17.49.09.png

スクリーンショット 2025-12-29 17.49.27.png

履歴に関しては GitHub Copilot みたいに上や横に居るよりは、こういうふうに隠れてくれている方が好きです

可愛げ

チャット内の Bob 上でカーソルを動かすと、 Bob が首を振ってくれます

bob.gif

Bob と一緒に実装計画を立てる

Plan モードで以下のプロンプトを Bob に渡してみます

Bob と一緒に Phoenix LiveView のプロジェクトを構築していきたいです
シンプルな画面で Elixir プログラミングについて学ぶWebアプリケーションを作ろうと思っています
実際にユーザーがコードを書いて、その結果がフィードバックできる仕組みにたいです

実は、作ろうとしているのは以前 Amazon の Kiro でやろうとして上手くいかなかったアプリケーションです

JavaScript や Python と比べると Elixir は AI の学習量(インターネット上にある情報量)が少ないので、 AI もまだ苦手だったりします

これが上手く作れるようなら、 Elixir のアプリケーション開発にも使えそうです

最初は英語で返答してきたので 日本語で喋ってくれますか? と言うと、以後は順応してくれました

スクリーンショット 2025-12-29 18.05.45.png

選択肢を提示するときにはボタンで表示してくれた のは「気が利いている」と思いました

スクリーンショット 2025-12-29 18.07.47.png

もちろんチャットでそのまま答えてもいいのですが、ボタンクリックですぐ選択できるのは楽です

「ちょっと違うな」と言う場合は「各選択肢の右端にある編集アイコン」をクリックすれば、選択肢の内容がチャットの入力欄にそのまま入ってくれます

bob_button.gif

これを編集すればすぐに軌道修正できるのも便利ですね

一通り質問に答えていくと、アーキテクチャ図を示してくれました

スクリーンショット 2025-12-26 16.20.38.png

こんな感じでチャットの中に図も出してくれるのが素晴らしいです

ちょっと崩れていますが、 UI も示してくれます

スクリーンショット 2025-12-29 18.35.34.png

最終的には Todo リストの形で計画を提示してくれます

スクリーンショット 2025-12-26 16.20.49.png

その上で、開発者が追加で言ってきそうな要望を先回りして提案もしてくれます

スクリーンショット 2025-12-26 16.24.48.png

計画を微調整した後、準備ができたらモードを切り替えることまで自ら言ってくれます

スクリーンショット 2025-12-26 16.26.56.png

Bob は 対話しながら一緒に作っている という パートナー感 が非常に強いです

Bob と一緒にコーディングする

コーディング時の動きは GitHub Copilot 等とほぼ変わりません

追加編集するコードや実行するコマンドを提示してくるのでそれを承認していくと、どんどん自動的に実装されていきます

スクリーンショット 2025-12-29 18.42.38.png

アセットのビルド中にボーッと待つのではなく、自律的に README ファイルを作成するなど、気が利いていますね

何回か実装に失敗していましたが、エラーログやスクリーンショットを渡すことで修正してくれました

スクリーンショット 2025-12-29 18.53.20.png

実装結果

完成したアプリはこうなりました

bob_ui.gif

正直、 UI 的には微妙(他の AI ツールと同じ感じ)ですが、やりたいことはできています

使っている生成AIモデルは Claude 3.7 Sonnet とのことですが、やはり優秀ですね

スクリーンショット 2025-12-29 18.59.33.png

まとめ

初めて IBM Bob と一緒にアプリケーションを作ってみました

印象は 気の利いたパートナー です

よく対話してこちらの意向を確認しながら進めてくれるので、いつの間にか変な方法に進んでいた、ということは少なそうです

また、選択肢がボタンになっていたり、チャット内に図を表示してくれたり、ちょっとした所で気が利いていて、痒いところに手が届いている感じがします

本格リリースされたときの料金プランが気になるところですね

現在は月々 200K トークンまで使えるので、是非みなさん試してみましょう!

10
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?