【やってみた】ポモドーロアプリのその後と実装方法

2023年7月17日 2023年7月17日

どーも！

たかぽんです！

今回は先週お伝えしたポモドーロアプリについて審査がどうなったか？っていうのと、実装方法はどうだったのか？って言うところについて書いていこうと思います...!

ポモドーロアプリの審査はどうなった？

さて、アプリの審査ですが...

残念ながら通りませんでした...orz

理由としては"4.3.0 Design: Spam"で...

4.3 SpamDon’t create multiple Bundle IDs of the same app. If your app has different versions for specific locations, sports teams, universities, etc., consider submitting a single app and provide the variations using in-app purchase. Also avoid piling on to a category that is already saturated; the App Store has enough fart, burp, flashlight, fortune telling, dating, drinking games, and Kama Sutra apps, etc. already. We will reject these apps unless they provide a unique, high-quality experience. Spamming the store may lead to your removal from the Apple Developer Program.

Review Guideline

とのことらしいです。

今回はおそらく"Also avoid piling on to a category that is already saturated"の部分に引っかかった感がありそうです。

つまり、似たようなアプリもうたくさんあるから、避けてね...って感じみたいです。

割と似たようなアプリたくさんあったのでいけるかと思いましたがダメでした。

仮に再提出するなら大きく差別化等測らないといけないのですが、もともとChatGPTで作ってみよう！的な動機ではじめたので、ある程度満足しちゃいましたw

ので、一旦審査出しは諦めて今度別のアプリを構想してリベンジしようと思います...!

と、言うわけで、次節からはざっくりとGPTとのやりとりとか、アプリを動く形に持っていくまでに行ったことを書いていきます。

ChatGPTでアプリの作成をした方法

さて、それでは今回アプリを作っていく際、基本的にはGPTに頼り尽くして対応しました。

もともとswiftはボタンを押すと値が増えるくらいのことはやったことがあるのですが、デザインを詰めたりとかはしたことありませんし、確かStoryBoardでの実装だったかと思います。

とにもかくにも、swiftの知識はほぼほぼない前提でした。

基本的にほぼ知識がないと想定した場合にどう言うふうに聞いていけばいいんだろうか？と思ったことを素直に聞いていく感じで進めました。

Q. IOSでアプリを作りたいのですが0から教えていただけますか？
A.
もちろんです。iOSアプリの開発には、基本的には「Swift」というプログラミング言語と、それを実行するための環境である「Xcode」というソフトウェアが必要です。以下に、簡単なアプリの作成手順をご紹介します。

まず、以下の手順で環境を整えます。
1. MacにXcodeをインストール: App StoreからXcodeをインストールします。XcodeはAppleが開発した開発環境で、iOSアプリ開発に必要なツールが揃っています。
次に、基本的なアプリの作成手順です。

1. Xcodeを起動し、「Create a new Xcode project」を選択します。

2. 次の画面で、"App"を選択して"Next"をクリックします。

3. "Product Name"にアプリ名を、"Team"にあなたのApple開発者アカウントを選択します。"Organization Name"はあなたが所属する組織名、"Organization Identifier"は通常、組織のウェブサイトの逆順のドメイン名（例: com.example）を入力します。

4. "Interface"は "SwiftUI"、"Life Cycle"は "SwiftUI App"、"Language"は "Swift" を選択します。

5. "Next"をクリックし、プロジェクトを保存する場所を選択します。

6. Xcodeが新しいプロジェクトを作成し、コードエディタが表示されます。ここで、Swiftのコードを書くことでアプリの動作を制御します。

以下は、簡単な「Hello, World!」プログラムを作成するためのSwiftコードの例です。

...

始まりは上記のような感じです。

実際にHello, World!のプログラムはそのまま貼り付ければそのまま動いたはずです。

基本的にコードが出されたらそのままコピペ（自分の手で編集はしない）で行きました。

ただし、序盤はそれでいけますが、後半は出力が長くなる場合、GPTの出力も省略されるため、そのままコピペはできなくなります。

そのため、コードの理解が皆無だとあとあと困るので、多少なりとも理解しながら進める必要はあります。

また、開始前の段階でApple Developper Programの登録とxcodeのインストールは済んでいました。

Q. 問題なく閲覧できました！
次は何をすればいいでしょうか？

A. 
素晴らしいです！アプリが正常に動作していることを確認できましたね。

次のステップは、あなたが作成したいアプリの機能によります。あなたが言及した「simple_pomodoro_timer」から、ポモドーロタイマー（一定時間作業を行い、短い休憩をはさんで作業を続けるという時間管理法）のアプリを作成したいと推測します。

以下は、簡単なポモドーロタイマーアプリを作成するための基本的な手順です：

1. ユーザインターフェース（UI）を設計する: タイマーの残り時間を表示するラベル、タイマーを開始するボタン、タイマーを一時停止するボタンなど、アプリに必要なUI要素を決定します。

2. タイマーの動作を実装する: SwiftのTimerクラスを使って、一定間隔で時間をカウントダウンする機能を実装します。

3. ユーザインターフェースとタイマーの動作を結びつける: UI要素とタイマーの動作を結びつけるために、SwiftUIのバインディングや状態管理の機能を利用します。例えば、「開始」ボタンが押されたときにタイマーを開始し、時間が経過するたびに表示される時間を更新するなどです。

4. アプリの振る舞いを調整する: タイマーが0になったときのアクションを定義したり（例：アラートを表示する、音を鳴らすなど）、ユーザーがアプリの設定を変更できるようにするなど、アプリの振る舞いを調整します。

これらのステップを一つずつ実行していくことで、簡単なポモドーロタイマーアプリを作成できます。さらに詳しいアドバイスや具体的なコードの例が必要であれば、お知らせください。

Q. ありがとうございます。
まさに、シンプルなポモドーロタイマーを作ってみたいと考えていて、休憩時間や感覚は任意に設定できるようにしたいと思っています。

また、時間満了したらシンプルな効果音が鳴るようにしたいです。

将来的には過去のサイクル履歴を管理したり、各サイクルごとにあらかじめ名称をつけたりと少しずつ機能を追加してみたいです。

ただ、まずはシンプルに一定感覚おきに休憩になって、簡単な音が鳴るような形にしたいと思っています。

そして次にこんな感じでそもそもどんなものつくるんだっけ？っていうのを改めて伝えたら早速時間が経ると音楽が鳴るようなプログラムがでてきて、サクッと動かすことができました...!

ちなみに、その際の効果音は効果音ラボ様からお借りしました。

そして動いたらつぎに実装したいことを伝えて〜を繰り返し...


Q. いただいたplay.circle.fillのアイコンを黒色にすることは可能でしょうか？

A. もちろんです。SwiftUIのImageはforegroundColorメソッドを使って色を変更することができます。以下のように指定すれば黒色になります：

swift
Copy code
Button(action: {
    SoundPlayer.playSound(sound: selectedSound)
}) {
    Image(systemName: "play.circle.fill")
        .resizable()
        .frame(width: 30, height: 30)
        .foregroundColor(.black) // Add this line
}
これでアイコンの色が黒になるはずです。

こんな感じで細かいボタンデザインなども調整していって、最終的に出来上がったものが先日共有したものになります。

また、ロゴはどうするの？っていうお話もあると思いますが、商用もできそうだったのでAdobe Expressにて作ってみました。

最後にダークモードとライトモードでの色味の確認だけして、完成!