📝

ChatGPTで始める日曜開発(メモアプリ編)

2024/10/20に公開

はじめに

今回作りたいアプリは、赤羽雄二氏の著書『ゼロ秒思考』をサポートするものです。赤羽氏は、「考えを整理し、瞬時に行動に移す力」を身につけるために、紙に1分以内で思考を書き出す方法を推奨しています。ただ、出先や移動中など、紙とペンが手元にない状況でも、スマホを使って素早くメモを取りたいと思う場面が多くありますよね。そこで、自分用にアプリを作り、「1分以内に書く」など、ゼロ秒思考のルールを守りながら実践できるようにサポートしてくれるツールを開発したいと考えました。

私自身、スマホアプリの開発経験はほぼゼロに近いですが、ChatGPTを活用すれば、初心者でもアプリ開発を進められるのではないかと思っています。ChatGPTにサポートしてもらうことで、アプリの機能や設計に関する疑問を解決しながら、開発を進めました。
目標としては日曜開発として使える3時間

また、ChatGPTに効率よく質問するためのコツや活用方法についても、この開発プロセスを通じて学び、まとめていきたいと思います。この記事では、アプリ開発のステップ、実際に体験したこと、そしてゼロ秒思考をスマホで実践するためのアイデアを共有していきます。

ChatGPTへの質問のコツ

個人でアプリ開発をゼロから始める際、特に初心者にとっては多くの課題が待ち受けています。しかし、ChatGPTを上手に活用することで、スムーズに進められる場合が多いです。ここでは、私がアプリ開発中に得たChatGPTへの質問のコツをご紹介します。

GPT4o Canvasは使わない

アプリ開発中にChatGPTを活用する際、便利な機能がいくつかありますが、GPT-4のCanvas機能はあえて使わない方が良いこともあります。Canvasはコードを視覚的に整理して編集できるツールで、一見便利そうに思えます。しかし、これを使うとChatGPTが一つのソースコードの編集に集中してしまい、他のファイルやコードの修正が必要であってもそれを教えてくれなくなるという問題が発生することがあります。

例えば、ある機能を追加するために一つのファイルをCanvas上で編集していると、その機能に関連する他のファイルにも変更が必要な場合でも、ChatGPTがその修正を提案してくれないことがあります。Canvas上での作業は一つのファイルや部分にフォーカスしがちで、結果として全体のコード構成を見逃し、他のファイルでエラーや整合性の問題が発生するリスクが高まります。

一つずつ依頼する

まず、重要なポイントは「一度に多くのことを依頼せず、一つずつやってもらう」ということです。なぜこれが大切かというと、複数の作業や複雑なプログラムを一度に実行しようとすると、エラーが発生しやすくなるからです。例えば、何かの機能を追加する際に多くのコードを一気に書いてしまうと、エラーが出たときにどの部分で問題が起きているのか特定するのが難しくなります。

エラーが発生すると、まずその原因を探る必要がありますが、もし同時に複数の箇所でエラーが起こっていると、問題解決がさらに複雑化します。一つの問題を解決しても、他の箇所でまた新たなエラーが発生し、その結果、前のコードに戻らざるを得ないという悪循環に陥ることもあります。このような事態を防ぐためにも、まずは一つずつ確実に動かし、その都度動作確認をするのが得策です。

この時、本当に少しずつ依頼するのが望ましいです。
例えば一番最初の依頼としては
×「入力フォームを作成するところから初めてください」
〇「まず空のアプリが動くところから始めてください」→動作確認後「入力フォームを作成してください」

動作確認したら「ここまで動きました」と伝える

ChatGPTに質問やサポートを求める際は、進捗をしっかり共有することも大切です。例えば、ChatGPTのサポートで一部のコードや機能が正常に動作したら、「動きました」と報告するようにしましょう。これによって、エラーが発生した場合でも、どこまでが正しく動いていたのかを明確にすることができます。そうすることで、もし修正が必要になったとしても、動作していた部分に戻って再度やり直すことが容易になります。

また、このプロセスを繰り返すことで、常にエラー発生時にリカバリーが可能な状態を保つことができ、開発が行き詰まることを防げます。特にアプリ開発に慣れていない場合は、小さな成功を積み重ねることが大事です。問題が複雑にならないうちに解決できる範囲を狭めておくことで、開発スピードも向上します。

実際の進め方

概要を伝える

Q

ゼロ秒思考のメモをスマホで行うための自分用Androidアプリを本チャットで開発したいと思います

ChatGPT

了解しました!ゼロ秒思考のメモアプリを一緒に開発していきましょう。まずは基本的な機能から実装していきましょうか。最初のステップとして、以下の内容を進めることを提案します。

プロジェクトのセットアップ:

Android Studioで新規プロジェクトを作成し、スマホとタブレット向けのシンプルなレイアウトを作成します。
KotlinまたはJavaを使用する予定ですか?
画面レイアウトの作成:

タイトルとメモの内容を入力できるテキストエリアをレイアウトに追加します。
メモの保存機能:

スマートフォンにメモを保存する機能を実装します(例えばSQLiteやファイル保存を使用)。
これからどのステップに進むか、または具体的にどの部分から始めたいか教えていただけますか?

要件を伝える

Q

以下の要件で開発を始めたいと思います。
開発方法の指示を別途行います

最低限の要件
・Adnroidアプリ(スマホ・タブレット)
・タイトルエリア・文エリアに分ける
・スマホにメモを保存

追加要件
・1分間カウントダウンを表示する
・今日何ページ書いたか表示※10ページ推奨
・見直しのためにGoogleKeepに連携
・ペン入力し画像で保存

A

了解しました!まずは最低限の要件を満たすために開発を進めていきます。具体的には、次のようなステップで開発を進めるのはいかがでしょうか?

Androidプロジェクトの作成:

Android Studioを使って、新しいプロジェクトを作成しましょう。
画面にはタイトルエリアと本文エリアの2つの入力フィールドを設けます。
画面レイアウトの設計:

レイアウトファイル(XML)に、EditTextを2つ使用して、タイトル入力と本文入力を作成します。
レスポンシブ対応も考慮し、スマホとタブレットの両方で適切に表示されるようにします。
メモの保存機能:

SharedPreferencesかSQLiteを使って、メモをローカルストレージに保存する仕組みを実装します。
上記に従って開発を進めていきますか?もしくは、特にどの部分から始めたいか、具体的な指示があれば教えてください。

一つずつ進めてほしい旨を伝えてやり取り開始

Q

開発ステップとして、最低限の要件から要件を一つずつ実装していきます
正常に動作していることを確認しながら進めたいです
AndroidStudioなどの統合開発環境の自動生成機能は積極的に活用してください

悪い例

以下は悪い例、最低限と言いつつ複数のことを依頼しているのでエラーが多発

Q

まず、最低限の要件としてタイトルと本文を入力して保存するだけのアプリ「ゼロ秒思考メモアプリ」の開発を始めてください

ChatGPT

結果

本当に少しずつ始める

まず空のプロジェクトをビルドするところから始めてもらう

Q

まず空のアプリをビルドして動作させるところから始めてください

ChatGPT

ステップ1: 空のプロジェクトの作成
Android Studioを開く:

Android Studioを起動し、「Start a new Android Studio project」をクリックします。
テンプレートの選択:

「Empty Activity」を選択します。これにより、空のアプリケーションが自動的に生成されます。
プロジェクト情報の入力:

プロジェクト名: ZeroSecondMemo
パッケージ名: 自分で指定(例: com.example.zerosecondmemo)
保存先: 任意のフォルダに指定
言語: KotlinまたはJava(Kotlin推奨)
APIレベル: 最小API 24(Android 7.0 Nougat以上を選択)
Finishをクリックしてプロジェクトを作成します。

ステップ2: 自動生成されたコードを確認
Android Studioが自動的に次のファイルを生成します。

MainActivity.kt(またはMainActivity.java)
activity_main.xml(レイアウトファイル)
この状態でまだコードを追加せず、空のアプリとして動作確認を行います。

ステップ3: エミュレーターまたは実機でビルドと実行
エミュレーターの設定:

Android Studioのツールバーから「Device Manager」を選択し、新しい仮想デバイス(エミュレーター)を作成します。実機を使用する場合は、開発者モードを有効にして、PCに接続します。
ビルドと実行:

Android Studioの右上にある「Run」ボタン(緑の再生アイコン)をクリックします。
エミュレーターまたは接続された実機でアプリがビルドされ、起動します。
ステップ4: 空のアプリが動作することを確認
エミュレーターまたは実機で空のアプリが起動し、画面に「Hello World!」が表示されることを確認します。これで、ビルドと動作確認が完了です。

ビルドして動作確認

ビルドが成功し動作確認が出来たら、ChatGPTに動作したところまで伝えてGitにコミット

Q

ここまで正常に動作しました

ChatGPT

正常に動作したとのこと、良かったです!次に進める準備が整いましたね。

次にどの機能を追加したいか教えていただけますか?たとえば、以下のようなステップがあります。

入力データの保存:

入力されたデータ(タイトルやメモ)をスマホに保存する機能を追加します。
SharedPreferencesやSQLiteを使用してデータをローカルに保存できます。
保存ボタンの追加:

EditTextに入力した内容を保存するためのボタンを追加し、保存機能を実装します。
カウントダウンタイマーの追加:

1分間のカウントダウンタイマーを表示する機能を追加します。
どのステップから始めたいか教えてください。順番に進めていきます!

ここまで1セッション

以降繰り返しながら少しずつ機能を追加していく

結果数時間で完成したアプリ

ChatGPTのサポートのおかげで日曜プログラミングの数時間で動作するアプリを開発することができました。
早速自分のスマホに入れて使い始めたいと思います!

このアプリは、ゼロ秒思考を実践するために必要な機能をシンプルかつ効果的に備えています。以下の主要な機能が実装されています。

  • 1分カウントダウンタイマー: 書き始めてから1分間でメモを完了させるため、画面上にカウントダウンタイマーを表示し、時間内に書き終える意識を高めます。
  • 日ごとのメモ数の表示: 今日何ページのメモを書いたかを表示し、10ページを書くことを推奨することで、モチベーションを維持する機能
  • メモのローカル保存: 作成したメモは、アプリ内でスマホのローカルストレージに保存され、後から見直すことができます。


https://github.com/yydevelop/ZeroSecondMemo

未実装の機能

  • Google Keepとの連携: メモを見直したり共有したい時に、Google Keepと連携してメモをすぐに保存・同期できる機能
  • ペン入力サポート: スマホやタブレットでペンを使って手書きメモを取り、画像として保存できる

まとめ

この記事では、著書『ゼロ秒思考』の考え方をサポートするスマホアプリを、初心者がChatGPTのサポートを活用して開発する過程を紹介しました。スマホアプリ開発の経験が少ない中でも、ChatGPTを効果的に活用することで、スムーズなプロジェクトの進行が可能となりました。

重要なポイント:

少しずつ進めることが重要: 一度に多くの作業を依頼せず、必ず一つずつ進め、各ステップごとに動作確認を行うことがミスを防ぎます。

ChatGPTへの質問のコツ:

一つの機能にフォーカスして、進捗を確認しながら開発を進めることで、問題が起きても原因を特定しやすくなります。
進捗を共有し、「ここまで動作した」という報告をすることで、次のステップに円滑に移行できます。
動作確認を繰り返す: 空のアプリをビルドして動作を確認するなど、小さな成功を積み重ねながら進めることで、エラーを最小限に抑え、スムーズな開発が可能になります。

ChatGPTの活用方法:

Canvas機能は使わない: これは一つのファイルに集中しがちで、他のファイルの修正が見落とされる可能性があるためです。
シンプルなステップを依頼: 空のアプリのビルドや、基本的な入力フォームの作成といったシンプルなタスクから始め、動作確認後に次のステップに進むのが効果的です。

Discussion