Break Into . Us (lock puzzle game)

I’ve made a puzzle game about breaking open padlocks. If you just want to play the game, go play the game. Or read on for the how-and-why of its creation.

About three months ago, my friend Claire, in a WhatsApp group we both frequent, shared a brainteaser:

WhatsApp message from Claire, challenging people to solve her puzzle.
Was this way back at the beginning of April? Thank heavens for WhatsApp scrollback.

The puzzle was to be interpreted as follows: you have a three-digit combination lock with numbers 0-9; so 1,000 possible combinations in total. Bulls and Cows-style, a series of clues indicate how “close” each of several pre-established “guesses” are. In “bulls and cows” nomenclature, a “bull” is a correctly-guessed digit in the correct location and a “cow” is a correctly-guessed digit in the wrong location, so the puzzle’s clues are:

  • 682 – one bull
  • 614 – one cow
  • 206 – two cows
  • 738 – no bulls, no cows
  • 380 – one cow
"Can you open the lock using these clues?" puzzle
Feel free to stop scrolling at this point and solve it for yourself. Or carry on; there are no spoilers in this post.

By the time I’d solved her puzzle the conventional way I was already interested in the possibility of implementing a general-case computerised solver for this kind of puzzle, so I did. My solver uses a simple “brute force” technique, as follows:

  1. Put all possible combinations into a search space.
  2. For each clue, remove from the search space all invalid combinations.
  3. Whatever combination is left is the correct answer.
Animation showing how the first three clues alone are sufficient to derive a unique answer from the search space of Claire's puzzle.
The first three clues of Claire’s puzzle are sufficient alone to reduce the search space to a single answer, although a human is likely to need more.

Visualising the solver as a series of bisections of a search space got me thinking about something else: wouldn’t this be a perfectly reasonable way to programatically generate puzzles of this type, too? Something like this:

  1. Put all possible combinations into a search space.
  2. Randomly generate a clue such that the search space is bisected (within given parameters to ensure that neither too many nor too few clues are needed)
  3. Repeat until only one combination is left

Interestingly, this approach is almost the opposite of what a human would probably do. A human, tasked with creating a puzzle of this sort, would probably choose the answer first and then come up with clues that describe it. Instead, though, my solution would come up with clues, apply them, and then see what’s left-over at the end.

Sample output of the puzzle generator for an alphabet of 0-9 and a combination length of 3.
Sometimes it comes up with inelegant or unchallenging suggestions, but for the most part my generator produces adequate puzzles.

I expanded my generator to go beyond simple bulls-or-cows clues: it’s also capable of generating clues that make reference to the balance of odd and even digits (in a numeric lock), the number of different digits used in the combination, the sum of the digits of the combination, and whether or not the correct combination “ascends” or “descends”. I’ve ideas for other possible clue types too, which could be valuable to make even tougher combination locks: e.g. specifying how many numbers in the combination are adjacent to a consecutive number, specifying the types of number that the sum of the digits adds to (e.g. “the sum of the digits is a prime number”) and so on.

A single solution in a search space derived in multiple ways.
Like the original puzzle, puzzles produced by my generator might have redundancies. In the picture above, the black square can be defined by the light blue, dark blue, and green bisections only: the yellow bisection is rendered redundant by the light blue one. I’ve left this as a deliberate feature.

Next up, I wanted to make a based interface so that people could have a go at the puzzles in their web browser, track their progress through the levels, get a “score” based on the number and difficulty of the locks that they’d cracked (so they can compare it to their friends), and save their progress to carry on next time.

I implemented in pure vanilla HTML, CSS, SVG and JS, with no dependencies. Compressed, it delivers to your browser and is ready-to-play in a little under 10kB, most of which is the puzzles themselves (which are pregenerated and stored in a JSON file). Naturally, it lends itself well to running offline, so it’s PWA-enhanced with a service worker so it can be “installed” onto your device, too, and it’ll check for bonus puzzles and other updates periodically.

The original puzzle shown via BreakInto.Us.
Naturally, the original puzzle appears in the web-based game, too.

Honestly, the hardest bit of implementing the frontend was the “spinnable” digits: depending on your browser, these are an endless-scrolling <ul> implemented mostly in CSS and with snap points set, and then some JS to work out “what you meant” based on where you span to. Which feels like the right way to implement such a thing, but was a lot more work than putting together my own control, not least because of browser inconsistencies in the implementation of snap points.

Anyway: you should go and play the game, now, and let me know what you think. Is it worth expanding and improving? Should I leave it as it is? I’m open to ideas (and if you don’t like that I’m not implementing your suggestions, you can always fork a copy of the code and change it yourself)!

Or if you’d like to see some of the other JavaScript experiments I’ve done, you might enjoy my “cheating” hangman game, my recreation of the lunar lander game I wrote in college, or rediscover that time I was ill and came up the worst conceivable tool to calculate Pi.

WhatsApp message from Claire, challenging people to solve her puzzle.× "Can you open the lock using these clues?" puzzle× Animation showing how the first three clues alone are sufficient to derive a unique answer from the search space of Claire's puzzle.× Sample output of the puzzle generator for an alphabet of 0-9 and a combination length of 3.× A single solution in a search space derived in multiple ways.×

12 comments

  1. Andrew White Andrew White says:

    @mattpep @Eskoala This is a numeric equivalent of the Mastermind peg board game from the 70s – built a… https://t.co/9WKtUsq0iO

  2. Andrew White Andrew White says:

    This is a numeric equivalent of the Mastermind peg board game from the 70s – built a digital version of it for my 1st year computing module at university

    en.wikipedia.org/wiki/Mastermin…





    Read more →

  3. John Rogers John Rogers says:

    @Eskoala Love it! Issue with the scoring though, if i get the hardest one just gimme all the points 😅

  4. John Rogers John Rogers says:

    Love it! Issue with the scoring though, if i get the hardest one just gimme all the points 😅



    Read more →

  5. Paul Crowley Paul Crowley says:

    Indeed, while it’s a different puzzle there’s a clear lineage.




    Read more →

  6. Spencer Spencer says:

    Nice! My wife and I just played through all the puzzles and really enjoyed it. A few comments:

    1. The github repo is private. Otherwise I’d file issues there.
    2. The ‘023: monster’ puzzle doesn’t complete for me. I have the right answer (I even checked the json) but the lock won’t open. Looks like the problem is that the inputs are `type=”number”`, but one of the answers is non-numeric.
    3. How are difficulties computed? I tended to take longer on ‘medium’ puzzles with lots of bull/cow questions, whereas high-rated puzzles such as ‘insanity’ (66.6) were quick to solve because the arithmetic rules are easier for me to keep track of.
    4. You should add emojis to your rules 🐂🐄. The text is a bit too verbose to easily grok.
    5. I didn’t come across any rules like ‘one bull and one cow’. Is that deliberate?

    1. Dan Q Dan Q says:

      1. Whoops. Public now. Can’t believe nobody mentioned before now!
      2. Interesting. Shall take a look when I remember to!
      3. Badly-developed heuristics. See the generator source!
      4. Cool idea.
      5. No; the original puzzle didn’t have any of these, and I couldn’t think of a phraseology that I thought would immediately make sense to everybody, so I didn’t bother. Not opposed to it in theory though!

      1. Spencer Spencer says:

        I’ve added a PR fixing 2. Thanks for open sourcing!

  7. Alexander Alexander says:

    I liked your Open The Lock Puzzle and I want you to publish (if you like it) the puzzle that appears in the cover of my new book: CAN YOU OPEN THE LOCK USING THESES CLUES? and you cand find it at: https://www.amazon.com/dp/B08L5MGYYP to see how many people can find the solution.
    Thanks, Alexander.

  8. Anon John Anon John says:

    Very nice! Much appreciated. I’m a novice at writing applications like these, and was about to try on my own, but can already see how this will be helpful if I get stuck. Puzzle games are usually what I start writing algorithms for, but I get side-tracked trying to analyze them in non-brute force ways, then feel content to not actually make anything if I do figure that out. (Of course nothing wrong with your method either; think I’m just more of a math than CS guy at heart. I should actually start making projects at some point, and your work here is inspiring.)

    They’re rather fun puzzles too. Amazing how sometimes the answers just jump out at me, sometimes not so much. Some people on TikTok are amazingly quick with them.

Reply here

Your email address will not be published. Required fields are marked *

Reply on your own site

Reply elsewhere

You can reply to this post on Facebook.

Reply by email

I'd love to hear what you think. Send an email to b17287@danq.me; be sure to let me know if you're happy for your comment to appear on the Web!