HN Explorer

Show HN: Figure is a daily logic puzzle game (figure.game)

417 points by sumul ↗ HN
Hello, HN! Figure is a little side project I’ve been working on. Someone described it as Bejeweled meets Wordle.

I built the puzzle interface and website in Next.js and React, which was a first for me and overall a great learning experience. The daily puzzle data is queued up in a PostgreSQL table. Another table stores anonymous solve stats. Once a day, a cron job hits a serverless API that promotes the next puzzle as “live” and prompts Next.js to update the prebaked static site with the new data. The game state is managed with Redux and your stats are persisted to localStorage. Framer Motion for animations. Styling is mostly Tailwind CSS. I use Figma for design and Logic Pro to make the sounds.

I get a lot of questions about how the puzzles are generated. It’s not super sexy. I generate random grids of tiles and then run them through a brute force solver (sounds rough but the puzzles don’t feel anything). Every few days, I play through puzzles that look promising based on the solution space and pick some good ones to go into the queue. The rest are sent back to the void (again, painless).

I’ve spent a little bit of time tinkering with a procedural generator, but so far the random ones are better. The downsides of the random approach are (1) the curation effort required, and (2) the high variability in puzzle difficulty. I have a feeling there’s a whole body of math and CS knowledge where Figure is an example of something that I don’t know the name for (imposter syndrome intensifies).

As for the future of Figure, I feel strongly about keeping it free of ads, login walls, in-app purchases, or anything else that infringes on enjoyment or privacy. I’d also like to make sure Figure is accessible to everyone. English isn’t exactly required to play, but translations for the UI and website would be nice. I’ve tried to build Figure to be friendly to people who have color vision deficiency and people who rely on screen readers and keyboard navigation, but I have no idea if it’s actually any fun in these cases.

Here are some miscellaneous thoughts…

1. It’s been surprisingly satisfying to build a web game with a modern frontend stack. I’ve noticed a lot of grumbling on HN over the years from OG web developers who yearn for the days of semantic HTML, a sprinkling of CSS, and vanilla JS. I was in that boat too and have grumbled plenty about the breakneck pace of frontend evolution. One of my goals with this project was to pick some popular frameworks and give them an honest try. I’m now a believer, but there’s still no way I can keep up with all the progress.

2. I found Tailwind awkward at first, but after a while I realized I was using Figma a lot less and just designing in code with utility classes, which is great for focus and flow. Having lived through the Web 2.0 standards revolution, it was hard to let go of some deeply rooted opinions about semantic purity, but overall I’m sold.

3. I really love side projects. At most jobs, you’re pushed toward specialization. Side projects allow you to build out a generalist skillset, which makes you better at your core job function and better at collaborating with others. It’s also liberating to explore and pivot around without time pressure. Figure started out as a 3D fidget toy in Unity where you fling projectiles at floating objects…

4. I made this game on my trusty 2013 MacBook Pro, which has been almost completely sufficient (ahem Docker ಠ_ಠ). I’ll probably get an M2 Air soon, but I’m reluctant to say goodbye to the best computer I’ve ever owned.

5. I’m very grateful for the people who build and maintain open source projects. It’s also delightful how many paid services offer generous free tiers to let developers play around: Figma, GitHub, Vercel, Supabase, and Pipedream, just to name a few that I’m currently using actively. If you work on FOSS and/or these excellent platforms, thank you.

Anyway, hope you like it. Happy to answer any questions.

116 comments

[ 3.4 ms ] story [ 201 ms ] thread
kitbrennan
I think it’s great! I’d really like to be able to enter my email to get a daily unobtrusive reminder to my inbox.
wruza
Few popups could also help. It doesn’t feel like I’m seriously engaging unless there is a cookie consent.

Btw, you can share the page with a reminder app and set up daily notification.

sumul
This is the way.
pelagic_sky
I didn't really need another daily puzzle in my life, but at least this one looks great and has satisfying interactions. :)
jrh206
11 moves felt like too many. I made my first moves without thinking ahead, and before I knew it, I’d accidentally solved the puzzle on my first try. I felt that the puzzle lacked that elegant “idea” at its core that makes a good puzzle great. (Just my personal opinion)

That said, the visual design is beautiful, and it’s inspiring that somebody was able to create this.

rsaz
I think the number of moves isn’t the key stat here, just the number of tries to complete in that many moves.

I do wonder what the minimum required moves to complete a level is, but it seems it would be at least close to 11. How many moves did it take you?

jrh206
I completed it in 11 moves and assumed that that was the minimum.
rsaz
Ah, think I misunderstood you originally. Anecdotally, it took me a couple tries and some thought, and I felt quite satisfied when I figured it out!

I also find it takes me a few tries on puzzles like this to see if I really like them, so hopefully if you try some harder ones in the future you’ll enjoy it more.

sumul
The minimum is 11 today. It varies by puzzle but is always the minimum for that arrangement of tiles. Assuming my solver is any good.
sumul
I really appreciate the feedback. This is one of the main things I think about, and relates strongly to the part I mentioned about puzzle generation and difficulty variability. I do want this to feel like a consistently great puzzle.

For comparison, the median number of tries it took people to solve yesterday's puzzle (10 moves) was 7. Figure #35's median was 19 tries! Today's puzzle is definitely one of the easier ones, fwiw.

I've vaguely noticed some patterns of tile arrangements that create interesting sequences that are nontrivial but solvable if given some thought. I would love to develop a more formal system where these patterns are used to build up puzzles with more intent than the random boards I'm currently making. If this sort of thing is in anyone's wheelhouse, I'd love to hear from you.

Closi
The “number of tries” metric might be out if anyone else solved it like I did (ie going back to see if there was some smarter solution).

As for your comment about nontrivial puzzles - absolutely! 100% agree - the joy in a lot of puzzle games like bejewelled is unexpectedly clearing half the board with a clever move!

sumul
Not sure exactly what you mean. It only logs the number of tries for your first solve, but you can keep playing around with it after that without affecting your stats (or the global stats).
Closi
Sorry, I mean that I went like this:

* Solve two pieces

* “Oh, maybe if I did it the other way around I could get that in one” <Reset>

* “ok that worked but I wonder if it’s different if I did this…” <Reset>

* “Ok actually all of those have been exactly the same number of moves, but how about if I just reset and do the first again?” <Reset then complete>

I just mean I’m not sure I would class the above as “4 attempts” to show difficulty as you are just using it to test scenarios (ie the above person found it trivial even though it took four ‘attempts’)

sumul
Ah, gotcha. Thanks for clarifying.
Closi
Good luck with the site, production value is great and looks amazing! Finding the difficulty balance will be tough to satisfy both repeat and new visitors, but worthwhile!
asicsp
https://davidkoloski.me/blog/intelligent-brute-forcing/ might help, if you don't already have some sort of automatic solver to figure out solutions.
freediver
This was a great read, thanks for posting. Would like to see similar quality article for solution to similar problems using genetic algorithms.
sterlind
I dunno how you'd use genetic algorithms, since solutions are paths, and there's usually no way to splice segments of candidate paths together.

This kind of problem is known as planning in old AI, and it's languishing. most techniques are just variations of A*, with things like symmetry detection and heuristics tailored to game benchmark problems. It's the kind of thing (IMO) that deep RL fails at, since unlike Chess or Go where your solution-finding simply needs to beat a competitor, here your solution needs to be exactly correct (and ideally minimal.) It's very sparse.

sumul
This is excellent, thanks for sharing. My solver is designed to find every possible solution so that I can evaluate the ratio of "best" solutions to all solutions. A lot of these optimizations are super interesting, but since I'm intentionally going for comprehensive brute force (rather than finding any winning solution as quickly as possible), they're mostly off the table, at least as long as puzzles are randomly generated and I need to filter them based on solution space characteristics like this.

I did realize while reading this that I could get a little more sophisticated by finding out the number of moves in a best solution using an aggressively optimized fast solver. If that number is within a range that's fun to play, say 8-11 moves, then go ahead and find all the rest of the solutions with the maximum brute force. If not, then just scrub the whole thing since I wouldn't use that puzzle anyway.

crazygringo
Either you got really lucky or I'm really dumb :) -- because it took me a solid 6 attempts to solve the game. No matter what I started with, I always had 1 piece left over on all previous 5 attempts.
t_mann
today's puzzle? I find it hard to fail unless I explicilty try. I can see but two dependencies in there (you need to connect the diamonds on the left and the circles on the right), and both are very easy to spot (one of them you're very likely to resolve even if you just click around).

Edit: ok, there are a few more dependencies, but they really easily resolve on their own.

thehigherlife
I like it but wish the puzzle had gravity at the x,y intersection and not just the x axis. For example if you clear out a row it would shift the other rows over to the left.
Someone
I think you meant column and columns, not row(s) (for those who need mnemonics: Rows Run to the Right, Columns Climb)

I think whether to do that is a design choice, though. The current setup puts a penalty on clearing center columns early, effectively splitting the game in two.

thehigherlife
You are correct. I meant Columns. If you clear a column it the whole puzzle should shift left.
quietbritishjim
Easier than a mnemonic is just remembering what real-life rows and columns are. A Roman column [1] pretty obviously has to be vertical or it wouldn't do its job of holding up a ceiling. And you get ducks in a row but they're not often stacked on top of each other.

[1] https://en.wikipedia.org/wiki/Column

Someone
Non-native speakers may need some help (but likely only if their language isn’t Germanic or influenced by Latin. ‘Row’ is Germanic in origin, and I think Latin ‘columna’ made it into many languages)
quchen
> Rows run, columns climb

What a great mnemonic, I’ll start using it even though I typically don’t mix the two up! Thanks a lot.

sumul
Interesting! I've been considering introducing new types of tiles that have unique behaviors in the future, and this could be one of those. I want to balance simplicity with fun, so plan A is to refine the puzzle generation strategy as much as I can before doing stuff like this though.
hackerlight
Amazing, but how can I play previous ones ??

I could sit here for an hour playing them but was done in a few minutes.

rsaz
This is partially the point of the recent wave of daily games spurred by wordle. You can only play today’s puzzle, so you’ll have to return to the site every day to try new ones.

In fact I don’t think I’ve seen any that allow you to play past day’s puzzles.

hackerlight
I don't see why this is a good feature for the user. I just want to play it.
rsaz
It isn’t, it’s a feature to keep the website relevant for a longer time. I’d be really happy to see this one break the mold, considering the rest of the development seems really reasonable and user-friendly.
sumul
I truly love how the daily puzzle format is intentionally nonaddictive. So many games and apps are designed specifically to get you addicted. This was my favorite thing about Wordle when I first heard about it, and it's one of the main reasons I embraced this model for inspiration.

That said, there has been consistent feedback that people want to play old puzzles, myself included. At least for me, the replay value is actually pretty solid after a few days' opportunity of forgetting the solution. So the next big feature I'm working on is the puzzle archive. Stay tuned!

arecurrence
The NY Times Crossword archives past puzzles and it really helped me improve at Crosswords in general. The archive dates back over a decade and there are certainly days that I just really want to do a bunch of crosswords.

I suspect this combo of a new daily puzzle and the complete archive will be the winning implementation over time.

brw
I've been playing Cell Tower[1] for a while now, and it's one of the few that does allow you to redo previous puzzles you've missed (or have already taken and just want to redo anyway). The streak however only increases when you play today's puzzle.

[1] https://www.andrewt.net/puzzles/cell-tower

Kaibeezy
There were a couple of sites that archive and let you play previous Wordle puzzles, unless NYT has lawyered them.
nstart
Been playing since day 9 I think (someone shared it on Twitter). Thanks for making this. Wife and I have added it our list of puzzle a day games.
sumul
Awesome! I did tweet about it to my very small following about a month ago, and all the retweets and enthusiasm were a very encouraging signal to keep working on it. Open to any feedback since you've been at it for a while now.
chresko
Thanks a ton for making Figure colorblind friendly. Many/most tile matching games are color-based, making them difficult if not impossible to play!
sumul
Cheers! Curious to hear if it's friendly enough for you or if it feels like you're maybe having less fun than someone with full color vision.
onychomys
I can't speak for everybody, but since the light green and the white are so close, I have to rely on shapes for those two instead. And then my dumb brain refuses to accept that squares and diamonds are different, lol. Maybe we could get either triangles or circles as one of those colors? Otherwise it's totally color-friendly!
sumul
That's so helpful, thank you. I wonder if anyone would notice or care if I swapped the triangle for the square or diamond...
chresko
100% use the shapes rather than the colors, but the colors you've chose work quite well.
t6jvcereio
We're back to doing websites now? I thought these days everything had to be an app...
bambax
Good game, and great writeup. I'm clearly in the grumblers' camp but will try to take your example as an encouragement to move ahead.
sumul
Give it a whirl! A couple early decisions I made about this that I think really helped: (1) Try to pick frameworks that have been fairly mature for at least a year or two. Even with stable stuff like React Hooks and Next.js I ran into issues that would have been much harder to figure out a year ago. (2) Set aside some time to learn but don't try to learn it all before starting to tinker. I spent about a week reading the official documentation for React, Redux, and Next.js, but it all really clicked in the first few days of building.
matthewfcarlson
I love this. I know I’m a choosy beggar here, but could you add a pwa manifest so I can put it on my Home Screen? Alternatively, is it open source/accepting pull requests?
sumul
It's ready to be installed on your home screen! I mention this on the help page. :-)
RheingoldRiver
It took me 2 tries to solve, I clicked randomly the first time when I realized you had unlimited solves, then I was like, "oh it's probably kinda bad to link a bunch all at once, I should link them strategically" and then I solved it.

I think it would be cool to have two options for solves (1) Limited retries but a higher allowed number of moves and (2) Unlimited retries but requires perfect solves. Let people pick which category they wanna try....but they gotta pick which they're going for prior to seeing the puzzle!

The "share score" screen would then advertise which version they went for and a friend group can compete the same way.

sumul
Neat ideas, thank you for sharing. I'll think about it!
marssaxman
This is fun! Thanks. I've added it to my little folder of daily puzzles (along with Wordle, PlusWord, Shortyz, Weaver, and 7 Little Words).
marchelzo
Neat game. I was bored so I wrote a little brute-force solver in my toy language. Takes almost a minute to solve today's puzzle though: http://paste.pr0.tips/hgs
sumul
Love this. Where can I learn more about your toy language?
feanaro
Your language feels Haskellish, with some Rust-like syntax and mutation thrown in. Were those languages inspiration?
marchelzo
They were :) Before I took the time to write a vim syntax file I just used the Rust one with a couple of tweaks and the syntax was close enough that it sort of worked.
feanaro
Looks pretty sweet! I'd consider using something like that for scripting if it had a non-toy implementation.
[dead] sAbakumoff
recursiveturtle
This post is at odds with the spirit of HN. Please consider another collegial, charitable mindset.
[deleted]
(comment deleted)
gardenhedge
It's not really though. Remember the famous dropbox reply?

HN isn't like IndieHackers or Twitter. Not all ideas/wordle clones are good and worthwhile. HN allows criticism against crypto projects, twitter, any meta products, etc.. so why not this logic puzzle game? It is not against the rules to say "the idea lack any originality. Thousands of games are like this exist". There's no further critique necessary.

parasti
I couldn't figure out how the game is supposed to be played. I clicked some squares and something happened, but what? Your help screen doesn't contain any information about this. Maybe it's obvious once you know it?
sumul
Thanks for letting me know, and sorry if that was frustrating. Your goal is to clear away all the tiles. Tiles that are linked together clear together. Links are made when same-color tiles are contiguously adjacent to each other. Blank spaces are filled in from above. You have a fixed number of moves available to clear them all. Hope that helps!
bscphil
1. I think giving a proper set of rules in the screen incorrectly titled "how to play" would help a lot. Currently it doesn't tell you how to play, it just says what the win conditions are: "Get rid of all of the tiles before running out of moves."

2. The animation is actually quite misleading, given the absence of rules. When you pick a tile from the bottom row, tiles that will be part of the new bottom row (or touching a tile on the new bottom row) become solid before they slide down to the bottom. (This may only be detectable on slow devices. Unfortunately, the animation for your game is extremely slow and janky on my Android phone from 2019.) This gives the impression that my touch has somehow transformed them, and I spent probably a dozen "games" frustratedly trying to figure out how they were being transformed before I realized that it was just a misleading animation.

IMO the way it should work is that the removed tiles should disappear, then all tiles should slide to the bottom, and only then should tiles newly located on the bottom become solid.

sumul
That's really helpful, thank you. I'll see what I can do to optimize the animation performance more, and I'll take a closer look at the animation timing at lower frame rates. Definitely don't want to mislead or confuse!
3bproblem
This game was fun enough that I could see there being some real money to be made here if you play it right, good luck!

https://www.nytimes.com/2022/01/31/business/media/new-york-t...

O__________O
Wordle’s growth peaked shortly after it was bought for 1 million by the New York Times at roughly $3 per user.

- To see the decline, here are some links:

https://trends.google.com/trends/explore?q=wordle

- Look at the decline of tweets per day found here:

https://mobile.twitter.com/WordleStats

bagels
Yes, if the goal was to make money, Wardle struck at exactly the right time, right at the peak.
O__________O
More likely that part of the fun of sharing Wordle was it was not prompting a huge media company, as soon as NYT bought it, my guess is people were less likely to share it, especially other news organizations.

I was honestly surprised to see it had declined, since Wordle still shows up in top ten Google trends on almost a daily basis.

t_mann
Frankly, the decline looks less bad than I'd expected, given how short my own appreciation and of those in my bubble lasted. Google searches are still at ~50% of peak volume (not going to log in to Twitter just to view the thread). Also, Wordle is fun enough that I can see it having a renaissance at some later point (look at Rubik's cubes - the initial boom lasted for 1-2 years, but they're still popular four decades later).
stvnwd
How tight is the correlation between tweets and users though? Anecdotally I know quite a few people who play every day but only ever share their results in private channels. For those that want to compare their results with the general population there is now also WordleBot which probably eats into the tweetshare.
O__________O
You’re welcome to find other quantifiable sources, but to me Google trends speak for themselves. Also, less and less people not sharing answers reduces odds of new users finding it. WordleBot might aggregate stats, but it’s not them same as getting users to share on social media.

Honestly indifferent, thought Wordle was doing better, but I do believe in quantifying trends via notable significant sources; again, if you’re able to think of any, for example NYT article covering it’s grow since being acquired, I would be interested.

stvnwd
I hadn't actually commented on Google. I am saying that I think there is much weaker correlation between tweets and users/growth than in the early days. I therefore don't think WordleStats is a very useful barometer for the Times' investment.

As for Google Trends, I actually think those are some good numbers. Considering what the 100% peak represents in absolute terms, 40% of it is still very solid. I think it's more informative to look at the trend in the context of other search terms. Pick any of the news major stories that have captured the public's attention over the past few months: Russia's invasion of Ukraine; Depp v Heard; Roe v Wade. Wordle is crushing them all. Indeed it seems the only thing more viral than Wordle is COVID. Maybe we'll see some official numbers from the Times at some point but in the absence of anything concrete I suspect they are happy with their purchase.

In any case, do I think Figure can match the meteoric rise of Wordle? It's statistically unlikely. Can it be profitable? I'm no expert in game monetization but for the OP's sake I hope so. I like it.

O__________O
Curious, why did you pick a .game gTLD, which costs a few hundred a year, every year?
paulgb
That stuck out to me as well, given the mention of free tiers on other services. The .game TLD's rates are unfortunately prohibitive for side project games. .games is affordable, though.
sumul
Fair point. I mention the free tiers because I found it to be really low friction to start building without worrying about the pricing of every little service and platform (I did make sure the paid tiers weren't going to be a huge issue or surprise once I was ready to graduate). I'm willing to invest a bit in side projects once they get to a certain point of maturity and have the potential to maybe pay for themselves someday, so at this point I'm paying for the domain, Vercel, Supabase, and the Streamline icons I use.
paulgb
Makes sense, thanks!
sumul
Naming things to be unique and memorable is difficult, and finding a good domain is a big part of that when your product is a website. It wasn't my first choice to support the price gouging of .game, but after a lot of deliberation and some very helpful feedback I got about the not-very-good original name of this game (which had a .app domain), I decided to just go for it. Also Namecheap had a good deal on the first year, which took the edge off a bit. After living for it for a month or so, I rather like the name/domain figure.game, so I don't regret the decision.
Glyptodon
I'm used to this style of game pulling to the right or left to get rid of empty rows and requiring at least two adjacent matching blocks to remove something.
kretaceous
Love, love, love the look and feel. Kudos on launching and the top-tier end result.
bilater
Nicely done! I like these sort of simple UI games. Built one myself using Next.js + Tailwind CSS: https://www.puzzlingtiles.xyz/
t_mann
fyi, when I try to move a tile in your puzzle, it opens the image in the browser instead. if i click back in the browser, it loads a new puzzle.
bilater
oh thats weird - thanks for letting me know.
MilnerRoute
I played it and it was fun.

Wordle (and some other games) do a mandatory pop-up of the instructions just to make sure first-timers understand the rules. This game didn't -- I see now that there's a small question mark at the upper left -- but "clear everything", and then seeing that things disappeared when I clicked on them, was kind of enough. If I really thought about it, I might even say that was part of the fun for me -- figuring out the rules of the system and considering what strategy to use.

I wonder if that could be part of the game -- like on some days, "gravity flows to the right", like the view of the puzzle has been tilted by 90 degrees. (And some days it's up?) Or maybe you can rotate the puzzle by 90 degrees -- so you can transform the right or left side column into the crucial bottom row. Maybe a mystery square, that doesn't have a color or is all colors or switches colors with each click?

Anyways, this game was fun, and had a nice-looking interface. Glad you had fun building it. (Someone once asked me how to monetize a side project, and I said "add it to your portfolio and use it to land a high-paying job.")

sumul
I'm glad you enjoyed figuring it out without instructions. Thanks for letting me know. I got some helpful feedback early on that resulted in the "Pick any tile from the bottom row" prompt. I grew up on Atari and NES and would never read game instructions (Atari was before I could read anyway, ha), so my hope was that I wouldn't need to force a walkthrough on anyone, especially since there's no risk in poking at it to see what happens.
stvnwd
I think it's fine if some rules are left for the player to discover, but in that case I'd just probably tell them as much. I clicked around for a bit not knowing if I was supposed to figure out the rules, or if they were buried in the help / news somewhere and I just couldn't find them.
t_mann
Nice, and cool that this was your first project! Could you share more on your background / how you went about learning those tools? Did you use online courses, or just read the docs?
sumul
Oh, just want to clarify that I've done tons of projects. I've been designing and building interactive products professionally for about 20 years. This was just my first time using Next.js, React, etc. I spent about a week reading the official docs for React, Redux, and Next.js and then started building, with lots of visits back to the docs, Stack Overflow, tutorials, and blogs as needed throughout the process.
t_mann
Thanks. The UX feels really polished, that makes sense if you're a seasoned professional.

One thing, just curious: did you look intwo whether your privacy notice is GDPR-compliant? Sounds more like frank talk than legalese, haha

sumul
I did look into it, although I'm not a lawyer. My understanding is that privacy notice compliance is a function of how personal information is being collected and used. I chose to collect no personal information whatsoever. I think of this as being respectful of you as the user and to the spirit of these types of regulations, rather than being "maliciously compliant" (like the ubiquitous strong default action of "accept all cookies").

Here's a quote from https://gdpr.eu/privacy-notice/ (emphasis mine)

> If an organization is collecting information from an individual directly, it must include the following information in its privacy notice: