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

Gemini Code AssistのAgent Modeを利用してmacOSアプリを開発してみました。今回挑戦したのは「ポモドーロタイマー」といって、25分作業、5分休憩を繰り返すポモドーロテクニックを取り入れたタイマーアプリです。タスクと作業記録をリマインダーとカレンダーを通して記録する機能も実装し、自分のMac上で動かすことを目指しました。完全にGeminiに頼りきりでアプリを開発できるのでしょうか?

環境

  • Xcode 16.4
  • Swift 5
  • macOS Sequoia
  • VSCode
  • Gemini Code Assist

大学生はGemini AI Proの無料特典を2025.10.06まで申し込めます。Google Gemini: 大学生なら Pro プランが無料

準備

まず、Xcodeで新規プロジェクト作成 > macOS > Appと選択して、SwiftUI Appプロジェクトを作成します。ちなみに、プロジェクトはクラウド(iCloud Driveなど)同期されていない純粋なローカルディレクトリに作成することをおすすめします。
Xcode 16.4にはGeminiの拡張機能を組み込めまないため、GeminiはVSCodeで動かすことにします。先ほど作成したプロジェクトのルートディレクトリをVSCodeで開きます。VSCodeにSwiftとGemini Code Assistの二つの拡張機能をインストールし、Gemini Code Assistにはお使いのGoogleアカウントでサインインしておきます。
ここから先はXcodeとVSCodeを行き来しながら開発を進めます。VSCodeではGeminiによるコーディングを行い、Xcodeでプレビュー、エラー確認、ビルド、ランを実施します。

開発の様子

ここからは、開発が進んでいく様子を、実際のGeminiへのプロンプトも交えながら紹介します。まず、そもそもAgentモードについてよく知らなかったので、ブラウザ版のGeminiに初めから質問してしまいます。※これ以降引用ブロックはプロンプトです。

Gemini Code AssistのAgentモード(ベータ)を利用して、初めてのAI自律開発を行わせてみたいです。やり方を教えて下さい。

基本的なことはGeminiが教えてくれます。ここからGeminiにコードを書かせていくわけですが、どのようなアプリを作るかを詳しく伝えてあげないといけません。この部分もブラウザ版Geminiに手伝ってもらいましょう。

以下のようなディレクトリ構成です。Agentモード利用のためのアドバイスをください。カレンダーへの自動記録機能付きポモドーロタイマーMacOSアプリを作ろうと思っています。
.
├── PomoTimerDev
│   ├── Assets.xcassets
│   ├── ContentView.swift
│   ├── PomoTimerDev.entitlements
│   └── PomoTimerDevApp.swift
└── PomoTimerDev.xcodeproj
    ├── project.pbxproj
    ├── project.xcworkspace
    └── xcuserdata

まず基本的なタイマーの機能を実装し、次により高度な機能を実装するというように開発を数ステップに分けるとよいと言われたので従います。ブラウザ版Geminiに、Gemini Code Assistに入力するプロンプトを作ってもらいます。

タイマーの基本機能から開発することにしました。必要に応じて疑問点を質問しながらプロンプトを考えて下さい。

良い感じのプロンプトができたら、Gemini Code Assistに入力して実装を開始します。
以下最初に入力したプロンプトです。

MacOS向けポモドーロタイマーアプリを開発して下さい。言語はSwift、UIはSwiftUIで、UIのライフサイクルにもSwiftUIを用いて下さい。必要な場合は@Observable MacroなどSwiftの最新機能の利用もためらわないでください。(注: 冒頭部分ここまでは著者追記)

ステップ1:基本的なUIコンポーネントの作成 ContentView.swiftにポモドーロタイマーのUIを実装してください。具体的には、中央に現在の残り時間を表示するテキストと、その下に「開始」「停止」「リセット」の3つのボタンを配置してください。

ステップ2:タイマーロジックの追加 タイマー機能を実装するために、ContentView内に@Stateプロパティを追加してください。具体的には、タイマーの残り時間を管理するtimerRemaining、タイマーが動作中かどうかを示すisTimerRunning、そして現在のタイマーのモード(ポモドーロか休憩か)を示す列挙型TimerModeです。

ステップ3:ボタンアクションの実装 ContentView.swiftのボタンにアクションを割り当ててください。「開始」ボタンはisTimerRunningをtrueにし、タイマーをスタートさせます。「停止」ボタンはisTimerRunningをfalseにし、タイマーを一時停止させます。「リセット」ボタンはタイマーを初期状態に戻します。

ステップ4:タイマーのカウントダウン機能 1秒ごとにtimerRemainingを減らすロジックを実装してください。タイマーはisTimerRunningがtrueの場合のみ動作するようにしてください。また、timerRemainingが0になったら、タイマーを停止し、ポモドーロモードと休憩モードを切り替えるようにしてください。
タイマーの基本機能が実装できたら、次へ進みます。

Xcodeでアプリを走らせてみて大丈夫そうであれば、ブラウザ版Geminiに次のプロンプトを生成させます。

次の段階、カレンダー機能の統合について具体的な実装のプロンプト文章を生成して下さい。私が想定している実装は以下のとおりです。

リマインダーのユーザーが選択したリストからタスクをインポートする。
タスクを選択してポモドーロを開始する。
ポモドーロ完了時に、開始と終了時刻がタスク名でカレンダーに記録される。
カレンダー記録の際にはこのアプリ用のカレンダーチャンネルを用いる。
途中でリセットした場合もその時点までで記録する。
休憩は記録しない。
カレンダーの記録をもとに後からタスクごとのポモドーロ実施の記録統計が視覚的にみられる。

生成したプロンプトをGemini Code Assistに渡して実装させます。何度かエラー修正を行います。特に独自に定義したTaskというクラスがSwiftUIのTaskと名前の衝突を起こしており、今回はSwiftUI側を全てSwiftUI.Taskと書くことで対処しました。アプリが動くようになったら、あとは細かいところをGemini Code Assistに直接指示して詰めていきます。例えば、

OSバージョン要件はmacOS15.5 or Laterで

とか

Statistics画面について、以下を改善して下さい。
1.何も表示されていない画面が右にあります。リサイズすれば消えますが、修正できるならお願いします。
2.棒グラフの単位をつけて下さい。
3.期間の選択にTodayを追加して下さい。
4.タスク項目が多くなった時にわかりやすくするために、各タスクを選択するとその統計が横に表示されるような画面構成を検討して下さい。

といった感じです。
最後に、アプリアイコンが欲しくなってきたので、これもGeminiで生成します。

Geminiにオリジナルのアイコン画像を作らせることはできますか。

と聞いたらいきなり画像が生成されました。修正をかけていきます。

以下のように画像を変更して下さい。
- アイコンの外側は単色にして、影なしにする。(PNGで背景透過できるように)
- ポモドーロタイマーアプリなので、トマトの断面のイラストと時計を掛け合わせたようなデザインにする。
- Macの純正アプリアイコンと並んでもデザインに違和感がない。

まだしっくりきません。

  • もっとシンプルに
  • Macの純正アイコンのように、ベースを角丸四角形に
  • MacOS Bigsur以降のように、フラットデザインに少しシャドウで階層感が加わったように

これで気に入ったものができたので、外側に描画されてしまっていたシャドウを削除したりサイズ調整を行なって、Xcodeでアイコンとして設定します。

まとめ

Gemini Code AssistのAgentモードで、SwiftUIを用いたmacOS向けAppを開発することができました。まだUIが綺麗ではなかったり、タイマー終了時に音や通知が出ないなど、改善できる部分はあります。しかしこれらの部分は、こちらから指示していないから実装されていないのでしょう。Geminiの力に驚きつつも、個人的にはコードを書く作業が楽しいので自分で書きたいと思いました。

今回のアプリのGithubリポジトリ

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