John Dufresne's Portfolio — UX Games
UX Games
A series of UX-themed browser games built to sharpen my prompt engineering skills and explore vibe coding. Each game translates core design principles into interactive, playable experiences that make UX concepts tangible and entertaining.
Super Designo Sprint
A side-scrolling platformer where you play as a UX designer navigating a world built entirely from UI components. Jump on dialogs, collect tags, bounce off hamburger menus, and dodge rogue buttons in this love letter to the design community.
UX Quiz Game (hard mode)
A browser-based quiz game where players match UX definitions to terms across 100 questions. The game tests design literacy with a one-strike elimination format.
UX Connections
Group 16 UX and product design terms into four hidden categories, from straightforward to expert-level. Test your knowledge of frameworks, deliverables, heuristics, and methodology — four mistakes and the puzzle ends.
UX Word Weaver
Find hidden UX and product design terms in a letter grid where every cell counts. Drag through adjacent letters to uncover themed words, and hunt for the special Spangram that spans the entire board.
WUXDLE
A word game where designers test their terminology. Guess the five-letter UX term in six tries — green means right spot, gold means wrong spot. New puzzle, new word, every round.
UX Spelling Bee
Spell as many UX and product design terms as possible using seven letters. The center letter is required in every word. Climb from Newcomer to UX Genius as your vocabulary score grows.
CrossUX Puzzle
A crossword game where every answer is a UX term you actually use. Fill the grid, test your design vocabulary, and work both across and down to unlock the language behind great experiences.
Pixel Pop
A match-3 puzzle game where UX icons clash on an 8x8 grid. Swap Home, Heart, Search, Save, Star, and Chat icons to build combos, chain reactions, and outsmart three levels of increasingly ruthless design challenges.
UX RPG
A 16-bit narrative detective game where players guide Uma Xing through a dark pattern conspiracy. Combines hidden object UX challenges, empathy interview mechanics, and choose-your-own-adventure storytelling across ten scripted scenes.
SimUX
A career simulation game where players progress through six stages of a UX design career — from bootcamp to Director. Each stage features role-authentic tasks: quizzes, wireframing, user interviews, stakeholder negotiations, and team leadership challenges.
UX Defenders
A space shooter where players defend good design against Hick's Law menus and incoming dark pattern threats. Growing navigation bars and manipulative UI elements rain down as your icon fights back.
Pixel Perfect
An interactive plant nursery e-commerce simulation hiding 15 intentional UX and dark pattern errors. Players identify issues across a realistic webpage, then articulate design fixes via an AI chat interface.
How I Built These UX Games
Each game was built using prompt engineering in Claude to generate detailed game design documents, then vibe coded in Lovable using React. The process moved from concept to playable browser game without writing code manually. I did use Claude to write a few lines of code to insert in my Webflow page's custom code to allow the sites to live and be interactive on my portfolio.