Virtual Pet Game

Dev Log — Styling & Code Refactor

CSS Redesign: I just realised I used the wrong images in my last dev log, but overall I slightly updated and polished the project’s CSS for a cleaner look and better UI responsiveness.
Code Optimisation: Rewrote and refactored previous AI-generated code snippets to ensure every part of the codebase is 100% my own work.

Today was a massive 5-hour grind, completely transforming the game from a basic pet project into a much deeper, higher-octane experience. The primary focus was a complete design overhaul for Thunder McKing, ditching the old look in favor of a modern, aggressive NASCAR stock car. The new character design features aerodynamic lines, a high-mounted rear spoiler, Goodyear-style racing slicks, and custom race decals. To make the garage look seamless, every character mood (happy, hungry, sad, sick, sleepy) was re-rendered on isolated transparent backgrounds. A smooth cross-fading system was implemented in the code so when Thunder’s state drops or recovers, the visuals morph fluidly without any clunky image snapping.With the core visuals locked in, the garage environment and pit crew system were expanded to give players more active control over Thunder’s stats. A brand-new tire service mechanic was added, requiring strategic pit stops to keep the race setup performing at its peak alongside the refuel, rest, and engine repair actions. The entire dashboard UI was also overhauled, featuring retro neon gauge tracks, critical low-stat warning alerts, and real-time state detection that reacts immediately to how well Thunder is cared for.The biggest chunk of the build session went into completely rewriting the Race Mode mini-game engine from the ground up. The basic track was replaced with an updated racing canvas that supports fresh map layouts, sharper cornering, and refined driving physics—including custom acceleration curves, drifting feedback, and off-track sand hazards. To make the track feel alive, dynamic AI competitor cars were added to weave around, along with a lap-timing system that tracks split times, triggers flash effects on new laps, and saves your absolute best lap and race records. The result is a much tighter, more rewarding game loop that bridges the gap between pet management and arcade racing!

Dev Log - Final Log

So this project did NOT go how I planned. At all.

I started out building Thunder McKing in Python. Made a whole Pet class, got the stats working — hunger, happiness, energy, health — even had a game loop ticking away. Spent a good few hours on it, honestly thought I was close to done.

Then I hit a wall. Python is great for logic but the moment I wanted to actually show the pet on screen with images and buttons and stuff, it got complicated fast. I had these five custom illustrations of a little race car — happy, sad, hungry, sleepy, sick — and I really wanted them front and centre, not just some text in a terminal.

So I made the call to scrap the Python build and switch to JavaScript + HTML. Bit of a painful decision after all that time, but the right one. JS just made way more sense for what I was actually trying to make — a proper interactive game you can open in a browser, tap buttons, see the car react.

The rebuild went quicker than expected. I carried over all the core logic from my Python project — the stat system, the decay loop, the health penalty when hunger gets too low — and rewrote it in JS. Then built the UI around it: four action buttons (Refuel, Race, Rest, Fix Up), animated stat bars that pulse red when critical, and the car image swapping dynamically based on whatever state he’s in. If he’s hungry you see the hungry car. If he’s about to die you see the sick one. Little details like that make it feel alive.

Got it running with Live Server in VS Code which was a nice workflow — save the file, browser updates instantly.

Biggest lesson from this whole thing: don’t get too attached to your first approach. The Python version wasn’t wasted time — it helped me figure out the logic before I built the real thing. Sometimes you have to build it wrong first.

BUT….

After an initial review after shipping I received feedback to change that overly AI generated look, and to change that up I decided to make the UI a bit more “Radiator Springs” vibe with that rustic Route 66, dusty desert, neon signs, cracked asphalt, the whole look to bring the simulator together. I tried to make a small mini game inside, and instead of an infinite road sim, i made a small track where you have to control a small 8-bit version of Thunder around the circuit and race him to victory!

Dev Log 2 - 09/06/2026

What works now

• Feed, Play, Sleep buttons all work
• Stats update in real time (hunger, happiness, energy, health, coins)
• Pet image changes based on stats (happy, sad, sick, hungry, sleepy)
• Game loop runs every 5 seconds and drains stats over time

⸻

Fixes done

• Fixed broken button commands
• Fixed sleep button bug
• Fixed unreliable colour changes
• Cleaned up update system
• Made one shared click effect system

⸻

Current state

• Fully playable basic pet game
• No crashes or broken buttons
• UI and stats stay in sync

⸻

Next ideas

• Save/load system
• Animations
• Coin shop
• Sound effects

DISCLAIMER
This is nowhere near the final product, I will be using some graphic design knowledge to make the UI more nice to look at and less blocky, I also want to make the images transition a bit better and add a few catchphrases and stuff as well. Any suggestions, please leave below.

Dev Log 1 – Thunder McKing

Date: 10/06/2026

Today I started my virtual pet project called Thunder McKing. I set up the basic project structure and created the main Python file using Tkinter to open a game window. I also began building a simple Pet class for the character.

I had a few issues with setup and file paths at first, but I fixed them by organising my folders properly and testing the program step by step.

Next, I will add a pet image and start working on basic interactions like mood and feeding.