index.md (7854B)
1 --- 2 title: "What’s in a Word? Building a Verbose Party Game" 3 date: 2023-05-25T00:00:00+00:00 4 draft: false 5 canonical_url: https://www.viget.com/articles/whats-in-a-word-building-a-verbose-party-game/ 6 --- 7 8 Fun group party game. Somehow incorporate AI. Build it quickly. These 9 were the constraints we put on our mostly Colorado-based Pointless Corp. 10 team before [Pointless 11 Palooza](https://www.viget.com/articles/the-enduring-point-of-pointless-corp/). 12 A few of us wanted to partake in the old Pointless tradition of trying 13 out another role on the project, so simplicity was key. Thankfully, 14 Haley was itching to build a digital version of a very fun, but 15 relatively straightforward, game. 16 17 [Just One](https://boardgamegeek.com/boardgame/254640/just-one) is a 18 collaborative word association game that encourages both teamwork and 19 creativity. On a given turn, everyone except one player (the Guesser) 20 knows a random mystery word and must attempt to get the Guesser to guess 21 the mystery word via one-word hints. The catch is that every hint must 22 be unique, so duplicate hints are eliminated and not shown to the 23 Guesser. 24 25 Haley mentioned that she often hacked the board game to accommodate more 26 than 7 players and thought that doing so added a fun element of chaos to 27 the rounds. A digital version of the game would facilitate expanding the 28 party and it seemed like an easy enough lift for our team. 29 30 It's easier to play than explain, so mosey on over to 31 [verbose.club](https://verbose.club) and give it a try. And, if you want 32 to know more about how each of us fared going heads down on one project 33 for 48 hours (and counting), read on. 34 35 {{<dither 662shots_so-1.png>}}Three iPhones show different moments of the colorful word-game “verbose,” from starting a game to guessing and celebrating with playful pastel panels.{{</dither>}} 36 37 ## [**Haley**](https://www.viget.com/about/team/hjohnson/) **\| Pointless Role: Design \| Day Job: PM** 38 39 **My favorite part of building verbose.club** was being granted 40 permission to focus on one project with my teammates. We hopped on Meets 41 or huddles to discuss requirements. Nicole and I jammed in the same 42 Figma file or wireframe. I got to drop everything to QA a 600-word word 43 bank. Viget has great ways of collaborating remotely, but it was also 44 fun to be part of the in-office crew, having late night snacks between 45 cram sessions like we were in college again. 46 47 **Something I learned**: I tried my hand at being a "designer" and 48 learned quickly that nothing is too precious. Sometimes the code 49 translates things differently. Also, design systems are essential to 50 throwing together screens quickly. And Figma has tons of libraries that 51 you can use instead of starting from scratch! 52 53 ------------------------------------------------------------------------ 54 55 ## [**Haroon**](https://www.viget.com/about/team/hmatties/) **\| Pointless Role: Dev \| Day Job: Product Design** 56 57 **My favorite part of building verbose.club** was stepping into a new 58 role, or at least trying to. I got a chance to build out styled 59 components and pages for our game with React, Typescript, and Tailwind. 60 Though my constant questions for Andrew and David were likely annoying, 61 it was an extremely rewarding experience to see a project come to life 62 from another perspective. 63 64 **Something I learned** is that it's best to keep commits atomic, 65 meaning contributions to the codebase are small, isolated, and clear. 66 Though a best practice for many, this approach made it easier for me as 67 a novice to contribute quickly, and likely made it easier for Andrew to 68 fix things later. 69 70 ------------------------------------------------------------------------ 71 72 ## [**Nicole**](https://www.viget.com/about/team/nrymarz/) **\| Pointless Role: Design \| Day Job: PM** 73 74 **My favorite part of building verbose.club** was seeing our team 75 immediately dive in with a "we're in this together" approach. I am still 76 relatively new to Viget and it was my first time working with a handful 77 of my teammates, so I really appreciated the collaborative environment 78 and how everyone was really open to hearing new ideas, trying something 79 new, and working together to make something cool. 80 81 **Something I learned** was how to use [Whimsical](http://whimsical.com) 82 and [Figma](http://figma.com) to make wireframes and designs. I had used 83 these tools before; but, it was my first time "building" anything at 84 Viget --- and it was super fun. I'm glad I got to try something outside 85 of my usual PM role. 86 87 ------------------------------------------------------------------------ 88 89 ## [**Andrew**](https://www.viget.com/about/team/athomas/) **\| Pointless Role: CEO Dev \| Day Job: Dev** 90 91 **My favorite part of building verbose.club** was coordinating work 92 among my teammates. With less than 3 days to do everything, we had to 93 hit the ground running. To start, our PMs and designer jumped on 94 wireframing and design thinking while David brought to life a Rails 95 back-end & API. I was in a good spot to act as the messenger between 96 these two lines of work: parsing high-level thinking & decisions from 97 the designers into information useful to David in crafting the API; then 98 shuttling David's feedback back to the broader team. 99 100 Next up, it was time to build out the user-facing Remix app. We were 101 able to split this work into two parallel streams. I built out unstyled 102 screens, game business logic, and the necessary glue code, resulting in 103 a functional app with a barebones UI. In parallel, Haroon built out 104 high-fidelity screens, using static placeholders where dynamic content 105 would eventually live. From there, collaborating to merge our work and 106 upgrade the UI was a simple task. 107 108 I think our team came out of this project inspired by what can be 109 accomplished with smart coordination. We managed to efficiently build 110 consensus, parallelize work, and learn from one another --- and the 111 result speaks for itself. 112 113 **Something I learned** was that parallelizing a project is tricky and 114 communication is key. When multiple streams of work are progressing in 115 parallel, decisions are constantly being made --- some big, some small 116 --- and many having more influence than immediately apparent. Keeping 117 all contributors 100% in the loop is likely impossible, and certainly 118 unrealistic. Smart coordination and communication is the magic sauce 119 that makes it all work. 120 121 ------------------------------------------------------------------------ 122 123 ## [**David**](https://www.viget.com/about/team/deisinger/) **\| Pointless Role: Dev \| Day Job: Dev** 124 125 **My favorite part of working on verbose.club** was helping from afar. I 126 was 1,500 miles and several time zones away from most of the team, so I 127 really focused on doing low-level work that would enable the rest of the 128 team to be successful: setting up an API, getting the app running on 129 Docker for easy local development, and making it straightforward for 130 others to deploy code. It was sort of like being the bass player in a 131 rad band. 132 133 **Something I learned** is that [Caddy](https://caddyserver.com) is 134 super legit. Here's the entire web server config file, which 135 automatically sets up HTTPS and proxies traffic to our Remix app: 136 137 verbose.club 138 139 reverse_proxy remix-prod:3001 140 141 Our overall architecture (running with `docker compose`) looks like 142 this: 143 144 {{<dither verbose-arch.png>}}Flowchart showing a Caddy frontend feeding into Remix, which in turn drives a Rails backend that splits into Postgres and Redis services.{{</dither>}} 145 146 ------------------------------------------------------------------------ 147 148 In two days' time, we had a beautiful, functioning game that we played 149 during our Pointless celebration happy hour. Since then, we've added 150 some cool animations and the ability to pull in AI players --- no human 151 friends required! So, grab some friends (robot or otherwise) and check 152 out [verbose.club](https://verbose.club)!