Tuesday, January 25, 2022

Writing The Wordle Clone

Kelly Powers posted a Wordle project document on the AP CS A Teachers Facebook page. It’s solid as one would expect from Kelly who is just awesome. It inspired me to write my own Wordle clone to better understand what is involved from a student project perspective. Of course I did it my way.

A Wordle project must consist of several parts:

  • Pick a word
  • Accept a guess from the player
  • Analyze the player’s guess
    • Look for letters in the right place in the work
    • Look for letters in the word but not in the right place
    • Look for letters not in the target word
  • Give the player feedback
  • Repeat accept and analyze until player finds the work or had 6 tries
  • Report on end of game

Most of this is platform and language independent. The exception is giving the player feedback. I’ll get back to that.

Picking a word can be easy (a hard coded selection – great for debugging) or a little more involved (picking randomly from a list). The list can be a small array or a large one that involved reading from a file. Which you select depends mostly on where students are with regards to reading from files and filling arrays or array lists. I have links to two large lists of 5 letter words at the end of the post. The first is one that I use and is on my web page. The other is a larger list on GitHub.

Accepting the player guess can be as easy as reading a work from a line. Analyzing the word is the first place where students have to think things our. String methods like SubString for looking at individual letters, IndexOf for locating specific letters in a string, and others are very handy here. Once can create new arrays of a) letters that are in the right place b) letters in the word but not the right place, and c) letters not in the word at all can be useful. I’ve sure there are lots of other ways as well. Much will depend on how you display the results to the player.

Feedback! One can reprint the player’s guess with letters that are in the correct place in UPPERCASE, letters in the word but the wrong place in lowercase, and empty spaces for letters that are not in the word at all. That’s probably a great way if you are totally text based. If you are graphically minded, you can try to duplicate how the web based game displays results.

There are lost of graphic libraries that will let programmers display things graphically. Swing in Java, Processing (for Java or Python), as well as many online drag and drop tools will all do this. I worry that for most of them students spend more time on the graphics than on the nuts and bolts of the rest of the program.

I’ve gotten a bit, ok maybe more than a bit, spoiled using Visual Studio and Windows Form projects in Visual Basic or C#. That is what I used to program my solution (image right). I have 6 arrays of label boxes. Yes, I should have used a two dimensional array. That would have made some things easier but I was not trying to make the best version ever. A lot of beginning programming classes skip multi-dimension arrays as well so I wanted to see how it would be done without them.

As each letter of a guess was entered on the keyboard it was entered in a label box. After all 5 letters for a guess was entered I checked all the letters against the Wordle word and the back color of the box was changed appropriately. The result was pleasing.

Checking for a winner was a matter of checking the state of all 5 label boxes in the row array. This would be similar in a text based display as well.

All in all a very doable project for many programming classes. And it is current which I see as a plus. Additionally students will probably be very happy to play help debug their peer’s programs.

1 comment:

James Abela said...

I just wanted to add that I made a video for a Python Turtle version:
https://youtu.be/UkiTW4BGb8o

You can also compare the source code at:
https://gist.github.com/jamesabela/d1b3e71675893554b784f44478a6bff2