The problem#
221B Baker Street is a fun board game.
:strip_icc()/pic2235991.jpg)
The goal is to identify the criminal, motive and weapon used in a crime. The first player to do so is the winner. Players take turns rolling a die and move around various places to look for clues. These clues are stored in a paper clue book.
:strip_icc()/pic2958732.jpg)
Unfortunately, searching through this clue book is a tedious process, as you can imagine. This is especially true with a high player count.
So how would you allow players to:
- simultaneously have access to the clues
- reduce the time it takes to search for the right clue
- ensure each player does not read a clue longer than the allocated time?
My solution is to design a web application where players can:
- each have a copy of the clues
- keep track of their reading time
- search for a clue by number instantly.
All that is required on the part of the players is a wifi capable device with a browser.
A quality-of-life improvement#
That was the app. The music is a bit over the top, but I think it captures the sense of urgency pretty well.
You would’ve noticed a scanned page being displayed after the submit button was pressed. This is because the clues are a collection of scans from the physical clue book. There are 1050 clues in the book, stored within 86 pages.
Yes, I did have to scan the whole book, however, I scanned two pages at a time and digitally split them into two. This did not take too long, suprisingly. More importantly, this only needed to be done once.
Each file was renamed to include the range of clues it held. For example, if a page held clues 1 to 30, it would be renamed to clue_1_30.jpg.
To identify the appropriate clue page given an input clue number, the web app extracts the clue range from the file name using simple regex, and checks if the input clue number is within the range.
There is the possibility of a clue spanning two pages, that is why the web app checks all the file names and does not stop at the first match. The web app could be improved by stopping after the second match, however, the performance is sufficient and optimisation isn’t really required for my use case.
In other words, once it was working, I didn’t modify the code for optimisation. My goal was to finish this project within a day. If it met all the requirements and was perfomant enough, it would be enough for me.
Logic diagram#
The logic flow of web app is simple.