01左上のメニューから「Codex」を選ぶ
ChatGPTデスクトップアプリを開き、左上のメニューを開きます。
赤枠の「Codex」を選んで、アプリ作成用の画面に切り替えます。
1Codexの設定・フォルダ作成
最初に、Codexが作業するフォルダを用意して、ChatGPTデスクトップアプリから選びます。
02Codex画面になったことを確認
左側に「Codex」と表示されれば準備できています。ここでAIにアプリ作成を頼みます。
03デスクトップに作業用フォルダを作る
デスクトップで右クリックし、新規フォルダを作ります。これがAIに作ってもらうファイルの置き場所です。
04使うモデルを選ぶ
入力欄の右側にあるモデル名をクリックします。迷ったら、講座では基本のモデルを選べば大丈夫です。
05思考量も確認する
必要に応じて思考量（エフォート）も選べます。複雑な依頼では「高い」を使うと、考える時間が長くなります。
06「新しいプロジェクト」を開く
入力欄の上にある「プロジェクトを選択」をクリックし、「新しいプロジェクト」を選びます。
07作業用フォルダをプロジェクトに追加する
先ほど作ったフォルダを選び、「プロジェクトを作成」を押します。以後、Codexはこのフォルダ内にファイルを作ります。
2英単語イラスト教材を作る
プロンプトを使って、12語が並んだA4の英単語イラスト教材を作ります。
08教材作成プロンプトをコピーする
配布されたプロンプト集を開き、教材作成用の文章をコピーします。テーマを書き換える部分も確認します。
09Codexにプロンプトを貼り付けて送る
Codexの入力欄にプロンプトを貼り付け、送信します。最初の質問に順番に答えていきます。
10テーマと12語を確認する
例ではanimalsを選んでいます。表示された12語に、スペル・重複・テーマからのズレがないかを確認します。
11イラストのテイストを選ぶ
選択肢から好みのテイストを選んで返信します。講座の例では、子どもが塗りやすいモノクロ線画です。
12完成した画像をチェックする
12語があり、3列×4行になっているか、絵と単語が対応しているかを確認します。問題があればこの時点で直してもらいます。
3アプリ用ファイルを作ってもらう
完成した教材画像を使い、Codexにスマホ向けフラッシュカードアプリを作ってもらいます。
13アプリ作成プロンプトを貼り付ける
次に、フラッシュカードアプリ作成用のプロンプトを貼り付けて送信します。
14使う教材画像を指定する
「事前に作った画像を使ってください」と伝えます。Codexが同じプロジェクト内の画像を使うようにします。
15入れたい機能を選ぶ
カードをめくる、前後に進む、シャッフルするなど、入れたい機能の番号を返信します。例では1〜5を選択しています。
16追加の質問に答える
最初に英単語を見せるか、イラストを見せるかなどを聞かれます。画面の質問を読んで希望を返信します。
17内容を確認して「Go」と送る
単語・機能・表示方法のまとめを読みます。問題なければ、入力欄に「Go」と入れて作成を始めてもらいます。
18Netlify公開も一言添える
作成時に「Netlifyに公開したい」と伝えると、公開用フォルダを用意する指示も出してくれます。作業には2〜3分ほどかかります。
19完成結果と公開用フォルダを確認する
作業が終わると、主なファイルと公開用のpublicフォルダの場所が表示されます。このパスを確認します。
20Finderでpublicフォルダを見つける
作業用フォルダをFinderで開きます。中にあるpublicフォルダが、公開に使うフォルダです。
21アップロードするのはpublicフォルダ
Codexの案内にも、Netlifyへアップロードするフォルダとしてpublicが表示されます。親フォルダではなくpublicを使います。
22公開前にプレビューで確認する
サイドパネルのプレビューで、カードやボタンがスマホ向けに見やすく表示されるか確認します。
4Netlifyに公開する
publicフォルダをNetlifyにアップロードし、発行されたURLを生徒さんに共有できる状態にします。
23Netlifyを開く
ブラウザでNetlifyを開きます。ログイン済みなら、そのまま公開作業に進めます。
24「Upload your project files」にpublicを入れる
「Upload your project files」と書かれた場所に、Finderからpublicフォルダをドラッグ＆ドロップします。
25発行されたURLを開いて確認する
アップロード後に表示されるURLをクリックし、アプリが実際に開くか確認します。スマホでも同じURLを開いてみましょう。
26公開範囲をPublicにする
Netlifyの設定画面で「Visitor access」を開き、公開範囲がPublicになっていることを確認します。
27必要ならプロジェクト名を変更する
ランダムなURLを分かりやすくしたい場合は、「Change project name」から名前を変えられます。
28直したら同じpublicフォルダを再アップロード
機能を足したり表示を直したりしたら、Codexに修正を頼みます。終わったらpublicフォルダをもう一度アップロードして更新完了です。
