For a while I had been looking for applications to build for my web development framework Reken. First to see if there are more usecases and features to support and second to find bugs.
So while we were on the plane back from a visit to Austria, I said to my better half Paula we should design a game. Paula is a big fan of Wordle and other word puzzle games. We were brainstorming, and came up with an idea which was a mix of Wordle and Tetris.
The Wordle aspect is guessing a 5 letter word but is different in that you already get the 5 letters for the answer but mixed up. You then have to reorder them to find the correct word.
The Tetris angle is the time limit for guessing the word and if the time limit is passed the word is parked in a one of the 7 empty slots below. If all these slots are full then the game is over.
The game has 3 different play modes:
- Chill - this has no time limit for guessing the word. The game just stops after 5 minutes.
- Easy - this mode starts with a 30 seconds time limit to guess the word. Every 30 seconds, the time limit decreases with 1 second, bringing the player to the next level. If there is a word that was parked the player gets another chance of the last word. A 10 second bonus is added to the time that was remaining. The bonus.
- Fast - it works similar to Easy mode, just the time limits are a little tighter. First the time per word time-out is 15 seconds. It decreases every 15 seconds with 1 second. And the bonus is only 5 seconds.
Once the game is over the player can share the result by copying it via the Share button to the clipboard and then paste it to your social media of choice.
So that is the game. I build it with the reken framework. There were 2 features that I added to make the timing aspects for the game easier. I already had some usecases for timers: remove a message after a while, or enabling an animation at a certain point.
I added data-timer which takes a timeout, a boolean to start the timer and the code to execute when the timer stops. The other timing function is a data-interval which takes the interval time, a boolean that start the interval and the code to execute on every interval.
Functionality Reken already supported and was used in developing Wordrow:
- data-text - to display the scoring results.
- data-action - for example pressing the letter buttons to order.
- data-if - to hide and show parts of the game whether the game is ongoing or not.
- data-class - to conditionally add / remove classes.
- data-for - the render the various rows with letters and the result bubbles.
- data-attr-disabled - to conditionally enable / disable buttons.
- data-style - to set styles on an element.
- data-component - to create reusable components: avatar, letter.
The game is about 500 lines of html, css and javascript. Started developing early October and it was online just before Thanksgiving. Spread the word. The game has its own web address: https://wordrow.fun
As an experiment I limited the game play to 3 games a day (1 each of chill, easy and fast mode) and provided an option to get unlimited play, called Wordrow Plus. Payment system is pretty basic with just a link to Paypal and Venmo for now.
I am considering building IOS app using Cordova, perhaps followed by an Android app. Just to prove Reken can be used in this hybrid app usecase.