Devlog #12 (UI-Redeign)

Today I spent a good amount of time polishing the actual game UI so it feels more like a real browser game instead of a random prototype screen on top of an image.

The biggest change was the in-game layout. I reworked the top navigation so it feels cleaner and more structured, with Home, Round, Streak, Time, and Score behaving more like proper game UI elements. I also kept improving the answer area at the bottom, so the feedback card, answer buttons, and action button feel more connected and easier to read.

Another bigger feature was the new dark/light mode toggle in the bottom-right corner. It now actually changes the game UI theme and stores the selected mode in localStorage, so the theme stays the same after reloading the page.

Theme Toggle Example

function applyGameTheme(themeName) {
  const isDarkTheme = themeName === "dark";
  document.body.classList.toggle("game-ui-dark", isDarkTheme);
  localStorage.setItem(gameThemeStorageKey, isDarkTheme ? "dark" : "light");
}

I will redesign the Summary Page as fast as I can. Today was really productive actually, only thing I had problems with, is some of the CSS and especially some of the animations, so I used some AI there.