Excercise in constructing a game area and manipulating it's contents inside of the DOM. Working together on this project with Kyle (@anjo-mi https://github.com/anjo-mi) and excited how it will turn out, may The Force be with you!
Link to project: https://starwords.netlify.app//
Tech used: HTML, CSS, Vanilla JavaScript
We started with a concept for how the user might need to interact with this project for the game outcome to produce the desired affect. The SWAPI provides a list of popular characters which gets fed into different utility based arrays and informs the game's grid creation system to populate the game grid with letters/words to find. Here, some specific logic takes over that provides convenient visual cues for the user including fun styles for words that have already been found, followed by a condition for winning the game.
Projects are always so hard to put a lid on and call "done" and this one is no excpetion. I look forward to seeing any optimzations/improvements my collaborator Kyle thinks of implementing and I will go from there about what might be good to put the finishing coat on this project. Some ideas include:
- a welcome screen to start the game and give semantic info to the user about how to play
- a difficulty system that changes grid size/letter count
- multiple word banks
- more mobile optimizations including getting SFX to fire w/o user input (like on desktop)
- more engaging styles
Game logic is much more difficult to come up with the psuedo code for than other implementations I've done. LLMM's like Claude and Chat GPT were helpful for refactoring some of my code base. The game's logic works great on desktop but seeing how much mobile traffic sites like these cant get makes me want to prioritize a mobile experience for my next project.