Featured on https://www.kentonline.co.uk/folkestone/news/is-riddle-game-the-new-wordle-266122/
I'm sure many of you are aware of the latest smash hit, Wordle. Well, Riddle Today is kind of like wordle, but instead of words it's riddles (go figure!). It works slightly differently but at the core they're extremely similar projects.
I'm a member of a couple discord communities, many of which started posting these Wordle links which were catching my eye. It seemed like almost everyone I knew was hooked on this new game Wordle (perhaps not new itself, but newly discovered). I gave the game a go and had a lot of fun, starting to build my first couple of daily streaks and getting involved with my friends. After a few days, I discovered spin offs being built of Wordle; but all of them had the same thing in common, they all stuck to the main premis of words. So, after some thought and idea came to mind (I was driving when this happened and had to pull over to write it down). Why not build Wordle, but with Riddles? And everyday, you have a new Riddle to finish?
Now that I had the idea, it was time to start planning. Much the same as my other projects, I started in Adobe XD and began mocking up some ideas. The platform has to closely replicate Wordle, to give people that feeling of familiarity, but also needed a bit more space as I'd have to present an entire riddle and slightly longer answers.
In addition to this, Wordle works by giving you an indication if the letters you've used are present in the answer and the position of that letter. However, this couldn't be done on Riddle Today, for reasons I'll explain later on.
I started planning the code structure and frontend, and eventually finished with this design:
As mentioned above, Wordle uses a hint system that indicated if a letter you uses is in the final answer, this was harder for Riddle Today, because if I followed the same concept, the game would simply be played as Wordle, it wouldn't really matter about the Riddle as you could just use process of elimination to get the correct word.
I had 2 options, the first (and demonstrated in the design above) was a system where each question would have 3 hint sentances; you could then use these to try and guess what the answer might be; I liked the idea of this but really from a logistical standpoint it made little sense and would be hard to maintain. I'd have to come up with 3 hints for each riddle and that takes time.
The second option, was to introduce a letter hint system, similar to Wordle which would reveal a random letter to a maximum of 3 letters. This would closely ressemble the Wordle behaviour but I felt it would still give the user satisfaction for guessing the answer. As you'll see in the live version, I opted for the second option.
As with many games, persistence had to be implemented allowing users to leave the page and return at another time; Riddle Today is the same. All game data is stored in local storage and reloaded when you return to the browser; this stops any of those cheeky gamers from using all their hints and trying to refresh for more (yeah, I'm talking to you.) We also store the stats in local storage; but don't go looking for the answer, we keep that well away from anyone (something that Wordle doesn't do fyi).
Wordles on screen keyboard is actually really helpful for a number of reasons, and the main one not many people aknowledge; having inputs and keystores on a webpage and enabling that accross devices (mobile, tablet and desktop) is a MASSIVE pain. I came to realise this when developing Riddle Today. I initially had keypress events to listen for keypresses and then input letters based on the result of the event, this worked for some browsers but not devices. It was a much nicer solution because there wasn't a need for an input box, but really it just didn't work.
I then decided to add an input field on mobile, this would prompt the keyboard on a device (something that didn't work before) giving users the ability to enter letters and I'd input them into the letter output. This wasn't the most elegant solution, but it worked better than the key events.
After some testing, as mentioned above I identified that keypress didn't work on some browsers, so after some hard thought I decided to implement the input field onto desktop as well, and remove keypress events all together.
Which is why you see the input field above the letter boxes.
One of the driving factors to the success of Wordle was the ability to share your success and the feeling of community you'd get from others sharing in your pain when you couldn't get the Wordle. I wanted a similar system that would benefit the users in similar ways; so staistics was added, letting people know how many times they've won, lost what daily and max streaks they have and ofcourse the ability to share how they did on the Riddle that day. That looks something like this:
https://riddle.today Saturday 26th March 2022: Guesses: 🟢 | Hints: None 😁 | Daily Streak: 0️⃣ | Max Streak: 0️⃣
You can also check out your statistics in the top right of the Riddle Today landing page.
Currently, I hand pick all Riddles before pushing them live. This is for 2 reasons; 1, I like to make sure all content going up is good, it's such early days and incredibly important to make sure people are enjoying the riddles to keep them coming back. 2, I haven't quite worked out the best solution for automation this process. So, until such a time that I do find the best solution, this will do for now. I must say, I do enjoy finding a riddle each day, at the least, I've got a load of icebreaker riddles if I'm ever in an awkward situation.
It's currently hosted on AWS Amplify, which makes it super simple for me to roll out updates and keep it online.
This project was really somethiing fun for me to work on, and a portfolio piece to look back on. However, I wouldn't be opposed to anyone offering a bid on the platform *cough* new york times, please contact me *cough* I hope one day I'll see an influx of users and people enjoying the website, and between now and then I'll continue to refactor the designs untill i'm extremely happy with how everything looks.
If you're interested in playing, hop right in: https://www.riddle.today/
If you'd like to contact me and discuss the platform, use the contact form on my website.
