跳到正文
DEV Community· Salman Tariq·· 2 小時前AI 評分33

Number Nebula:作者在 Google 社羣活動打造並升級雙人益智遊戲

I Built a 2-Player Brain Game at a Google Community Event (and Then Leveled It Up)

AI 導讀

作者在 Google AI Studio 活動中打造雙人益智遊戲 Number Nebula,並加入連擊攻擊、道具、Boss 戰、按年齡調整難度、機械人對手及 Word Builder 模式。

正文

Cover image for I Built a 2-Player Brain Game at a Google Community Event (and Then Leveled It Up)

Salman Tariq

I Built a 2-Player Brain Game at a Google Community Event (and Then Leveled It Up)

Today, I attended Vibe Coding with Google AI Studio, hosted by GDG on Campus in Peshawar. The session was about Google AI Studio and how it can turn a rough idea into a working app in minutes.

At the end, the speaker gave us a challenge: build a game. The top 3 would get a surprise. 🎁

Here's what I built, what I learned, and how I took it further.

🎮 Play it first

👉 Play Number Nebula on CodePen

Controls: Player 1 uses A D to move and W to fire. Player 2 uses the arrow keys. No friend nearby? Pick Cosmic Bot.

💡 The idea: Number Nebula

I wanted a game that is fun for kids but still makes adults think. So I mixed a classic space shooter with puzzles:

  • Math Duel: solve the sum, then shoot the alien carrying the answer.
  • Word Builder: read a clue, then shoot letters in the right order to spell the word.
  • Brain Mix: both, taking turns.

Two players share one screen, and every 3 correct answers in a row fires an attack (Freeze, Fog, or Meteor Rush) at your rival.

🔁 How I built it

  1. Prompt: I wrote a structured prompt (concept, controls, levels, scoring, visuals) and gave it to Google AI Studio. It built a working version on the first try.
  2. Iterate: I listed improvements and ranked them by impact. The biggest problem was that players never affected each other, so I added combo attacks.
  3. Level up: I added power-ups, a boss battle, age-based difficulty (so a 7-year-old and an adult can play a fair match), a bot opponent, and the Word Builder mode.

My biggest lesson: make one change at a time, test it, then move on. Small steps beat one giant request.

⚙️ Under the hood

  • Pure HTML5 Canvas + JavaScript, one single file, no frameworks
  • Sound effects generated in code with the Web Audio API (no audio files)
  • A simple game loop: update positions → check collisions → draw, about 60 times a second

🚀 What's next

  • Online multiplayer, so two friends can play from different cities
  • Theme packs for Word Builder, starting with coding words like LOOP, ARRAY and CLASS
  • A global leaderboard

I'm a Software Engineering student at IMSciences, Peshawar, and I'm building in public. Feedback is very welcome: what mode should I add next? 👇

來源:DEV Community · dev.to