こんにちは!今回は、リリースしたWebアプリ『総合占術鑑定』の開発背景と使い方をご紹介します。
この記事は2026年2月に書いたものですが、公開から半年後に自分でソースコードを開けたところ、記事に書いていたことと実装が食い違っていました。 しかもその食い違いが、この記事で一番書く価値のある部分でした。前半は当時のまま(事実誤りだけ直したもの)、後半に「半年後に確かめた話」を足しています。
開発のきっかけ
きっかけは、ほんとにしょうもないことでした。
ある日の雑談で「MBTI何?」「INTJだけど?」みたいな話になったんですが、そのときにふと思ったんです。「MBTIだけじゃなくて、血液型とか誕生日とか全部ぶち込んで総合判定したら面白くない?」って。
ネットの占いサイトって、だいたいがどれか1つの切り口(星座だけ、血液型だけ)で、「全部掛け合わせて、しかもレーダーチャートでビジュアライズしてくれるもの」ってなかったんですよね。
「ないなら自分で作ればいいじゃん。」
……エンジニアの悪い癖が出ました。
コンセプト:「なんか本格的っぽいけどAI任せ」
このアプリの裏テーマは「真面目な見た目なのに中身はAIにおまかせ」でした。
ユーザーインターフェースはそれなりにちゃんと作りました。紫を基調としたグラデーション、10軸のレーダーチャート、各運勢の詳細テキスト。見た目はかなり「本格的な占いサイト」っぽくなっています。
中身については、当時の私は「入力された情報をGoogle GeminiのAPIに投げて、AIにそれっぽい占い結果を生成してもらっているだけ」だと思っていました。この認識が間違っていたという話を後半でします。
科学的根拠がゼロなのは、どちらにせよ変わりません。占いってもともと「当たるも八卦、当たらぬも八卦」なので、生成された結果でも十分楽しめるんですよね。友達に送ったら「え、めっちゃ当たってる……」って言われましたが、たぶん気のせいです。
使い方
使い方はめちゃくちゃシンプルです。
ステップ1:基本情報を入力
アプリを開いたら「占いを始める」ボタンを押して、以下の4つを入力します。
- ニックネーム(なんでもOK)
- MBTI(16タイプから選択。わからなければアプリ内の簡易診断もあります)
- 生年月日
- 血液型
ステップ2:結果を見る
入力が終わると、10軸の運勢スコアが出ます。
| 軸 | 見れるもの |
|---|---|
| 🌟 総合運 | あなたの今の全体的な運気 |
| 💰 金運 | お金まわりの流れ |
| 💼 仕事運 | キャリアや仕事の調子 |
| 💕 恋愛運 | 恋愛や人間関係の深い部分 |
| 🤝 対人運 | 友人・同僚との関係性 |
| 🏥 健康運 | 体調やメンタルのコンディション |
| 🏠 家庭運 | 家族との関わり |
| 📚 学業運 | 学びや成長のチャンス |
| ✈️ 旅行運 | お出かけや旅の運気 |
| 🌱 出会い運 | 新しい人やモノとの巡り合わせ |
これらがレーダーチャートで一目瞭然に可視化されます。各項目には詳細コメントも付いていて、読み物としても楽しめます。
ステップ3:シェアする
結果は友達にシェアするのがおすすめです。「お前の恋愛運12って何www」みたいな感じで盛り上がります。
技術的にやったこと
エンジニアの方向けに、技術面も軽く触れておきます。
技術スタック
- フロントエンド: Next.js (App Router) + TypeScript
- UI: カスタムCSS(紫からピンクのグラデーション基調のダークテーマ)
- スコア算出: 自作の確定的ロジック(MBTI・血液型・生年月日・ニックネームの画数から加点)
- 鑑定文の生成: Google Gemini API
- チャート: recharts の
RadarChart - MBTI簡易診断: 質問ベースの4軸判定ロジック
こだわったポイント
① APIキーの保護
Gemini APIのキーはフロントに露出させたくなかったので、鑑定処理そのものを Next.js の Server Action("use server")に置いています。ユーザーのブラウザからはAPIキーが一切見えない設計です。
② MBTI簡易診断の内蔵
「自分のMBTI知らない」という人のために、アプリ内で簡易的な4軸(E/I, S/N, T/F, J/P)の診断ができるようにしました。本格的な診断ツールには敵いませんが、占いで遊びたいだけの人にはこれで十分です。
③ 満足度フィードバック
鑑定結果に対して「当たっている/いない」のフィードバックを送れるようにしました。全体の満足度がトップページに表示されるので、使うたびに「みんなどのくらい当たってるんだろう?」が見えて面白いです。
半年後に中身を開けた話(2026年8月)
ここからが本題です。
この記事を公開してから半年後、記事の記述が今も正しいかを確かめるために、自分でソースコードを読み直しました。結果、2つのことが分かりました。
1. AIは、点数を出していなかった
元の記事には「AIが10軸の運勢を算出してくれます」「AI: Google Gemini API(運勢テキスト・スコア生成)」と書いていました。
読み直したら、違いました。10軸のスコアを出しているのは lib/apps/fortune/fortune-engine.ts にある自作の関数で、やっていることはこうです。
- 全項目に基礎点 50 を置く
- MBTIの16タイプごとに手で書いた加点表を足す(例: INTJ なら仕事運 +15、対人運 -5)
- 血液型の加点表を足す
- 生年月日から算出したライフパスナンバーの加点表を足す
- ニックネームの画数から算出した加点表を足す
- 上記から作った固定シードで -5 から +5 の微調整を足す
- 0 から 100 にクランプする
乱数も、その日の日付も、AIも、一切入っていません。 同じ4項目を入れれば、何度やっても、誰がやっても、同じ点数が出ます。
AIが担当していたのは、出た点数を受け取って10項目ぶんの鑑定文を書く部分だけでした。占いアプリの「数字」は全部、私が半年前に手で書いた表です。
これは記事の書き間違いというより、自分で作ったものの構造を、自分が正確に把握していなかったという話です。作っているときは「AIに投げるアプリを作っている」という意識だったので、そのままの言葉で記事を書いてしまいました。実際にはAI部分は全体の一部で、しかも一番差が出る「点数」は自分で決めていた。
「AIで作った」と言うとき、どこまでがAIで、どこからが自分なのか。 これを説明できない状態でリリースしていました。
2. その唯一のAI部分が、3か月前に止まっていた
さらに悪い話がありました。
鑑定文の生成に指定していたモデルは gemini-2.0-flash です。Google の公式ドキュメントのモデル提供終了一覧を見ると、このモデルの Shutdown date は 2026年6月1日(推奨移行先は gemini-3.6-flash)と記載されています。
実際にAPIを叩いて確認したところ、2026年8月21日時点で gemini-2.0-flash は 404 を返しました。同じキーで gemini-3.6-flash は 200 が返るので、キーが失効しているわけではなく、モデルだけが無くなっています。
つまり 6月1日以降、このアプリの鑑定文はAIが書いていません。
なぜ半年間気づかなかったのか
ここが一番書きたかった部分です。理由は「見に行かなかったから」だけではありませんでした。
気づけない作りになっていたからです。
鑑定文の生成コードは、こういう形で書いてありました。
try {
// Gemini API を呼ぶ
} catch (error) {
console.error("Gemini APIエラー。フォールバックテキストを使用します:", error);
return generateAllFallbackTexts(scores, nickname, birthday, bloodType);
}
APIが落ちたら、あらかじめ用意しておいたテンプレート文を返す。当時の私は、これを「丁寧な作り」だと思って書きました。 ユーザーにエラー画面を見せないための配慮のつもりでした。
結果どうなったか。
- 画面はエラーにならない
- 点数は自作ロジックなので今も正常に出る
- レーダーチャートも正常に描画される
- 鑑定文も「それらしい日本語」が10項目ぶん出る
アプリを開いて操作しても、壊れていることが分からないんです。 しかもフォールバック文は入力値から作った固定シードでテンプレートを選ぶので、同じ入力なら同じ文章が返ってきます。「そういう仕様なのかな」と思えてしまう。
エラーが出ていれば気づけました。落ちていれば直しました。丁寧に作ったつもりのフォールバックが、故障を隠す蓋になっていた。
見に行かなくなる理由は「飽きた」ではなかった
半年間ノーチェックだったこと自体についても、自分の中を掘ってみました。
出てきた理由は2つです。
作ることが目的だったから。 動くようになった時点で、私の中では終わっていました。飽きたわけではなく、達成したかったことは「作ること」で、そこは達成されている。公開はゴールではなく、私にとってはオマケでした。
数が増えて手が回らないから。 公開しているアプリが増えるほど、1つあたりに割ける確認の時間は減ります。全部を毎月触ることは、実際問題できていません。
この2つは、たぶん個人開発をしている人にはそこそこ共通するはずです。そしてこの2つが揃うと、外形監視のような仕組みが無い限り、故障は永久に発見されません。 気合いでは解決しない領域です。
同じことをやりそうな人へ
個人開発のアプリでAPIを使っているなら、確認する価値があるのは次の3つだと思います。
- モデル名・APIバージョンを直書きしていないか。
gemini-2.0-flashのように世代の入った名前は、いつか必ず消えます。Google の場合は提供終了一覧に Shutdown date が先に出るので、使っているモデルを一度検索してみてください - フォールバックが、故障を見えなくしていないか。 ユーザーに優しい実装と、作者が異常に気づける実装は、別ものです。両立させるなら、フォールバックに落ちたことを作者側に飛ばす経路(ログ収集・通知)が要ります
- 「AIで作った」の中で、AIがやっている範囲を言えるか。 私は言えませんでした。言えないということは、そこが止まっても分からないということです
私の場合、1と2が両方抜けていたので、3か月気づきませんでした。
なお、移行先の gemini-3.6-flash が使えることは確認済みなので、差し替えます。この記事を書いていなければ、たぶんまだ気づいていません。記事を書くために自分のコードを読み直す作業が、結果的に一番マシな外形監視になっていました。
「アイデアさえあれば、誰でも作れる」
半年前の記事の締めくくりは、こう書いていました。今も、この部分については考えが変わっていません。
正直に言うと、このアプリの開発で一番大変だったのはアイデアを思いつくところでした。
技術的には既存の知識の組み合わせです。Next.jsでページを作って、データを計算して、返ってきた結果を表示する。やっていることは、基本的にこれだけ。
コーディングに関しては、今の時代AIのサポートがあるので、ゼロから全部自分で書く必要もありません。大事なのは「こういうの欲しいな」「これ面白そうだな」という着想の部分です。
- 「占いサイトって1軸しかないな → 全部掛け合わせたら?」
- 「AIに占い結果を書かせたら面白くない?」
- 「レーダーチャートで運勢が見えたらカッコよくない?」
この3つの「なんとなくの思いつき」を組み合わせたら、このアプリになりました。
ただ、半年後の私から1つだけ足すとすれば、「作れる」と「動き続ける」は別の話だったということです。作るのはAIの助けもあって本当に簡単になりました。難しいのは、作ったあとに自分がもう見なくなったものを、動いている状態に保つことの方でした。
それでも、作ったこと自体は後悔していません。雑談から出た思いつきが、実際に触れる形になった。そこまでで、私が欲しかったものは手に入っています。同じ話は『Element Poker』の開発記にも書きました。あちらは「誰にも遊ばれていない」話で、こちらは「壊れても気づかない」話です。個人開発の"その後"は、だいたいこのどちらかに落ちるのかもしれません。
もし「何か作ってみたいけど何を作ればいいかわからない」という方は、まずは自分の日常の「ちょっと不便」や「こうだったら面白いのに」を探してみてください。
答えは、結構身近なところに転がっています。
点数のロジックが自作だと分かった今でも、出てくるレーダーチャートは普通に面白いです。よかったら遊んでみてください。
