コラム

PCを閉じてもAIが働く|DevinのVMで試した開発と注意点

PCを閉じてもAIが働く|DevinのVMで試した開発と注意点

西澤です。

Devinを使っていて、すごいと思ったのは「自分のパソコンを開いていなくても、別の作業環境で開発を進められる」ことです。

チャットでコードの案をもらうだけではありません。セッションごとの仮想PCでファイルを作り、アプリを動かし、画面を確認するところまで任せられます。その話をYouTubeにアップしました。

YouTube動画。再生できない場合は下のリンクからご覧ください。
PCを閉じてもAIが働く「Devin」が衝撃だった話|にしざわチャンネル

そして、こちらは実際にDevinで作った売上見込みツールです。

Devinで制作した売上見込みツールの実画面。アプリのサンプル表示を使って撮影しており、会社名・案件・金額は架空です。月別の見込みと、確度を加味した金額を分けて表示しています。
Devinで制作した売上見込みツールの実画面。アプリのサンプル表示を使って撮影しており、会社名・案件・金額は架空です。月別の見込みと、確度を加味した金額を分けて表示しています。

このツールは、画面ができた後にも修正が必要でした。スマホで横にはみ出したり、ダウンロードしたHTMLが白画面になったりしたからです。

「どんな仕事を進められたか」と一緒に、「できたという報告だけで終わらせなかったところ」も紹介します。

自分のPCではなく、セッションのPCで作業する

VMは、仮想マシンの略です。ここでは「Devinが作業する別のパソコン」と考えると分かりやすいです。

公式のDevin Desktopの説明でも、Devinの各セッションにはVM、デスクトップ、ブラウザがあり、手元のノートPCを閉じた後も作業を続けられると案内されています。

手元で行うことDevin側で進めること
チャットで目的・条件を伝えるリポジトリを読み、ファイルやコードを編集する
途中の報告に答えるコマンドを実行し、アプリやテストを動かす
Desktopで実画面を見るブラウザやデスクトップアプリを操作する
ログイン・仕様判断・公開を承認する指示された範囲で修正し、成果物やPRを用意する
開発用のシェルは「コマンドを実行する場所」、IDEは「コードを読む・編集する場所」です。ブラウザやDesktopは、出来上がったものを画面で扱うために使います。 Computer Useは、マウスやキーボードで画面を操作する機能です。ブラウザのボタンを押すだけでなく、その環境で動くデスクトップアプリも対象になります。

ただし、PCを閉じても進むことと、確認なしですべて完了することは別です。 ログインや権限が必要な場面、仕様の判断、承認待ちでは止まります。

また、作業用のOSやアプリは環境次第です。公式の現行案内ではLinux・Windowsのセッションに対応し、macOSはOutposts側の説明になっています。後で紹介するAdobeの検証は、私たちが使った特定のmacOS環境での記録です。どのDevinセッションでも同じアプリが最初から使える、という意味ではありません。

売上見込みツールは「画面ができた」で終わらなかった

① 見積前の商談を記録するところから作る

見積書や請求書になる前にも、「来月、この仕事が動きそう」という商談があります。その案件を、売上予定月・金額・状態・確度と一緒に記録するツールを作りました。

月別の見込み総額と、確度を加味した金額を分け、目標との差も表示します。たとえば金額が同じでも、まだ相談中の案件と受注済みの案件は分けて見たい。その区別を画面に落とし込んでいます。

売上見込みツールの案件入力画面。案件名、売上予定月、状態、金額、確度を入力します。記事撮影用の架空の案件を表示しています。
売上見込みツールの案件入力画面。案件名、売上予定月、状態、金額、確度を入力します。記事撮影用の架空の案件を表示しています。

初版の保存先はブラウザ内です。別の端末とのクラウド共有や、会計ソフトへの自動登録は入っていません。バックアップを取り、利用するブラウザを決めるところまで含めて使う必要があります。

② テストの後、使う場面で直す

自動テスト、型の検査、ビルドに加え、実際のブラウザ操作でも確認しました。

そこで修正したのが、別タブでデータが更新されたときの通知表示と、スマホ幅での横はみ出しです。保存できるかだけでなく、利用者が状況を理解できるか、小さい画面で操作できるかも確認対象でした。

③ ダウンロード先で白画面になった

こちらで動いたHTMLを渡した後、手元で開くと白画面になる問題がありました。

戻してもらったファイルを確認すると、HTMLが途中で切れ、表示用のメッセージも混入していました。同じ名前のファイルでも、中身が完全版と同じとは限らなかったわけです。

完全版をZIPにして渡し直し、展開したHTMLが開けるところまで確認しました。

段階確認したこと
実装入力・集計・ブラウザ内保存が動くか
操作別タブ更新の通知やスマホ表示を理解・操作できるか
納品ダウンロードしたファイルが途中で切れていないか
渡し直しZIPから展開した完全版を開き、保存できるか
開発環境で動いたことと、届いたファイルを利用者が使えることは、別々に確認しました。

業務デモ・レポート・Adobeでも試した

修理店DXデモ:見積から入金までを触れる形に

修理・板金塗装店向けには、受付、見積、部品仕入、修理、請求、入金をつなぐデモを作りました。後から損傷部位の図、写真へのマーク、工数・原価・粗利、保険協定の履歴、完成検査、帳票も追加しています。

車体の損傷部位は、3Dではなく2Dの図を使いました。スマホで部位を選ぶ用途なら、立体を回転させる操作まで増やす必要はないからです。

ここで作ったのは、業務の流れや必要な入力を検討するためのデモです。共有データベース、FAX・メールの実受信、外部サービスからの自動仕入連携は含みません。保険協定や工数も、人が入力する記録です。

画面に「連携」や「送信」の項目があっても、接続先まで動いているかは別に確かめる必要があります。顧客向けの画面・社名・URLは、この記事には掲載していません。

週次分析レポート:文字中心の初版から図表入りへ

GA4とSearch Consoleからサイトのデータを取得し、PDFと元データを保存する仕組みも作りました。

初版は文字が中心だったため、前週比較のグラフ、流入元・記事別の図表、根拠と確認方法を添えた改善施策を含む5ページ版へ見直しています。アクセス数を並べるだけでなく、次にどこを確認するかまで読める形にしたかったためです。

この例では、Devinが仕組みを開発し、定期処理の実行役はGitHub Actions、完成PDFの保存先はR2です。毎週DevinのVMを起動して作らせる設計ではありません。

データ取得・PDF生成・保存の試行と、毎週の定期実行が成功し続けることは分けて確認します。ここでは、改訂版の生成・保管までを紹介し、社内のアクセス数や検索指標は公開しません。

Adobe:ログイン後、テスト素材の書き出しまで

専用のmacOS環境では、私がAdobeにサインインした後、Premiere ProとAfter Effectsを導入して動作を確認しました。

Premiere Proは1080p・30fpsのテスト素材を読み込み、シーケンスを作り、H.264で書き出すところまで確認しています。After Effectsでは、動くテロップを含むテスト素材を作って書き出しました。

After Effectsで書き出した検証用動画の1コマ。カラーバーに日本語の「Galewest DX 解説」が表示されています。完成したYouTube動画ではなく、アプリの書き出しと日本語フォントを確認するためのテスト素材です。
After Effectsで書き出した検証用動画の1コマ。カラーバーに日本語の「Galewest DX 解説」が表示されています。完成したYouTube動画ではなく、アプリの書き出しと日本語フォントを確認するためのテスト素材です。

最初は日本語が表示されない箇所があり、フォントを指定して修正しました。アプリを起動するだけでなく、書き出したファイルで文字が出ているかまで見る必要がありました。

Adobeのログインとライセンス、アプリの導入、空き容量、GPU、音声デバイスは準備が必要です。この検証だけで、長い動画の完成編集や音の品質まで確認できたとはしていません。冒頭のYouTube動画をDevinが編集した、という紹介でもありません。

任せる前に決めておくこと

① 「完成」に含める範囲をそろえる

ブログ制作でも、原稿・画像・保存台帳のPRをマージしたのに、記事一覧に出ないことがありました。原因は、サイトが読む記事データへの登録を含めていなかったことです。

以降は、記事登録、画像配信、トップ・一覧・詳細ページ、sitemap、美桜チャットの案内先まで含む公開用PRを作り、私が確認してマージする流れに変えました。

「記事を作る」だけでなく、「マージ後にどこへ表示され、何を確認できれば完成か」を依頼に入れる。ツール開発でも同じです。

② ログイン・権限・公開の判断は分ける

Devinに任せる作業人が決める・確認すること
コード修正、テスト、プレビューの用意仕様が業務に合うか、公開してよいか
許可した環境でのアプリ操作アカウントのログイン、ライセンス、利用範囲
連携の実装と接続確認どのデータにアクセスさせるか、誰に送るか
完成品の保存と取得照合採用する版、顧客に渡す内容、最終承認
パスワードやAPIキーを記事やGitに書かない。顧客の資料を使う場合は、参照できることと公開できることを分ける。この境界を先に決めます。

③ 次のセッションでも動く準備を残す

あるセッションでアプリを入れたからといって、次の新規セッションにも自動で入っているとは考えません。

環境設定の公式説明では、リポジトリ、ツール、依存関係、環境変数を準備し、セッション開始時のスナップショットとして扱います。次回も必要なものは、再現できる設定や手順として残します。

複数のセッションで同じリポジトリを扱うなら、変更範囲とブランチも分けます。並行作業の速さだけを見ず、どの変更を採用するか追える状態にしておきます。

④ 成果物をVMだけに置かない

画像、PDF、動画は、完成品と編集元を版付きで保存します。自社では、非公開原本とWeb配信用の保存先を分けています。

保存後は別に取得したファイルのサイズとSHA-256を照合します。SHA-256は、ファイルの中身が同じか確認するための指紋のような値です。白画面の件のように、名前が同じでも中身が違う問題を見つけるために使います。

自動テストだけで終わらせず、PC・スマホ、ダウンロードして開く操作、必要なら帳票の印刷も確認します。録画は重要な操作や不具合の再現に絞り、全操作を残すこと自体を目的にはしません。

最初は、小さな業務を1つ渡す

私がすごいと思っているのは、自分のPCを開いたままにしなくても、セッションごとの作業環境で開発やアプリ操作を進められることです。

ただ、何を作るか、どこまで任せるか、最後に何を見るかは人が決めます。完成報告より、実物と確認結果を見る。その前提で使っています。

最初に試すなら、たとえば「架空の商談を入力し、月別の売上見込みを集計するブラウザ内保存のツール」を1つ依頼します。実データや外部連携をいきなり渡さず、入力・保存・再読み込み・スマホ表示を完成条件に含め、公開は確認後にします。

次に任せたい業務を1つ選び、「誰が、何を入力し、何が見えれば使えるか」を短く書いてから依頼してみてください。

codexでA4会報誌を自動制作する方法|イラスト生成からPowerPoint・PDF書き出し、検品まで【AI月報10月号】
関連記事

codexでA4会報誌を自動制作する方法|イラスト生成からPowerPoint・PDF書き出し、検品まで【AI月報10月号】

2026.10.01
ChatGPTとJevでサイト内チャットを作ってみた。これ、接客にも使えそう!
関連記事

ChatGPTとJevでサイト内チャットを作ってみた。これ、接客にも使えそう!

2026.09.22
ずっと作りたかった「働く鳥たち」がサイトで動いた!キャラ作りからOpus 5.5での実装まで
関連記事

ずっと作りたかった「働く鳥たち」がサイトで動いた!キャラ作りからOpus 5.5での実装まで

2026.09.27

※画面は2026年10月6日の撮影時点です。売上見込みツールはアプリ内の架空サンプルを表示しています。Devinの対応環境・提供条件は公式の現行案内をご確認ください。サムネイルの作業ウィンドウは概念イラストで、実画面ではありません。Devin・Cognitionからの公認や提携を示す記事ではありません。

タグ

#Devin#AIエージェント#VM#業務改善#開発事例

コメント

Galewest|Web制作・マーケティング

AI・ITツール導入から、Webサイト改善までトータルで

AIツールの選定・導入から、業務効率化、ホームページ改善まで、経営者とITの間に立つ通訳としてサポートします。中小企業様の事例多数。