Bbeol Arcade
← マガジン一覧へ アーケードTOPへ →
開発ノート

『ポップ』なのにエクセル表?ポップコーンDNAを丸ごと注入したナンバージェリーUI刷新録

Bbeol エディター · 読了時間 4分
『ポップ』なのにエクセル表?ポップコーンDNAを丸ごと注入したナンバージェリーUI刷新録

正直に白状します。「多くのユーザー様からの貴重なご意見をもとに……」なんて綺麗事を言うつもりはありません。

まだ本格的な告知もしておらず、現在遊んでくれているのは地元の親しい先輩や妻、数人の知人だけという、ごくごく身内の状態だからです。

しかし、その身内から飛んできた感想が、あまりにも辛辣でした。


先輩と妻からの容赦ない痛烈パンチ

何日も徹夜して無限ループバグを潰し、v0.5バランスパッチを終えた後、意気揚々と近所の仲の良い先輩にテストリンクを送りました。先輩は1分ほど無言で画面をなぞり、こう言い放ちました。

「おい、ゲーム名に『ポップ』って付いてるのに、画面はなんで国税庁の確定申告エクセル表みたいなんだ? 弾ける爽快感が1ミリもねえぞ。」

隣で皿洗いをしていた妻も画面をチラ見して一言。

「ねえ、これ幼児用の数字お勉強ドリルなの? 今時の小学生のドリルでも、もっとカラフルで可愛いく作ってあるよ。」

……返す言葉もありませんでした。

開発者の目には、6列8行のマス目が整然と並び、1から5までの出現確率が綺麗に分布しているのが美しく見えていたのかもしれません。しかし遊ぶ側から見れば、単なる**「48個の数字がぎっしり詰まった息苦しい四角い牢獄」**だったのです。


「ポップ? ……それならポップコーンだろ!」

モニターの前でぼんやりと、ゲームの名前を口の中で転がしてみました。

ナンバージェリー(Number Pop)。 ナンバー“ポップ”。

一体何が「ポップ(Pop)」するんだ? 風船? プチプチ? シャボン玉?

その時、頭の中でパッと電球が灯りました。

「ちょっと待てよ……POPなら、どう考えてもポップコーン(Popcorn)じゃん!」

熱した鍋の中でコーンの粒がパチパチと弾け飛ぶように、指が触れるたびにふわふわのポップコーンがポンポン弾けるゲーム。名前に「ポップ」が付いている以上、このゲームの魂は絶対にポップコーンでなければならないはずです。

その瞬間から、ゲーム全体に**「ポップコーン」というデザインDNA**を丸ごと移植する大手術が始まりました。


1. ビフォー&アフター:四角いエクセル表から、できたてポップコーンへ

まずは「確定申告の表」という汚名を返上すべく、6×8の盤面から徹底的に手を入れました。

刷新前(エクセル感) 刷新前のナンバージェリー画面
暗い青緑色に四角いブロック。効率的ですが無機質だった初期の画面です。
刷新後(ポップコーン感) 刷新後のポップコーンUI画面
雲のようなポップコーン型タイルとパステルカラー、見やすいダッシュボードに生まれ変わりました。
  • ふわふわポップコーン粒: カチカチの長方形を完全に捨て、マシーンから飛び出してきたような雲型シルエットのタイルに全面刷新しました。
  • 目に優しいパステル5色:
    • 1: 爽やかなミントグリーン
    • 2: 清涼感あふれるスカイブルー
    • 3: 優しいライラックパープル
    • 4: 甘いコーラルピンク
    • 5: 香ばしいハニーオレンジ 妻から指摘された「お勉強感」を払拭し、視界の端で流し見しても次の数字がどこにあるか直感的に把握できるよう、彩度と明度を精密に調整しました。
  • 整頓されたヘッダー: 90秒タイマー、現在スコア、レベル倍率に加え、ピンチの時に使える**「✦ ヒント」や、ゲージを溜めると発動する「ポップコーンフィーバー」**もポップコーン仕様で整列させました。

2. スワイプの手応え:星屑のネオントレイルと振動フィードバック

見た目が可愛くなるだけでは足りません。指先でポップコーンが弾ける物理的な「手応え」があってこそのゲームセンターです。

数字をドラッグしてつなぐ画面
1から2へドラッグするとエメラルド色のネオンラインと星屑(✦)が点火します。
  • 息づく接続軌跡: 指を置くとタイルがふわりと膨らみ、柔らかな光のパルス(Glow)を放ちます。数字をつなぐたびにエメラルド色のネオントレイルと星の煌めき(✦ ✦)が追従します。
  • リアルタイム経路ガイド: 画面最下部に**1 → 2**のように現在の接続状況がリアルタイムで表示され、迷うことがありません。
  • スマホ振動(触覚)トグル: 画面上部に**「振動ON/OFF」**ボタンを新設。5個消去でポップコーンが弾けた瞬間に指先に伝わる小気味よい振動が、爽快感を何倍にも引き上げてくれます。

3. クライマックス:ポップコーンマシーン大爆発リザルト演出

しかし、先輩と妻から一番大きな歓声が上がったのは、ゲームが終了する瞬間の演出でした。

以前は90秒間指を全力で動かしても、時間切れになると小さな文字で「スコア: 00点」とダイアログが出るだけでした。先輩曰く、「なんかあっけなさすぎて虚しくなるわ。」

そこで全力で作ったのが、名付けて**「ポップコーンマシーン大爆発フィナーレ」**!

ポップコーンマシーン大爆発演出画面
レトロなポップコーンマシーンから黄金色の雲が一気に噴き出し、マスコットが大喜び!

タイムアップの瞬間、画面中央の可愛いミントカラーのポップコーンマシーンのフタがポンと開き、プレイ中に弾けさせたポップコーン雲が画面を埋め尽くします。その上ではポップコーンのマスコットが両手を挙げて万歳!

大爆発の奥には、今回のプレイの勲章が誇らしく並びます:

  • 最大コンボ: 138コンボ!
  • 5個消去成功: 32回!
  • ワンタップ共有&保存: 「ゲームを共有」と「自己記録を保存」ボタンで、友達にすぐハイスコアを自慢できます。

おわりに:先輩、もう確定申告に見えないでしょ?

完成したビルドを先輩に再度見せると、スマホを触ってニヤリと笑いました。

「お、ちゃんとゲームになったじゃん。最後にポップコーンがブワーッと弾けるの、地味にクセになるな。」

妻もベッドに寝転がって5回連続で遊び倒したあと、こう言ってくれました。

「タイル可愛いね。最初からこうやって作ればよかったのに。」

「ポップ」という名前ひとつから始まった、ポップコーンDNA注入大作戦。 エクセル表のような息苦しさを完全に脱ぎ捨て、いつ開いてもパチパチ弾ける、本物のWebミニゲームになりました。

アプリのインストールも会員登録も要りません。 今日一日の疲れを吹き飛ばしたいなら、ブラウザでサクッとポップコーンを一釜、弾けさせてみてください!

#開発ノート#ナンバージェリー#UI刷新#ポップコーン#インディーゲーム#ゲームデザイン