Web TippsUse custom web fonts in Google Sheets charts(08.09.2026 um 17:05 Uhr)
Web TippsIntroducing the new 1Password App for Google Chat(08.09.2026 um 18:02 Uhr)
Web TippsUse custom web fonts in Google Sheets charts(08.09.2026 um 17:05 Uhr)
Web TippsIntroducing the new 1Password App for Google Chat(08.09.2026 um 18:02 Uhr)

🔧 Programmierung 🕛 vor 2 Monaten 3 Min Lesezeit
0

Project Codebreaker: Save the Fleet

↗ Quelle (dev.to)
🗣️ Stimme:
📑 Inhaltsübersicht

This is a submission for the









Video Demo










Code







GitHub logo



Solve decryption puzzles, uncover enemy plans, and prevent war in this tactical codebreaking game inspired by Alan Turing.






Break The Code



"Break their code. Save the fleet."


Break The Code is a fast-paced, naval intelligence-themed puzzle game where players must intercept and decrypt enemy signals to protect the fleet before time runs out.



🚀 Key Features





  • Naval Intelligence Command Experience: Immerse yourself in a high-stakes mission environment.


  • Decryption Puzzles: Engaging, logic-based puzzles representing intercepted enemy transmissions.


  • Dynamic Game Engine: Built with HTML5 Canvas, featuring a fleet visualization engine.


  • Intense Gameplay: Manage your fleet's integrity while racing against the clock.


  • Responsive Design: Optimized for both desktop and mobile devices, ensuring critical data is always visible.



🛠️ Tech Stack





  • Framework: Angular (v21+) with Signals for reactive state management.


  • Language: TypeScript (Strict Mode).


  • Visuals & Styling: Tailwind CSS 4+ for a clean, technical, high-contrast UI.


  • Graphics: HTML5 Canvas API for real-time game engine rendering.



🏗️ Project Architecture




The project follows a feature-driven, scalable directory structure:




  • /src/app/canvas/: Contains the game engine…










How I Built It



Technical Approach




  • Built the game using HTML5 Canvas for the battlefield and game visuals.

  • Used Google AI Studio throughout the development process to build and improve the game.

  • Used Gemini to help with gameplay ideas, mission flow, puzzle design, and balancing the difficulty.

  • Designed the game around 5 missions, where each completed mission advances the enemy fleet and unlocks the next challenge.

  • Added a 3-life system so every choice matters.

  • Created different puzzle types using number and pattern sequences, including arithmetic patterns, prime numbers, Fibonacci sequences, and multi-step logic.



Interesting Decisions




  • Instead of focusing on combat, I wanted players to stop the enemy by solving puzzles and breaking secret codes.

  • I moved the enemy fleet in five strategic steps instead of continuous movement to make the growing threat easier to understand.

  • I kept the interface simple and used short intelligence messages to tell the story without interrupting gameplay.



The goal was to create a simple experience where players use logic, observation, and problem-solving to uncover enemy plans and prevent war.






Prize Category



Best Ode to Alan Turing




  • Inspired by Alan Turing and World War II codebreakers.

  • Players use logic and code-breaking instead of weapons to stop the enemy.

  • The game celebrates the power of problem-solving and intelligence.



Best Google AI Usage




  • Used Google AI Studio and Gemini throughout development.

  • Gemini helped shape the gameplay, puzzles, mission flow, and overall experience.

  • Google AI acted as a creative partner from idea to final submission.

Vollständiger Original-Bericht
Ausführliche Details, Code-Beispiele & Hersteller-Stellungnahme auf dev.to.
↗ Original-Artikel auf dev.to lesen
Wie bewertest du diesen Beitrag?
1 Klick Feedback
Teilen mit Netzwerk & Team:

Community-Analysen & Experten-Meinungen 0

Verfasse deine eigene Analyse, teile Workarounds oder diskutiere diesen Vorfall im Blog.
Noch keine Community-Analyse verfasst. Markiere einen Textabschnitt oder klicke oben auf Eigene Analyse verfassen“!
Community Pulse: Relevanz-Einschätzung
1 Klick Experten-Votum
🔴 Akute Relevanz 0%
🟡 In Evaluierung 0%
🟢 Keine Auswirkung 0%
Spannende Innovation 0%
Verwandte Story-Cluster & Quellen (Vektor-KI)
Port 8095 Engine
3 Quellen
Use custom web fonts in Google Sheets charts
2 Quellen
Introducing the new 1Password App for Google Chat
1 Quelle
Context-aware access controls are available for Gemini Enterprise in the Admin console
Ähnliche Beiträge
🔍 Verwandte News

Auch interessante Nachrichten Project Codebreaker: Save the Fleet

Thematisch verwandte Begriffe: Project, Codebreaker, Save, Fleet · 6 Treffer

Laden...

Beiträge werden geladen ...

Laden...

Videos werden geladen ...

Laden...

Beiträge werden geladen ...

Laden...

Videos werden geladen ...

Laden...

Beiträge werden geladen ...

Laden...

Videos werden geladen ...

Laden...

Beiträge werden geladen ...

Laden...

Videos werden geladen ...