HN Explorer

Show HN: Pipes puzzle (a.k.a. Net) on a hexagonal grid (hexapipes.vercel.app)

537 points by gereleth ↗ HN
Hello, HN - I wanted to share this puzzle game I made during my vacation.

I'm rather fond of the pipes puzzle where your goal is to restore a scrambled network of connections by rotating tiles. It's usually played on a grid of squares and this all started when I decided to make a programmatic solver for that kind of puzzle. Then I realized that with some minor changes the solver could generate new puzzle instances. I thought about what kind of puzzle to make and someone suggested a hexagonal grid. Adapting the generator wasn't too hard but then I had to create a way to play this variant. So I did just that =).

I find hexagonal pipes a bit more difficult than the square variant because there's a larger variety of possible tile shapes. For an extra challenge I implemented wrap mode where the board can connect to itself (right to left and top to bottom), so there are no convenient outer walls to start from.

The site is made with Svelte Kit, its code is available on github at <https://github.com/gereleth/hexapipes>.

Hope you enjoy playing =).

163 comments

[ 4.5 ms ] story [ 279 ms ] thread
[deleted]
(comment deleted)
Syzygies
Wow! What fun. You have to make this a phone/tablet app...
gereleth
Glad you liked it! I actually play it often on my phone, it's workable when zoomed in. An app would be nicer surely but I don't know how to build those =).
moomin
You 100% need to figure that out, because this is _really_ good and there’s money to be made here. Make sure you’re the one who makes it.
mbusheikin
Well, this seems an appropriate place to plug the phone/tablet app we made with these puzzles, called Noodles 2.

It's the same puzzle style, with square, triangle and hex shapes, with some extra mechanics - disappearing pieces, infinite grid (it wraps around).

gereleth, great job on the puzzles - I played a few of the bigger hex puzzles and it was real smooth. :)

https://play.google.com/store/apps/details?id=com.lummoxlabs... https://apps.apple.com/us/app/noodles-2/id1520711405

gereleth
Nice graphics, I love the soft lines.

I have wrapping infinite grid variants too, but disappearing pieces? Intriguing =)).

joshcaron
I just found Noodles 2 the other day when searching for a new puzzle game to play. I'm absolutely addicted to it; I've already completed hundreds of levels. Wish there was a way to "lock" a piece in place (like via long press) so I don't accidentally rotate pieces I've solved. Great game!
culi
Hey I just mentioned your app in another comment! I don't suppose your app is open sourced haha?

Big fan of the original many years ago. Will definitely check out the sequel

Noodles and all the Conceptis games were the only puzzle apps I never deleted off my phone

dematz
Fun game and nice site, it feels like to pipes what wordle is to words!
gereleth
Compared to wordle, what an honour =). The site design actually comes from the default SvelteKit skeleton project. I was focused on the game part so I never changed it.
swayvil
My first, a 5x5, in 3:08

It was fun, but on the edge of annoying, which seems appropriate.

mkoryak
my first 5x5 I couldn't solve in 4 minutes, then I gave up. This puzzle makes me angry.
WesleyJohnson
2:37 for me, and I'm not terribly good at puzzles. I was getting frustrated and then it just kind of clicked. The color changing is incentivizing. I found it fun in general; might have to do a couple more...
TOMDM
I finished my first on 1:33, starting from the edge and working in, moving to a different spot when I noticed too much flex was my strategy.

Given the authors note in this thread about each puzzle only having one solution probably means I stumbled onto a decent strategy

swayvil
Ya, the edge is key. So are hexes that have minimal possible positions.

I did my second 5 in 3:08 too. Which is weird.

gereleth
This is pretty much how I solve regular puzzles too. I can do most 5x5s in under 20 seconds. Too often did my debugging sessions devolve into puzzle marathons =).

Wrap variants are another story as they have no outer edges. Discovering which tile groups give initial clues there is pretty fun too (when the regular puzzles aren't much of a challenge any more).

klyrs
> Too often did my debugging sessions devolve into puzzle marathons =).

This is why I suck at game development. Congratulations for getting it out the door!

Arrath
I started in the top left corner and worked connections down from there. So far I have a solve yet to take over a minute.
emadehsan
Captivating! So, while generating the puzzle, you are essentially creating a random Spanning Tree for the given nodes (hexagon) arrangement? Then you randomize each pipe piece's direction within a hexagon?

What algorithm are you using for it Spanning Tree?

I have been working on Maze Generation[0] and found randomized Prim's, Kruskal's to be useful for Spanning Tree creation but the good old Depth First Search increases the difficulty of solving a Maze.

[0] https://github.com/emadehsan/maze/blob/main/media/hexagonal....

gereleth
Well the way I wrote my pipes solver was to keep a set of possible orientations of every tile and gradually remove impossible options by using border conditions and some heuristics like avoiding islands and loops. And when this doesn't turn up any new info I resort to depth-first search.

The generator basically does the same but every tile starts out with a full set of possible orientations - every rotation of every tile shape (there are 62 I think). I remove some orientations due to border conditions, then pick a random possible orientation for some tile and so on till the board is filled. There usually is some backtracking involved.

This isn't terribly efficient and can get stuck for quite long when generating large puzzles. I actually want to look into adapting maze generation algorithms for creating these puzzles, so thanks for the link, I'll check it out.

emadehsan
I see. Amazing work you have done! This game is enticing.
emadehsan
My understanding is that since the game mentions:

"Rotate the tiles so that all pipes are connected with no loops."

These is exactly what a Spanning Tree is. So, any spanning tree generation algorithm would do. You just generate a random ST each time and cut this tree where the hexagon borders intersect with it (to get pipe pieces) and randomize their orientation.

These algorithms are not going to disappoint you in terms of performance.

I made tutorials on the topic as well. Might help me clear my point: https://youtu.be/d5yzKkG1n1U?t=36

Apologies for spamming. Sorry, if I'm suggesting premature optimization.

gereleth
There might still be issues with multiple solutions... Because when a board has multiple solutions they're all valid Spanning Trees. But there probably is some way around this.

An efficient generator could perhaps even work client side, so I wouldn't have to store premade puzzle instances in the repo. That would be cool =).

matsemann
Could perhaps look into the source of Simon Tatham's variant? Those are generated client side.
forty
Is there always a single possible solution ? (I did a bunch of small ones and always found a solution pretty quickly)
emadehsan
if the pipes are cut from a Spanning Tree connecting all the hexagons (like the one you witness once you have solved), then yes, for those give pipe pieces, there should be only one solution.
jjnoakes
Is this true? I can almost imagine one puzzle that can create two different spanning trees. Maybe I ought to draw it up to verify.

Spanning trees may be required but not sufficient for a unique solution.

emadehsan
You are right. It is possible that branches (pipes) cut from one Spanning Tree might be re-arrangeable into a different Spanning Tree.
gereleth
All puzzles on the site have a unique solution At least my solver thinks so)). Configurations with multiple solutions are possible, but I weeded those out when generating.
evan_
What are the green/red lines that appear when you click the junction between two hexes?

(really fun game btw, I will have to return to this later. I'm looking forward to sharing this with my 8 year old who's fascinated with logic puzzles.)

gereleth
Those are edge marks, they let you mark some edges as "definitely a wall" or "definitely a connection". It sometimes helps in harder puzzles).
bilekas
This is quite fun actually.. nice work!
bunsenhoneydew
Love it!

I first played the version of this with squares on a Palm Pilot and that was a long time ago. I was even looking for that version for my iPhone the other day but was drowning in other random games (and little network tools) until I gave up.

It shouldn’t take much effort to turn it into a PWA, so then people can use it just like an app. I already saved it to my Home Screen and would certainly play this as a daily puzzle, just like Wordle. Keep up the great work.

harpersealtako
Solved my first 5x5 in 1:54. At first I thought it would be really difficult but then I found a hex which could only go one way (a corner hex with V shape) and then from there the adjacent pipes could only orient one way. There were a few times where I had to think down a tree of possibilities (if this hex goes like this, then this hex can't possibly fit here because of a previously solved hex, therefore it must go like this instead), but never more than one or two steps. All in all it's a very satisfying puzzle format.
pyrolistical
Its annoying having to tap so many times, especially when certain pieces have few valid orientations.
gereleth
You can check out "Orient / Lock" control mode in the settings. It lets you orient a tile in one tap but needs precision about where you tap. I mostly use this mode but it takes some getting used to, so I didn't make it the default.
kps
I think my ideal controls for this would be key presses (configurable) while hovering.

Current bests are 5×5: 00:22.056, 7×7: 01:01.394.

Edit: also, a control to randomize the orientation of all unlocked tiles would be nice.

loganc2342
I have a minor nitpick to share. I’d like it if there was an option to hide the timer, because being under time pressure to solve a puzzle can stress me out. Overall, it’s a fun puzzle, though!
gereleth
Thanks for sharing, I'll add that option (on the weekend most likely).
boosteri
I'd like an opposite option.. where the timer runs out :-) maybe with a neat graphics of water flowing from the bulb starting point(s)
adenozine
40x40???? Wow, that would take me several hours if not a workday or more. Goodness lord
mdavis6890
Great game!

I humbly suggest that you flesh out the rules just a bit more. I struggled to figure out if pipes were allowed to run out of bounds, whether they all had to be connected into a single network, and the significance of the bulb-ended ones. I'm not totally dense and could make some guesses, but this still made the puzzle less than approachable for me at first. Basically I just guessed at these things, tried to see if I could solve one, and once I did and saw my complete solution all was clear. But why not state these things up front? Or maybe that's part of the puzzle? :-)

My first solve took 9min, then 3, then 1.5min for my third.

seanalltogether
This was exactly the same for me. I wasn't sure if all pipes had to be water tight or not. Once I understood what the actual constraints were I could solve the next ones quicker.
gereleth
Fair enough, I'll think how to word all this.
mdavis6890
- All sections must be connected into a single, contiguous network. - The whole network is contained in the grid, and no pipes may run outside the grid. - Bulb-shaped pipes with a single connection are terminations (dead-ends).
mdavis6890
I'll agree with other commenters that actually just showing a complete solution is better. Or both!
JelteF
I think simply having an image of what a solved network looks like would help a lot.
Bootvis
Agreed, I didn’t bother reading the rules and just started clicking. I doubt I would read the rules even if they were written perfectly.
hombre_fatal
a pic of a before and after puzzle would answer these questions intuitively as well.
jonny_eh
Those kinds of edge cases can be easily overlooked by people that play a lot of these types of puzzle games. Great feedback.
michannne
Solved in 1:39, very fun game and great implementation! I'm not much a fan of pipes games but have played similar concepts such as Infinite Energy on mobile. This is a good job for such a quickly developed project
ranman
Why are the SVG tiles specified to 599.99999999 instead of 600 or something? I think a SVGO optimizations run would reduce the size of the assets a tad.
Etheryte
I would guess that the assets were made in Inkscape or comparable software where you work visually and don't actually look at the generated code.
gereleth
There aren't really any assets though. I just create the svgs dynamically. Maybe I need to place some strategic `Math.round` calls here and there, never thought of this =).
ranman
Yeah so if you can math.round or math.floor them a bit the paths are a lot cleaner - if you're dynamically creating them anyway though then I don't know that it gains you much performance. It might gain some performance on render for larger maps? Not sure.

Didn't get a chance to look at your source.

OisinMoran
This is super fun! Just played a few and my best on the 5×5 was 0:42. Thanks for sharing!

Love your description too—would love to see a more in-depth write up if you get the time! It's so fun when you can flip from solving something to generating it. I'm also a fan of solving games with code and have made an Upwords bot that plays perfectly but realized I could use it to try to find better "hyperparameters" for the game (like how many points certain bonuses are) by getting it to play itself and having some metric of what a better game would be. Though as you can probably tell from the lack of a link I have yet to do that part.

usmannk
my first 5x5 try was 0:58. I was actually very surprised when it came together as it felt like i was just randomly fitting pipes to their nearest neighbors.
OisinMoran
Yes, much like falling asleep, falling in love, or going bankrupt this was quite the "slowly, then all at once" type of affair.
furyofantares
Very cool! I suggest adding a daily puzzle with a share result (day number and how long it took to solve) like all the games in the wordleverse do. My spouse and I would enjoy doing one daily and sending our results to each other.
gereleth
Good idea! I'm already thinking of how to implement... I really need another vacation or two, lol
hutch120
Fun game! Can I suggest adding a licence file to Github so people know what they can do with the repo.
raydiatian
This 40x40 was a bad idea and I know I'm going to regret this.
ryukoposting
Fun game! This will make a great fidget when I don't have much to do at work.
TheDudeMan
Very nice! Maybe right-click should rotate the other direction.

Edit: Oh, now I see that right-click locks the tile. Yeah, that's a nice function, too.

gereleth
You can change control mode in the settings. The default is rotate/lock, but there's a rotate/rotate as well. And... another tricky one for orienting a tile in one click.
ALittleLight
I struggled with the first 5x5 taking about 8 minutes, then 2.5 minutes, then less than one minute. I'm still not even sure what principle I'm using to solve these but it is enjoyable. It's mainly just rotating until I hit the right color and looking for the next 3+ joint to rotate.
yarg
It's a bit like sudoku; start with the elements for which there's only one choice, and rotate into place.

Often this will lead to more tiles with only one viable configuration.

(At very least you'll reduce the search space.)

culi
I used to play this exact game on a mobile app. One great feature was the ability to click and hold to "lock" certain pieces into place. Like you pointed out, there's certain pieces (on the edges) that only have one possible configuration

My 5x5 is record is 28s on my 5th game. The strategy is actually really simple once you get going: run through and identify all the "lockable" (only one possible configuration) tiles and then run through the consequences of those configuration and keep repeating