🃏 Classic1959RavensburgerEASYMemory (Concentration) rebuild deck
EASY
Nothing is hard except the third click during the mismatch delay, and an explicit three-state machine instead of an isBusy flag closes that for good.
You will get essentially the whole thing.
The interesting bug is a race, which makes this a better teaching build than its complexity suggests. Click a third card during the mismatch delay and a sloppy implementation leaves cards face up permanently, and real players trigger it constantly because impatient clicking is how people play. Insist on a named state machine rather than an isBusy boolean, then test it by mashing the board like a child would. Twenty minutes on the flip animation is well spent: a card that snaps instead of turning loses most of the charm. The matching mechanic is centuries older than the 1959 box, so only the printed card sets are anybody's property.
- Difficulty
- EASY · 1 of 5
- First playable
- An evening
- The original
- 1 team-years
- Released
- 1959 · Classic
- Genre
- Matching Puzzle
Build a face-down card matching game as a single self-contained HTML file. DOM with CSS 3D transforms for the flip, Web Audio for feedback, no build step, no dependencies. Requirements: - Board sizes 4x3, 4x4 and 6x6 so pair counts stay even. Card faces come from a cards.json file holding emoji or inline SVG symbols with their colours, never hardcoded in the logic. - Shuffle with Fisher-Yates. Do NOT use array.sort with a random comparator, which is biased and produces recognisably clumped layouts across sessions. - The load-bearing detail is the input lockout. While two cards are face up awaiting comparison, all clicks must be ignored. Let a third click through during the 700 ms mismatch delay and you get cards stuck face up, phantom matches, and a board that cannot be completed. Implement it as an explicit state machine with states idle, oneUp and comparing. Clicking during comparing is a no-op, and so is clicking an already-matched card. - Flip is a 300 ms rotateY with backface-visibility hidden and cubic-bezier(0.2, 0, 0.2, 1). Matched pairs pulse once and settle at 60% opacity. Mismatches flip back after 700 ms. - Move counter, elapsed timer, and best moves plus best time per board size in localStorage. - Keyboard navigation with arrow keys and space, with a visible focus ring. Definition of done: hammering random cards as fast as I can never leaves one stuck face up, and completing a 6x6 board records a best time.
- The Ravensburger trademark and every licensed card set they publish, from Disney to Pokemon
- The physical business of turning card stock face down, which is why a three-year-old can play it
- Shelf placement in the educational toy aisle, which is what actually sells the boxes
Fisher-Yates, and the bias in every other shuffle
Sorting with a random comparator is the most-shipped bug in casual games, and it is not merely non-uniform: it is an inconsistent comparator, which is undefined behaviour, and it produces recognisably clumped layouts session after session. See the bias as a heatmap once and you will never write it again, and the same twelve lines are what your loot tables and deck shuffles quietly depend on.
ScopeAn evening— build just this, not the game
Build a shuffle bias visualiser. Single self-contained HTML file, Canvas 2D, no dependencies, no build step. Implement four shufflers over an array of six distinct items: - sort() with a comparator returning Math.random() - 0.5 - the off-by-one Fisher-Yates that picks j from the whole array rather than 0..i - correct Fisher-Yates, iterating downward, j inclusive of i - correct Fisher-Yates driven by a seeded integer PRNG Run each two hundred thousand times. For each, build the 6x6 matrix counting how often item i lands at position j, draw it as a heatmap scaled to deviation from one sixth, and print the worst cell's deviation as a percentage plus a chi-squared statistic against uniform. Also count how many of the 720 permutations were ever produced. Put a line in the interface stating why the comparator version is undefined behaviour rather than merely uneven. Definition of done: the comparator heatmap shows structured bias of several percent, correct Fisher-Yates is flat within noise, and the seeded version reproduces its exact matrix on reload.
Not a clone — Memory (Concentration) re-themed and cut down to something you can finish. The angle is the important reel: it is what turns a project into a weekend. 24,360 ways to land.
Matchday Endless
Memory (Concentration), but an endless survival mode instead of levels, set in pro sports. Rendered in neon synthwave.
Build a browser game called "Matchday Endless". The pitch in one line: a matching puzzle in the spirit of Memory (Concentration), but an endless survival mode instead of levels, set in pro sports. WHAT THIS IS Take the SHAPE of Memory (Concentration) — its core loop, and whatever makes that loop good — and rebuild it as your own game in a different world at a smaller scope. Use your own names, art and audio, which you want anyway: a reskin of somebody else's game is less interesting than a new one that works the same way. THE ANGLE — this is the important constraint, honour it above everything else An endless survival mode instead of levels. One arena, escalating waves on a data-driven timeline, a run timer and a score. Replaces level design with a difficulty curve. This is what makes the project finishable. If a decision would push the scope back towards the original's, take the smaller option every time. THE THEME Pro sports. Rules of a real sport as the combat system, a crowd that reacts, and a season structure even if you only ship one match. The theme is not a coat of paint. Let it change what the mechanics mean — a reload, a health pack and a locked door should all be things that make sense in this world and nowhere else. LOOK Neon synthwave. Magenta-cyan split lighting, grid horizons, sun stripes, and chrome reflections on every hard surface. REQUIREMENTS - Runs in a browser with no build step. Canvas 2D unless the angle genuinely requires 3D, in which case three.js. - Fixed-timestep update loop with interpolated rendering, so it behaves the same at 60Hz and 144Hz. - Every tuning constant in one CONFIG object at the top, exposed as live sliders in a debug panel. You will find the feel by dragging those, not by prompting. - All content — levels, entities, balance numbers — in JSON or plain data files, never inline in the logic. - Audio generated with the Web Audio API rather than asset files. - Respect prefers-reduced-motion: keep the fades, drop the shake and the parallax. BUILD ORDER 1. The core loop with placeholder rectangles, at the reduced scope the angle demands. No theme, no art, no audio. Make it fun as rectangles first. 2. The angle's consequences. Cutting to bots, or to turn-based, or to one level changes the design rather than just shrinking it — find out how and rewrite step 1. 3. The theme, as content and data. 4. The look, applied last as a rendering layer over a game that already works. Start by writing a one-page plan: the core loop, what the angle removes and what that frees you to do properly, and what you are deliberately leaving out. Wait for me to approve it before writing code.
Half the time one of these already does what you wanted, and the other half it saves you a week of solving a problem someone documented in 1997.
One count per game. No account — it is tied to a salted hash of your IP, which is not stored in a form anyone can reverse. Every build adds 1 team-years to the counter on the homepage.
Then try these
Questions
How hard is Memory (Concentration) to rebuild with an AI agent?
Yes — every game is buildable at some scope. The question is how hard, and Memory (Concentration) is EASY (1 of 5). You will get essentially the whole thing. Nothing is hard except the third click during the mismatch delay, and an explicit three-state machine instead of an isBusy flag closes that for good. Reckon on an evening to something you can actually play — not to something that matches the 1 team-years Ravensburger spent.
What makes Memory (Concentration) hard to rebuild?
Nothing is hard except the third click during the mismatch delay, and an explicit three-state machine instead of an isBusy flag closes that for good. That is why it sits at EASY rather than a tier either side of it. If you want the idea without the project, the transferable part is fisher-yates, and the bias in every other shuffle — an evening of work.
How long does it take to build a Memory (Concentration) clone?
Wrong question, and it is worth saying why. Nobody rebuilds Memory (Concentration) — the original took Ravensburger on the order of 1 team-years, released in 1959 on Classic. What you can do is reach something playable and genuinely yours in about an evening, and then keep going for as long as it stays interesting. Any figure that claims otherwise is measuring a prototype and calling it a game.
What do I lose by building my own Memory (Concentration)?
The Ravensburger trademark and every licensed card set they publish, from Disney to Pokemon. The physical business of turning card stock face down, which is why a three-year-old can play it. Shelf placement in the educational toy aisle, which is what actually sells the boxes. Those are the parts a prompt will not hand you.
Which AI coding agent should I use to build it?
Any of Claude Code, Codex or Cursor will handle this prompt. Paste it as your first message, let the agent scaffold the project, then iterate on feel — the second, third and tenth prompts are where a game actually gets good. Work in an empty folder or a fresh git branch so you can throw it away cheaply.
One email when new games go on the list. No other reason to email you, ever.