1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

夏休みなのでバイブコーディングだけでアプリを作ろうと奮闘した

Posted at

夏休みでまとまった時間ができたので、バイブコーディングだけでゼロからアプリを作ってみようと考えた。結局思っていたよりも時間がかかりリリースできたのは夏休み後になってしまったが、一通りゼロからリリースまでバイブコーディングで完遂して得られた知見と考えをまとめたいと思う。

作ったもの

tampera-ja.png

選択された画像を生成AI(GeminiとImagen)を使って微妙に改ざんするという「記憶改竄カメラ」というジョークアプリを開発した。iOSのみ実装。

  • バイブコーディングだけで作ること
  • 元々夏休みの3日間で完成させること

を目標にしていたため、比較的簡単に実装できそうなこの題材を選んだのだが、後述の通り色々躓くポイントがあり結局3日間で完成させることはできず、リリースまでは二週間弱かかった。

システム構成

Screenshot 2025-08-23 at 17.17.11.png

今回のアプリでは、Swiftで書かれたフロントエンドiOSアプリから、Google Cloud上で動かすAPIサーバー経由でGemini / ImagenのAPIを呼び出して画像加工を行う構成とした。フロントアプリから直接Gemini / ImagenのAPIを呼び出すことも不可能ではないかもしれないが、Gemini / ImagenのAPIキーを直接アプリに埋め込むというのはセキュリティ的に問題がありそうなので、APIサーバーを介してこれらのサービスを利用する形にした。

iOSアプリ

iOSアプリはSwiftによる実装を選んだ。FlutterやReact Nativeを選べばAndroid版開発も容易になるが、Swiftに比べて自分自身の知見が少なく、バイブコーディング中にAIが迷子になった時にフォローができなくて詰んでしまうリスクがあったので、今回は利用を避けた。 この判断はAIではなく自分で行なった。

APIサーバー

APIサーバーはPythonで記述されたサーバーをCloud Run上で実行させることにした。Vertex AI経由でGemini / Imagenを呼び出す実装をする際の認証がシンプルになるのと、支払い周りをGoogle Cloudにまとめたかったからだ。

サーバーのフレームワークはFastAPIが使われている。 今までFastAPIを使ったとはなかったが、 AIにサジェストされて調べてみたら良さそうだった ので、採用することにした。

ローカルでの開発はDockerを使って行い、Cloud Runのレポジトリ連携でGitHubにコードをあげると自動でデプロイされるようにした。

使ったツール

iOSアプリ開発 - GitHub Copilot for Xcode

iOSアプリの開発はGitHub Copilot for Xcodeを使った。

サーバー - Gemini CLI

サーバー部分の開発は主にGemini CLIを使った。GeminiやImagenを使うにあたって、同じGoogle製のGemini CLIが一番そのあたりの仕様は正しく理解できているのではないか、という特に根拠のない期待があったからだ。

作った手順

事前準備(夏休み前)

画像生成に使うImagenは過去に触ったことがなかったので、どんなことができるのか事前に調べておいた。

また、Geminiを使って画像の内容をテキストに書き起こしてもらう方法についてもやり方を確認しておいた。

ここで調べている段階で 画像のテキスト化からの画像生成は英語でやらないとうまくいかないこと を確認できたのはよかった。同時に英語であれば、プロンプトの工夫次第で面白い結果が得られそうだということも確認できたので、この内容でアプリを作ってみようという方向性が固まった。

PythonでAPIサーバーを作る

夏休み初日、まずはPythonのAPIサーバー単体で画像加工を行えるところまでを作ることにした。APIサーバーの要件として最初に想定されていたものは下記の通り。

  • 画像ファイルを受け取って加工結果を返すエンドポイントを一つ用意する。
  • 画像ファイルを受け取ったら、Geminiを使って内容を一度文書化してその内容を元にImagenで画像再生成を試みる。
  • ユーザー単位で認証を行い、レートリミットをかけられるようにする。

まっさらな状態からGemini CLIでコードを書いてもらった。機能としては少ないものの、Dockerなどの開発環境用の設定も用意してもらいたかったことと、それらを含めて全ての要件を一発で理解してもらえるように言語化するのは難しそうだったので、まずはシンプルなPythonのAPIサーバーをローカルでDockerで動かせるところまでを作ってもらった。

環境構築とインフラ設定はまだスキルと経験がないと辛い

  • ポート番号を指定してサーバーを起動させて、docker compose upでローカルで動かせるようにする。
  • コードが変わったら自動でサーバーをリロードするホットリロードを有効にする
  • ローカルにあるGCP用のクレデンシャルファイルをマウントしてDockerコンテナ内からもGCPで認証できるようにする

というローカルの開発環境設定の部分が早速うまくいかず、最初の躓きポイントになった。この部分に関しては、 今回の開発以前に経験があったため問題箇所を理解してAIに指示を出して修正してもらうことができたが、経験のない人にとっては結構難易度の高いポイントになったのではないかと思う。

その後、Cloud Runの設定を行った。この部分はGemini CLIにやってもらえる部分がほとんどなく、基本的に手作業で設定することになった。これも インフラ未経験者には少し難易度の高いポイント になりうるのではないかと思う。

それ以外はかなり快適に実装できた

それ以降の開発は比較的スムーズに進んだ。段階的に機能を実装してもらったが、機能が限定的であることもありほとんど修正依頼をかけることなく、バイブコーディングならではのスピードと快適さで実装が進んで行った。一部細かい部分で、FastAPIのヘッダーの情報の扱い方で間違いがあってハマったりしたが、それを除けばほとんど問題なく自分でコーディングすることなく実装が進んだ。

特にレートリミットの部分は、なんとなく自前で作るにはなかなか面倒くさそうな機構だし、AIに指示して一発で作れないだろうなと思っていたが、予想に反して一発で要件を満たすものを作ってもらうことができ、想像よりもずっと早く実装が終わった。

最低限のAPIサーバーを作った後で、出力される画像のアスペクト比を入力画像に近づけるような機構を追加したり、不適切な画像が入力された場合の処理を追加するなど、当初のスコープに漏れていた機能をいくつか作ることになったので、予定したより実装に時間がかかった。ただこれはバイブコーディングかどうかに関係なく発生していたと思われる工数だ。

今回のサーバーサイドの実装は、環境構築・インフラ周りを除いてはバイブコーディングでかなり快適に目的を達成することができた。

iOSアプリを作る

iOSアプリの開発は、APIサーバーの開発と打って変わって何かと難航した。

まず「AIに指示を出して実装してもらったUIが、意図していたものと違う見た目になってしまう」という問題が度々発生した。修正の指示を出してもなかなか意図通りの表示にならなかったり、修正を繰り返しているとどこかのタイミングでその前に出していた修正内容がなかったことにされてしまう、というようなことが起きた。キリがないのでいくつかの画面では作り込みを一旦妥協せざるを得ない形になった。

UIが意図と違う形で実装されてしまう、追加実装のタイミングで既存のUIに問題が起きてしまう、という現象は開発作業が進んでコードの量が増えるに従って、その頻度が増えた。

エラーが出ないタイプの見た目の不具合の修正に大苦戦

「期待通りの実装にならない」に関しては、要件を満たしていれば妥協すれば良いので実装を進める上での「障害」にはならなかった。一番厄介だったのは「アプリを触っていると突然UIが壊れる、白い画面になってしまう」という不具合の修正だった。

ログ上にエラーメッセージが出ないような、「見た目が壊れる」不具合に関してはバイブコーディングではなくともデバッグがなかなかやりにくいものではある。特に再現性が低い場合は原因の特定と修正に苦戦することがあるが、今回も開発を進めていく中でそういった問題がいくつか生まれた。

一番厄介だったのは「ライブラリから選んだ画像を表示する際に、時々白い画面になってしまうことがある」という不具合だった。この不具合は「シート」の実装方法が原因で発生していた問題で、ライブラリで選ばれた画像のキャッシュがローカルになく通信が発生した場合に事象が発生していたのだが、その原因の特定と対策(画面遷移の実装を変更する)は最終的にAIの力だけでは解決することができず、自分自身で時間をかけてウェブ上の情報を調べつつ原因を調べるという工程が発生した。

自分自身が久しくiOSアプリを書いておらず、最近のSwiftUIに関するノウハウも抜けていたこともあって、この部分はかなり苦戦した。 その領域の知識が乏しい状態でのバイブコーディングは、問題が起きた時に行き詰まるリスクがある ということを改めて強く実感することになった。

API連携やローカライズは快適に実装

一方でUI部分ではなくサーバーとのAPI連携部分はかなりスムーズに実装が進んだ。エラーハンドリングの部分など含めて、手作業で実装する場合に比べてもかなりスピーディに実装が終わったと思う。

また、UIのローカライズやカラーテーマの変更といった作業もバイブコーディングとの相性はとてもよかった。特にローカライズについては、翻訳の部分も自動でやってくれるのでとても効率が良かった。

サーバー以上にリテラシーが求められる

というような形で、AIの力を借りれて快適に進められた部分も大いにあったが、iOSアプリ開発においてはまだまだバイブコーディングにもリテラシーが強く求められるということを実感する形になった。

リリース

icon120.png

バイブコーディングではないが、アプリのアイコンと説明文もAIに作ってもらった。これはCopilotではできないので、Geminiに作ってもらったが、割と気に入っている。ノンデザイナーの自分は、いつもアイコンの作成に大分時間が取られたりクオリティを妥協することになっているので、この部分でAIの力を借りれるのはかなり負荷の軽減になった。

という形で、アプリ側は結構苦戦したため夏休み中に実装が終わらなかったのだが、一週間ほど遅れて妥協箇所はあるものの一応動く状態になったのでストアにサブミット。一箇所Info.plist内でのローカライズの漏れがあり、審査で落ちたがそこだけ修正して再度提出したところ、無事に審査を通過しストアで公開された。

学び

以上で、延長線にはなってしまったものの「バイブコーディングだけでアプリをリリースする」という今年の夏休みの課題が終わった。

サーバーサイドの実装は、ローカルの環境構築とインフラ構成で手作業が多く発生したものの、それ以外の部分は想像以上に快適で問題なくバイブコーディングで作業を完了させることができた。手作業でやるよりも圧倒的にストレスが少なくスピーディだった。一方で、アプリ側は自分自身のSwiftUIのスキルの低さもあり、かなり苦戦してまだまだバイブコーディングで「快適」に作業をこなしてくことはできなかった。

サーバーにしろアプリにしろ、2025年現在のバイブコーディングは「どの程度その領域の知識を持っているか」によってうまくいくかどうかが左右されるなという印象を持った。もちろんAI自体の性能に左右される部分もあるが、AIが意図通りに動かなかった場合に適切に軌道修正できるかどうか、はユーザの知識・リテラシー次第だ。知識とリテラシーがあって、適切にAIを使いこなすことができればバイブコーディングはかなり強力な武器になるということも改めて感じる良い機会になった。

AIの性能はこれからもどんどん改善されていき、バイブコーディングも今以上に快適になっていくのは間違いないと思うが、自分自身の知識とリテラシーを保つための努力は続けていきたい。

1
0
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
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?