https://navalstrike.app

Procedural generated maps with different game plays (escort, rescue, death match), or historic campaign like search for Bismarck or escort tankers through straights of Hormuz. Browser, works on mobile. No account needed, no Google analytics.

Claude 4.7

I recently built https://navalstrike.app to scratch my naval warfare itch. Happy to share how I did lightweight p2p multiplayer with a super lightweight server handshake if you want :)

I'm an embedded engineer, so it's how I would encode a sprite for displaying an LCD character, it seemed natural to do it this way!

ETA: I've fixed the image transparency and the frigate sprite is less fat, thanks!

I'll play with cruiser sprite too, if you're curious this is how I save them:

  frigate: [
    "................",
    "................",
    "................",
    "...kkkkkkkk.....",
    "..kHHHHHHHHkk...",
    ".kHgGGGGGGGgDkk.",
    "kHHgwGttGttwgDkk",
    "kHHgGGGppGGttgDk",
    "kHHgGGGppGGttgDk",
    "kHHgwGttGttwgDkk",
    ".kHgGGGGGGGgDkk.",
    "..kHHHHHHHHkk...",
    "...kkkkkkkk.....",
    "................",
    "................",
    "................",
  ],

Introducing Naval Strike!

It’s a simultaneous turn-based fleet vs fleet on a grid played in the browser. There’s no account or signups needed. Both players plan their moves, then the turn resolves at once.

There’s three different play styles:

* Solo. Procedural maps and uses guided “AI” opponents (in the same way that 1990s games had “AI” opponents)

* Scenarios. Objective missions on procedural maps like "rescue the downed pilot" or "destroy the convoy"

* Campaigns. Historical battles on real-world maps (Sink the Bismark in the Atlantic, or escort the tankers through the strait of hormuz)

A few things I figured HN would ask:

I designed the architecture and Claude did implementation. While 90% of the decisions are mine 90% of the lines are AI-written. Lots of micro managing short bursts to get it to look/feel right. I think I consumed a week’s worth of tokens just to get the fog working how I wanted. Eventually I learned that having lots of small bursts of code with testing got me to where I wanted much faster than longer sessions. I built preview pages so I could test animations, sequencing etc without affecting the codebase so I didn’t chew through my tokens.

Stack. TypeScript/Canvas 2D, hosted on Cloudflare. The server is a tiny WebSocket relay, it pairs two players by room code and blindly forwards messages, with no game logic. So there’s no accounts and no tracking beyond default Cloudflare insights. Just open the URL and play. Opponent AI is guided scripted tactics with situational decision trees.

Art is a mix of AI/hand. I’m not artistic enough to do everything by hand, but there’s a lot of manual pixel by pixel editing on the assets. Assets are stored as JSON arrays and drawn directly to screen with a colour palette.

I ended up building a small map editor that lets me "trace" Google Maps screenshots to get the campaign maps geographically close to the real engagements. Sounds are from open source libraries - you can mute them with the little speaker button but they are on by default which might upset a few people.

Although this was largely coded by AI, I got heaps of enjoyment being able to focus on the UX, style, gameplay and UI to be just how I wanted. Being able to test (and throw away many!) ideas so quickly was awesome fun.

Feedback welcome. Especially on balance and the campaign design and gameplay, it’s hard to play-test every variable!

Comments URL: https://news.ycombinator.com/item?id=48042110

Points: 4

# Comments: 6

After spending way too long trying to press a button that doesn't do anything (press button, depress button, push button, button, press the button) or trying to talk to the speaker (say open, talk to speaker, talk at speaker, shout at speaker) I got frustrated and used claude to give me a walkthrough based on the source code.

Turns out the correct command was "hi"

here's the walkthrough: https://pastebin.com/LHnFRFjw

[edit] I added touch controls for you :) I put these in seperate includes.

Using Claude Sonnet 3.7 as our "developer" and me acting as the "Product Manager" aka LLM translator, I tried to capture her instructions as verbatim as I could, only adding context to make the prompts work.

The result is a simple browser game which you can play. I added a writeup of all the prompts along the way so you can see how this was put together.

It was only after I realised where she drew her inspiration from.

If you have kids, it's definitely a fun exercise. My wife and I were blown away with how quickly we got something working, my daughter grew tired of it after about a minute.... I fear that this generation will never really appreciate how much effort this used to take.

(No analytics, no signup, etc)

Comments URL: https://news.ycombinator.com/item?id=43827205

Points: 4

# Comments: 6