......::::: Portfolio: AI/UX :::::.....
Battleground: Iron & Ember ~ AI-Powered Interactive Combat Game | Claude Code Project (Case Study)
click to view
Battleground: Iron & Ember ~ AI-Powered Interactive Combat Game | Claude Code Project (Case Study)
Client: Self - Case Study
Features:
Credits: Design & Prototyping by Rudy Rogers by way of Claude.ai
Tools: HTML5, CSS3, JavaScript, Claude Code, Anthropic API, OpenAI API, Git/GitHub, Vercel
URL: https://youtu.be/QAd98wgFRh8
About:
What began as a free introductory Claude Code course by way of ZeroToMastery.io evolved into a *Battleground: Iron & Ember*, a fully functional, AI-powered fantasy combat game.
Building on the course's foundation, I expanded the original concept with custom UI/UX design, AI-generated character portraits, a persistent character collection (BattleDex), cinematic audio, configurable settings, and an AI-driven combat judging system.
Using Claude Code as an AI development partner, I directed the design, functionality, testing, and iterative refinement of the application—combining my background in frontend engineering and user experience design with modern AI-assisted development workflows.
Through successive iterations, I expanded the experience with custom UI/UX design, AI-generated characters, persistent character management, cinematic audio, accessible controls, and automated browser testing.
The project demonstrates how I combine established frontend engineering and user experience design practices with AI-assisted development to rapidly prototype, refine, and deploy interactive applications.
Read more about this project >>Building on the course's foundation, I expanded the original concept with custom UI/UX design, AI-generated character portraits, a persistent character collection (BattleDex), cinematic audio, configurable settings, and an AI-driven combat judging system.
Using Claude Code as an AI development partner, I directed the design, functionality, testing, and iterative refinement of the application—combining my background in frontend engineering and user experience design with modern AI-assisted development workflows.
**From Tutorial to Production: Battleground — Iron & Ember**
Starting with the boilerplate application from a free Claude Code course, I transformed a basic AI combat demonstration into a fully realized interactive game.Through successive iterations, I expanded the experience with custom UI/UX design, AI-generated characters, persistent character management, cinematic audio, accessible controls, and automated browser testing.
The project demonstrates how I combine established frontend engineering and user experience design practices with AI-assisted development to rapidly prototype, refine, and deploy interactive applications.

