LOTO Predictor — Development Journal

まだ、誰も
点灯させていない。

全的中専用ゴールドバッジを、こっそり実装した話。
コードの中には存在する。しかし現実にはまだ存在しない。
そんな少し不思議なUIの開発記録。

LOTO Predictor 開発室・K 2025 約 8 min read
scroll
暗闇に浮かぶ黄金のトロフィー

まだ一度も使われていない
機能があります。

今回、LOTO Predictorをかなり大きくリニューアルしました。トップページ、データ分析、AIロジック解説、予測ページ、全実績一覧、スマートフォン表示、管理画面、内部ロジック——画面だけではなく、裏側のコードもかなり書き換えています。

一見すると「デザインが変わっただけ」に見えるかもしれません。でも今回のリニューアルで一番時間をかけたのは、実は見た目ではありません。

"未来のための演出"——これを大量に仕込んだことです。

UIは「当たった瞬間」
設計するもの

AI予測サイトを作っていて思うことがあります。ほとんどのサイトは「当たりました」「○個一致しました」——それだけ。

でも、もし本当に当たったら。もし歴史的な的中が出たら。その瞬間を、数字だけでは終わらせたくない。画面そのものが祝福してくれる。そんな体験を作りたかったのです。

成功してから祝福するのではなく、成功した瞬間に最高の演出が始まる。そんなシステムを作りたい。だからゴールドバッジは、"いつかの未来"のために先に作りました。

そこで今回実装したのが、実績バッジの完全リニューアルです。

ブルー・グリーン・パープル・ゴールドの4段階バッジ

色で分かる、AIの実績

以前の実績一覧はテキストだけでした。もちろん情報としては十分です。しかし実績には"温度"があります。だから色を持たせました。

🎯
Blue Badge
3個一致

「まずはここから。」AIがきちんと数字を追えていることを示す第一段階。確率の海に最初の足跡を刻む。

🔥
Green Badge
4個一致

「かなり惜しい。」あと一歩。この一歩が宝くじではとてつもなく大きい。だからこそ色も一段階上げました。

Purple Badge
5個以上一致

ここまで来ると、単なる偶然とは思えない世界。ページを開いた瞬間、思わず目が止まる存在にしたかった。

そして最後が、
ゴールド。

これが今回の主役です。

🏆

Gold Badge — 全的中

コードの中にはすでに存在しています。CSSも、アニメーションも、アイコンも——すべて完成しています。Bootstrap Iconsの bi-trophy-fill を使い、微妙な発光アニメーションまで実装しました。

「押せば表示される」ではありません。本当に全的中しなければ絶対に表示されない。そういう仕様です。

LOTO6 → 6個一致 LOTO7 → 7個一致 ミニロト → 5個一致
一行だけが黄金に輝くダッシュボード
Current Gold Badges
0

まだ誰も見たことがない。
管理者である私ですら、実際に表示された画面を見たことがない。
コードの中では存在する。でも現実にはまだ存在しない。

「結果が出てから作る」より、
「結果が出る前に作る」方が好きです。
— K, LOTO Predictor 開発室

その日は突然来るかもしれません。何年後かもしれません。明日かもしれません。

でもその瞬間、全実績ページの一行だけが、静かに黄金色へ変わります。

その一瞬を想像しながら、コードを書いていました。

リデザインは
見た目だけではありません

今回変更したのは実績一覧だけではありません。サイト全体のデザインルールを統一しました。「宝くじサイト」ではなく、ひとつのAIプロダクトとして見てもらえる品質を目指しました。

Header
ダークグラデーション
Components
カードUI
Icons
Bootstrap Icons
Layout
レスポンシブ対応
Mobile
片手操作最適化
Philosophy
体験の再設計

特にスマートフォンでは、片手でも見やすく、スクロールしていて気持ちいい画面を意識しています。デザインというより、体験そのものを作り直しました。

Before/After リデザイン比較

実績の透明性も、
さらに強化しました

今回のアップデートで、もう一つこっそり追加したものがあります。ミニロトの全実績一覧です。

以前から「ミニロトの実績も見たい」という声をいただいていました。今回、全実績ページにミニロトも正式に追加しました。

表示するのは良い結果だけではありません。予測したものはそのまま実績として残します。AI予測は良かった回だけを見せても意味がありません。

外れた回も含めて公開する。だからこそ本当にどれくらい当たっているのかが分かる。透明性があるからこそ改善もできる。分析もできる。そして信頼も積み重なっていく。

Game 1
LOTO6
Game 2
LOTO7
Game 3
ビンゴ5
New
ミニロト

AIは毎週、
少しずつ進化しています

LOTO Predictorは完成したシステムではありません。

Analysis

新しい分析を追加し、ロジックを改善

Statistics

統計を見直し、データベースを更新

Design

UIを再設計し、体験全体を刷新

Future

「前より少し良くなった。」その積み重ねだけを続けています。

派手な宣伝よりも、地道な改善。その先にしか、本当のAIは生まれないと思っています。

暗い廊下の先に輝く黄金の扉

いつか、この記事を
書き換える日が来る

今この文章を書いている時点では、ゴールドバッジは一度も点灯していません。

でも、その日のためにコードを書きました。

いつか「点灯しました。」という記事を書ける日が来ることを楽しみにしています。その日が来たら、この記事は"予告編"になります。

そしてその時には、この記事を読んでくださった皆さんと一緒に喜べたら嬉しいです。

まだ誰も見たことのない"未来"が、
静かに眠っています。

AIが積み重ねてきた挑戦の記録。
リニューアルした全実績ページで、ご確認ください。

全実績ページを見る →
loto-predictor.com