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?

オフ会で遊ぶためのアプリを作ってみた

1
Last updated at Posted at 2026-01-24

はじめに

皆様、明けましておめでとうございます。
現在2026年、そう、クロノトリガー発売から31年の年でありますが、今月にオーケストラコンサートが行われたりと引き続き30周年の激アツな一年となるでしょう。

タイトルの通り30周年記念のオフ会が開催されたので、そこで遊ぶために簡単なアプリを作成したという日記的な記事です。時間と興味のある方のみ閲覧お願いします。

※本記事および成果物は個人的に作られたものです。公式の会社・その他関係者様とは一切関係がありません。内容に関してはフィクションであり、実在のものとは一切関係がありません。ご了承ください。
公式ガイドライン:https://www.jp.square-enix.com/game/guideline/chronotrigger/

開発環境

MacBook Air(Apple M3/ Tahoe 26.2)
Flutter(v3.38.7)
Dart(v3.10.7)
Xcode(v26.2)
iphone13 mini
Android Studio(Otter 3 Feature Drop | 2025.2.3)

本編

テーマ決め

まずはアイディア、今回はオフ会のテーマが"三十周年祭"だったのでリーネ広場の千年祭を模した簡単なゲームアプリを作成することにした。
イラストは描けないので全て本家ドット絵のトレス(笑)
→あくまで個人利用なので許されるはず(???)

開発環境について

スマホアプリということでFlutterを採用。

エディタはJetbrains製品で無料利用できるAndroidStudioを活用。
そして肝心のコーディングは全てChtatGPTに書かせました。細かい調整や変数名は自分で少し調整が必要であるが、まあ優秀すぎる。

また、AndroidStudioではテスト用のエミュレータがデフォルトでAndroidしかないが、iphoneのテストをするためにXcodeのエミュレータを利用した。私用スマホがiPhone13miniだったのでそのサイズで作成。

環境構築

Flutterのインストール

公式ドキュメントのマニュアル手順でインストールした
https://docs.flutter.dev/install/manual

AndroidStudioのインストール

JetBrains Toolboxより取得

エミュレータの導入方法

XcodeをApp Storeからインストールする
完了後、開いた状態で画面上のメニューから Setting>Components で任意のOSを取得
image.png
参考:https://qiita.com/kawabata324/items/b5f060503c82b8cab825

Windows>Device and Simulatorで利用するデバイスを追加する。(今回はiphone13mini)
image.png

インストール完了後にアイコンを右クリックしてシミュレータを起動することができる!
image.png

あとは作成したエミュレータを File>OpenSimulator から起動すればOK
image.png

コードの実行方法

AndroidStudioを起動。PluginsからFlutterをインストールし、IDEを再起動する。
画面上のメニューからNewFlutterProjectを作成する。
image.png

lib/main.dartを開き、先ほど用意したエミュレータが選択できればOK
image.png

うまく起動できればデフォルトのカウントアプリが開くので、あとはChatGPTに頼りながら任意のアプリを作成すればよき👏👏👏
最初はめっちゃBuildに時間かかるので根気が必要
image.png

もしうまく動かなければ以下のコマンドでヘルスチェックできる。

flutter doctor

ちょっと余談

今回は以前作ったアプリをローカルにクローンして実行しようとしていたが、以下のエラーにより実行に躓いていた。(PCを変えてしまったので・・・)

error
Launching lib/main.dart on iPhone 13 mini in debug mode...
Running Xcode build...
Xcode build done.                                            0.9s
Failed to build iOS app
Uncategorized (Xcode): Unable to find a destination matching the provided destination specifier:
		{ id:hogehoge-hugahuga }

	Available destinations for the "Runner" scheme:
		{ platform:macOS, arch:arm64, variant:Designed for [iPad,iPhone], id:hoge-huga, name:My Mac }
		{ platform:iOS, id:dvtdevice-DVTiPhonePlaceholder-iphoneos:placeholder, name:Any iOS Device }

Could not build the application for the simulator.
Error launching application on iPhone 13 mini.

どうやらAndroidStudio(Flutter)がIphoneのエミュレータ向けに実行しようとしているのに対し、Xcode側がmacOSを指定しているので環境齟齬で動かないらしい。

AndroidStudioからXcodeを開いて確認してみる。

command
open ios/Runner.xcworkspace

画面上部の設定を見ると、確かに向き先がMyMacになっている👀
image.png
ここを修正してAppleIDでログイン、Xcode側でBuildした。

ちょっと余談2

アプリ作成時からOSバージョン変えたら画面サイズ合わなくなってしまった〜ピ〜ンチ!
image.png

黒枠が表示されて勝手に拡大されている、と思ったけどiPhoneが古いから対応していないような気もしてきた。素直に機種変しろということですね分かります。
実際にエミュレータをiPhone17Proに変えたら画面いっぱい表示してくれたし、これで作るべきなのかもしれない。
image.png

アプリの完成

とりあえずで見れるものを作ってみました!日の目を浴びないのは寂しいので供養🙏

demo.gif
突貫で作っただけあって、よく見ると吹き出しの幅とか適当すぎる・・・
せめてレスポンシブにしたい🥺

続く!(たぶん)

1
0
1

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?