【実践編】60秒でアプリが作れた、その全手順
先日、労働編プロローグでこう書いた。
完成させること、そのものの価値が、足音もなく崩れ始めている、と。
読んでくれた方から、こんな声をいくつかもらった。
「私にも本当にできるんですか」
答えは、イエスだ。
今日は、その手順をそのまま公開する。
プログラミング知識は要らない。
必要なのは、指示文をコピペする指先だけだ。
（ぜひ、お子さまとご一緒に😊）
🟦簡単アプリ60秒で完成
①ChatGPT(Codex) 、②Claude (Code) 共通
手順
①「」の指示文を入力
「IQ診断ゲームを作りたいです。ブラウザで動くアプリをHTML1ファイルで作成してください。」➡ これだけです。あとは60秒待つだけ。
≪AIによる経過報告文≫
≪ブラウザでそのまま開ける単一HTMLとして作ります。まずファイルを置く場所を用意して、中身は診断ゲームとしてすぐ遊べる画面にします。
outputs フォルダが空だったので、ここに iq-diagnosis-game.html を追加します。JavaScript/CSSも全部インラインにして、配布しやすい1ファイルに収めます。≫
こんな感じで進行を眺めていたら、あっという間に完成‼️
①ChatGPT(Codex)の場合
②Claude (Code)の場合
🔷 おまけ
「MBTIアーキタイプ診断」
Mensaの中で流行っているプロンプトを一つ、お借りした。
（もちろん正式な心理測定ではなく、簡易的なものです）
通常は質問への回答をもとにタイプを判定するが、この診断では普段のChatGPTとのやり取りから推定してくれるため、手間がかからず便利だ。
さらに、日常的な会話の積み重ねをもとに判断する分、ある意味ではより正確な結果が期待できるかもしれない。
以下、そのままコピペ ➡ Chat GPT に張り付け、あとは60秒待つのみ😊
この下からコピペ ↡↡↡
あなたは「Plan-and-Solve（PS）思考」に基づいてユーザーを分析する診断AIです。
ChatGPTが参照可能な範囲内のユーザー情報のみを使用し、MBTIを推定してください。
⸻
【参照情報（優先度順）】
メモリに保存されているユーザー情報
現在のセッション内の会話内容
過去のプロンプトや指示の傾向
利用メタ情報（平均文量・思考傾向など）
一般的な利用情報
外部サイト・SNS・推測のみの情報は禁止。
⸻
PLAN
会話履歴全体から
目的
判断基準
思考プロセス
興味分野
質問方法
を整理する。
⸻
SOLVE
MBTI推定
以下を導出する。
・第1候補
・第2候補
・第3候補
適合率も表示する。
⸻
MBTI4軸
I ↔ E
N ↔ S
T ↔ F
J ↔ P
各軸を％表示する。
⸻
認知機能
主機能
補助機能
第三機能
劣等機能
会話履歴から根拠を導出する。
⸻
評価軸
構造化思考
内省性
創造性
明示性
柔軟性
感情・直感層
⸻
REFLECT
分析を要約し、
強み
弱み
成長ポイント
を導出する。
⸻
画像生成
診断完了後、
画像生成機能を使用して
1080×1920（9:16）の診断カード画像を1枚生成すること。
最終成果物は画像とする。
テキストのみで終了してはいけない。
カードはSNSでシェアされる品質とする。
高級感
幻想感
映画ポスター品質
文字が読みやすいこと。
⸻
レイアウト固定
レイアウトは毎回同じ構成を使用する。
変更してよい要素
背景
配色
光
装飾
象徴動物
MBTIタイプ
各診断内容
変更してはいけない
項目数
表示順
情報ブロック
文字配置
フォント階層
余白
アイコン位置
レーダーチャート位置
背景のみ診断内容に応じて変更する。
⸻
レイアウトテンプレート（1080×1920）
キャンバス
サイズ：1080×1920
セーフエリア：上下左右80px
4列×18行グリッド
⸻
① タイトル
X=540
Y=90
中央
⸻
② MBTIタイプ
X=540
Y=230
中央
⸻
③ 適合率
X=905
Y=240
右上
⸻
④ キャッチコピー
X=540
Y=430
中央
⸻
⑤ メッセージ
X=540
Y=520
中央
⸻
⑥ MBTI4軸
X=80
Y=650
横4ブロック固定
⸻
⑦ 認知機能
X=80
Y=930
左ブロック
⸻
⑧ 強み
X=570
Y=930
右ブロック
⸻
⑨ 弱み・課題
X=570
Y=1260
右下
⸻
⑩ 本来のあなた
X=80
Y=1260
左下
⸻
⑪ テーマ診断
X=570
Y=1580
右下
⸻
⑫ 相性が良いタイプ
X=80
Y=1580
左
⸻
⑬ 成長のカギ
X=400
Y=1580
中央
⸻
⑭ 思考マップ
レーダーチャート
X=270
Y=1790
直径220
6軸固定
分析力
戦略性
創造性
実行力
柔軟性
共感性
⸻
⑮ 象徴動物
X=870
Y=1790
220×220
レア度★★★★★表示
表示項目固定
以下のみ表示すること。
項目追加禁止
項目削除禁止
項目名変更禁止
表示順変更禁止
情報量は毎回同程度とする。
⸻
① タイトル
「MBTIアーキタイプ診断」
⸻
② MBTIタイプ
例
INTJ
Architect
⸻
③ 適合率
★★★★★
87%
⸻
④ キャッチコピー
短く一文。
⸻
⑤ メッセージ
あなたの本質を一文で表現する。
⸻
⑥ MBTI4軸
I ↔ E
N ↔ S
T ↔ F
J ↔ P
各％表示
⸻
⑦ 認知機能
主機能
補助機能
第三機能
劣等機能
各機能を短く説明する。
⸻
⑧ 強み
毎回4項目固定。
⸻
⑨ 弱み・課題
毎回4項目固定。
⸻
⑩ 本来のあなた
この人物が本来持つ思考・行動・価値観・人との関わり方を分析する。
毎回3項目固定。
最後に一言キャッチコピーを表示する。
⸻
⑪ テーマ診断
テーマに応じた視点で分析する。
評価視点はAIが内部で自動決定する。
毎回3項目固定。
最後に一言キャッチコピーを表示する。
⸻
⑫ 相性が良いタイプ
毎回3タイプ固定。
理由を一文で説明する。
⸻
⑬ 成長のカギ
毎回3項目固定。
⸻
⑭ 思考マップ
6軸レーダーチャート
分析力
戦略性
創造性
実行力
柔軟性
共感性
⸻
⑮ 象徴動物
今回のMBTIを最も象徴する存在を選定する。
候補
実在動物
絶滅動物
幻獣
神話生物
レア度★★★★★表示
⸻
動物選定ルール
候補を3つ内部で導出する。
最も適合率が高い1つだけ採用する。
ステレオタイプは禁止。
見た目の魅力も考慮する。
レア判定
適合率上位10%
→ 幻獣可
適合率上位3%
→ 神話生物可
⸻
出力ルール
診断内容は毎回変えてよい。
レイアウトは毎回固定。
表示項目は毎回固定。
表示順は毎回固定。
文字位置は毎回固定。
情報量は毎回同程度。
背景・色・装飾・象徴動物のみ診断内容に応じて変更する。
カード全体のブランド感を維持すること。
⸻
最終出力
診断終了後は必ず画像生成まで実行すること。
最終成果物はテキストではない。
画像生成機能を使用して、
1080×1920（9:16）の診断カード画像を1枚生成すること。
カード内に診断結果をレイアウトし、完成した画像を出力すること。
テキストのみで終了してはいけない。
━━━━━━━
診断設定
━━━━━━━━━━
【固定テーマ】
本来のあなた
（変更不可）
⸻
【テーマ診断】
未入力の場合
ポーカープレイヤーとして
自由入力可
例
経営者として
恋人として
親として
学生として
営業として
投資家として
料理人として
教師として
ゲーマーとして
デザイナーとして
医師として
AIエンジニアとして
⸻
AIは入力されたテーマから最適な評価視点を内部で自動決定する。
評価視点は表示しない。
カードには分析結果のみ表示する。
テーマ未入力時はデフォルトテーマを使用する。
この上までコピペ ↑ ↑ ↑
こんな感じです
（わたしの結果／複数アカウントの中の二つで実施）
象徴動物が、とてもユニーク😊
メンサン（Mensaの人を、こう呼ぶ）の90%以上は、INTJだった。
やはり、そうなるだろうか💦
この体験の先に何があるのか。
それは、労働編本編で書く。
いろぉー