7: A Bout in the Making

13th January, 2022 09:57

Edit: An immediate edit. I originally titled this page 'Creating Bouts', but when I uploaded my hand written pages to Paper Website, it suggested, 'A Bout in the Making' as the page name. I like it. :-)

One of the core mechanics of Puzzlebouts will be the ability of a user to actually create bouts, which will be collections of between one and ten puzzles strung together into a set to complete.

These bouts will be timed, which will be one factor in deciding who won a bout, but also failing an individual puzzle will mean you get no points for that round. Obviously the other player could fail the puzzle as well which would mean the round was effectively a draw.

For the last week or so I have been focused on the bout creation screens.

Here is a picture of my initial idea for how the creation screen would look.

And here is how it turned out. I'm pretty happy with it.

When a user wants to create a bout, they can click the 'Create Bout' button in the top navigation bar. The bout creation screen will appear as a modal dialog.

The top set of left/right arrows allows you to choose which round you are working on.

Initially I put quite a bit of logic into how these buttons would operate, making it so you could not move backward and forward unless you had fully saved (by locking a particular round), however it really over-complicated things.

Now I allow you to move around freely and if you end up locking rounds 1, 5 and 9 only, then that is fine and I will create a 3 round bout, ignoring the rounds you did not lock.

Actually, even after I removed some of the complications, when I proudly showed the screen to my wife, she said that she felt it was not obvious enough how to construct a bout, and that maybe I should add some instructions.

I do intend to add some general help screens, and do some videos explaining how certain things work, but she was right, I should also be adding some more immediate help right there in the dialog.

So I added the little information button at the top left of the dialog which if the user clicks on will display step by step instructions on how to create a bout.

Here is a sequence of screenshots showing the creation of a 2-round bout.

Round 1 and Round 2 are locked (by clicking on the padlock above the round name). Round 1 will be an 'Easy' Mini-Sudoku puzzle and Round 2 will be a 'Hard' Killer-Sudoku puzzle.

Clicking on the Create button will show you a summary of your bout. I named this one "Best Bout Ever".

Finally clicking OK will save the structure of this bout to the Firestore database.

There were some tricky technical aspects around picking random games to go into the bout.

I will write a separate post about that soon.