For the past few days, I mostly focused on trying to read up more on React articles and videos to understand React more: how React-DOM is different from React, what triggers re-renders of components, how animations could run efficiently with React, CSS animations versus JS animations…
And for this Tango game, I really didn’t want to have static images/UI because that would be too trivial. I like polish, and I wanted to see how dynamic and interactive I could make the board and its tiles.
So I also had to learn about Rive’s editor, Rive state machines, animating in Rive, polishing my first animation in Rive, using their React library, figuring out why their React components wouldn’t show up…
And today, I now have a simple grid of these animated tiles:
Coming from a development background of a completely different game engine, I’m still wrapping my head around the conventions of animations, CSS, and React. Online examples and tutorials can be pretty limiting when you want to add those small little details. Feels like you end up spending 90% more effort for the final 10% polish.
A full write up is probably in order after I’m done with the project. For now, I’ll keep these progress posts simple and short.