Reed's Website

Project: Counting-Up Party Game

Printable cards here!

Inspiration

The mechanic of a group counting up via cards is directly from "The Mind" designed by Wolfgang Warsch. That game restricts all communication to promote tension and uncertainty. The game described here is more ridiculous and unwieldy.

The idea of switching communication methods was inspired by the classic parlor game "Fishbowl", later immortalized into the mechanics of "Monikers" by Alex Hague & Justin Vickers.

Name ideas

I need a name for this game. Just going to brainstorm ideas here:

  1. Count Away
  2. The Count
  3. The Counting
  4. Count Together
  5. Count Up
  6. Order Up
  7. Order In

Log Book

Tue Dec 19 07:45:22 PM PST 2023

By the time I'd started this page, I'd already played the game at 3 different parties and gotten really positive feedback.

I recorded all of the communication method details I had on my most recent version of the cards into a JavaScript data structure in a new page file on my site here

Tue Jan 2 10:33:04 AM PST 2024

Future:

I had a random side thought about constraints-based programming in web development. E.g. the constraint "this content should fit comfortably inside its container". How would you test that in JavaScript (outside a browser)? I don't know of a way. But within a browser, I know a test for that:

  1. Make the content overflow: auto
  2. If a scrollbar appears, then it doesn't fit.
  3. If no scrollbar appears, then it fits.

But the only way to see if that constraint would hold up is to run the program in the browser environment, because there's no simulation for the complex rules of the browser.

And here's where Playwright comes in. Playwright is a headless controller for a browser. So if I could ask Playwright to run my site, and verify my constraints live, then I'd have a live constraint solver.

For this project, I could imagine that being very useful for making some constraint-based assertions on the shapes of cards.

Sat Apr 27 12:06:37 PM PDT 2024

I had an idea of how to solve "the one problem" which brought me back to this game. What's "the one problem?" The original rules of this game had the numbers always counting up from the lowest to the highest. Unfortunately, if you got the number 1 in your hand, you knew immediately you could play that, because it was guaranteed to be the lowest. That meant whoever had the 1 had a better strategy (immediately play the card) than the fun strategy (follow the communication method). This game was supposed to be fun first, so one person not having fun was an immediate failure for me in the role of the game designer. Worse, if someone played 1 immediately and someone else had 2, they could play their 2 immediately next! And 3, and so on!

So, I had an idea for how to fix this, but it complicated the game a bit. I felt like I'd have to try iterate more versions of the game to work out the kinks of the new, additional complication. And to make more incremental progress, I thought I'd have to make more cards. I wanted to automate some bit of the process of making the cards for a couple reasons. One, I wanted to start to work towards a cleaner version of the cards. Second, I wanted to make many versions of the deck with slight variations to test out different gameplay ideas. And I didn't want to keep using the hand-made version of the game anymore anyways because the first version I made on index cards was getting a little worse for wear.

I began to make a generated printable page on my website so I could upgrade from hand-drawn-and-cut cards to stylistic, printed cards. My friend said he would help me laminate, and I wanted a visual I could be proud of before I did that. Laminating it somehow felt significant enought to warrant prior effort, though this was probably one of those useless mental blocks.

I made a page for the cards and got to work.

I had to research how to make a printable page. I had done this before to make an easy resume builder, but it had been a while.

I learned about a new tool! In Chrome DevTools (not sure about other browsers), under the three-dot menu in the top right -> More tools -> Rendering -> Emulate CSS type select "print" to help simulate

I found this interesting project (github) and online where some people worked on a generic, reusable tool for making the kinds of cards I wanted to make in HTML.

Sun Apr 28 07:46:54 PM PDT 2024

I went to the library for a test print. Some interesting results. First, the measurement of poker cards I found online 2.5in width by 3.5in height was over by 1/32in width and 1/16in height. I was surprised to find the border radius I found, 1/8in worked perfectly via CSS.

I felt silly when I realized I hadn't printed any of the cards with English on them.

Future: I made card backs with the number and communication symbols big on the back. It took some programming to make the pages interspersed, 9 cards then 9 backs on the next page to line up with Chrome's printing dialog.

Mon Apr 29 01:37:36 PM PDT 2024

I went back to the library for more printing, this time with my laptop. I found energy there to focus on coding. I refactored all my cards to use a single component since they'd been converging to a similar structure. I also added some runtime checks to assert that all my ducks were in a row, for example that I had a symbol for each tag I used.