1.The Concept Color Theory Trainer is a lightweight, web-based training game designed to help designers, artists, and students improve their color intuition through quick visual challenges. I chose this app for a one-day sprint because color theory is practical, visual, and easy to turn into short interactive exercises. It was also a good test of whether AI could help build not just a simple tool, but a small educational game with multiple modes, scoring, feedback, and saved progress.
2.The Stack The Stack: HTML5, Vanilla CSS, JavaScript, inline SVG, and localStorage.
The AI Assist: ChatGPT helped with the initial product planning, feature breakdown, and game-mode structure. OpenAI Codex was then used for the coding phase, turning the concept into a functional single-file browser app with UI, game logic, score tracking, and local saved data.
3.The 1 Day Sprint: Morning (Hours 1–3): We started by brainstorming an app that could be educational but still fun to play in short sessions. Color theory felt like a strong choice because it naturally works with visual feedback. During the morning, we defined the five main modes: Complement, Harmony, Temperature, Match, and Name It. We also planned the core structure: a home screen, game screen, result screen, score system, streak multiplier, timer, and color wheel guide. Afternoon (Hours 4–6): The coding phase began by asking Codex to build the app as one HTML file with embedded CSS and JavaScript. The first version came together quickly, but the challenge was making each game mode behave differently while still using the same scoring and result system. We spent most of this time testing the rounds, adjusting answer logic, fixing scoring behavior, and making sure high scores saved correctly in localStorage. The Finish Line (Hour 7-8): The final stretch focused on polish. We improved the interface so it felt more like a compact color studio instead of a plain quiz page. We added the daily challenge, local leaderboard, light and night themes, sound toggle, responsive layout, and explanations after each round. After final testing, the app was ready to run directly in the browser without any installation or build step.
4.The Roadblocks Roadblocks: The biggest roadblock was balancing scope. The original idea could easily become too large, with lessons, user accounts, advanced palette analysis, animations, and progress tracking. Because this was a one-day sprint, we had to keep cutting the idea back to the most important loop: choose a mode, answer a visual challenge, get feedback, and continue. Another issue was that AI sometimes produced generic quiz-style ideas when the prompt was too broad. To get better results, we had to give very specific instructions, such as how complementary colors should be calculated, how HSL sliders should work, and what feedback should appear after each round. The app improved a lot once the prompts became more concrete.
5.Key Takeaways What was the part that worked the best? The feature planning and repeated game logic. AI was very helpful for quickly turning color theory rules into playable mechanics, especially for modes like Complement and Match where the rules are clear and mathematical.
What was the part that worked the worst? UI consistency and scope control. The AI could generate features quickly, but it needed repeated guidance to keep the design clean, avoid overcomplicating the app, and make the different modes feel like part of one complete experience.
My final thought: If I had one more day, I would add a structured learning path with levels, achievements, and short lessons before each challenge. I would also improve Match mode by showing whether the user was closest on hue, saturation, or lightness. If I could redo this project, I would spend more time writing a stricter handoff document before coding, because clear rules and constraints gave the AI much better results.