简体中文
English
Website review
This review may include AI-generated content and is not individually verified. Domain, certificate and other facts come from the observed data on this page.
What is The Boolean Game?
The Boolean Game is a browser-based puzzle game that teaches boolean operations in vector design tools. Each stage gives you two or more overlapping shapes, and you manipulate them using four operations — union, subtract, intersect and difference — until your result matches the target silhouette. It is made by Method of Action, the studio behind several short interactive design tutorials, and it runs directly at The Boolean Game with no installation.
What it actually teaches
The four operations map to the commands you find in Adobe Illustrator's Pathfinder panel, Sketch, Figma and other vector editors:
- Union merges shapes into one.
- Subtract removes the front shape from the one behind it.
- Intersect keeps only the overlapping region.
- Difference keeps everything except the overlap.
Because the underlying logic is identical across editors, the skill transfers. Someone who has memorised where the buttons live in Figma but still guesses at which one to press will get the most out of it; the game forces you to reason about the geometry rather than the menu.
How a session works
Stages are short — usually a handful of moves. The interface includes undo, a play-again control, a share option for individual stages, sound and animation-speed settings, and a stats panel. Difficulty comes from shape complexity and the order of operations, since subtracting before unioning produces a different result than the reverse.
Who it suits
| Reader | Value |
|---|---|
| Beginners in Figma, Sketch or Illustrator | Builds intuition for what each operation does before you need it in real work |
| Self-taught designers | Fills a gap that most video tutorials skip — the sequencing of operations |
| Experienced vector users | Mostly a warm-up; the later stages are the only ones likely to slow you down |
A practical next step
Work through the stages in order once, then open a real project file and rebuild one icon you already have — a bell, a magnifier, a settings gear — using only boolean operations instead of drawing freehand. If you want more structured practice afterward, Method of Action publishes other interactive exercises in the same style, and general vector-editing courses are widely available through Adobe's own help resources. The main trade-off is scope: this is a focused drill, not a full design curriculum, so treat it as one short session rather than a course.
How does The Boolean Game teach boolean operations for Adobe Illustrator, Sketch, and Figma?
The Boolean Game teaches boolean operations through short, hands-on shape puzzles rather than written lessons. Each stage gives you two or more overlapping shapes and asks you to reach a target silhouette by applying one operation at a time. The four operations it drills are union, subtract, intersect, and difference, and the interface names them directly, so you build the vocabulary while you manipulate the shapes.
What the practice loop looks like
The page evidence shows a stage-based structure with clear controls: a stage list, Undo, Start Over, and Play again, plus Share stage and Continue. That combination supports trial and error without penalty. You can attempt an operation, see the result, undo it, and try a different one. Because the target shape stays visible, the feedback is immediate and visual rather than explanatory.
The settings also matter for learning pace. Sound can be toggled, animation speed runs from 0.5× to 2×, and game data can be reset to factory settings. Slowing the animation helps when you are still mapping each operation to its visual outcome; speeding it up helps once the operations feel automatic.
How it maps to Illustrator, Sketch, and Figma
The underlying logic is the same across these editors, which is why one game can serve all three:
| Operation | What it does | Illustrator | Sketch | Figma |
|---|---|---|---|---|
| Union | Merges shapes into one | Pathfinder Unite | Union | Union selection |
| Subtract | Removes the top shape from the one below | Pathfinder Minus Front | Subtract | Subtract selection |
| Intersect | Keeps only the overlap | Pathfinder Intersect | Intersect | Intersect selection |
| Difference | Keeps everything except the overlap | Pathfinder Exclude | Difference | Exclude selection |
The names differ slightly, and the order of selection matters in real editors, but the mental model transfers. A practical next step: after finishing a stage, rebuild the same result in your actual editor using the corresponding command, then check whether the layer order changes the outcome. That is the gap the game cannot cover, and it is usually where beginners get stuck.
What is the difference between union, subtract, intersect, and difference in vector editing?
Union, subtract, intersect and difference are the four core boolean operations in vector editors. They all take two or more overlapping shapes and produce a single new shape, but each answers a different question about which areas survive.
The four operations at a glance
| Operation | What it keeps | Typical use |
|---|---|---|
| Union | Everything inside any selected shape | Merging parts into one silhouette |
| Subtract | The bottom shape minus the top shape(s) | Cutting a notch, hole or bite out of a form |
| Intersect | Only the region where all shapes overlap | Extracting a shared area, like a lens or joint |
| Difference | The areas covered by exactly one shape, not the overlap | Creating an outline or hollow ring effect |
The easiest way to remember them is by what happens to the overlap:
- Union — overlap is included once.
- Subtract — overlap is removed along with the top shape.
- Intersect — only the overlap remains.
- Difference — the overlap is removed but both shapes otherwise remain.
How they behave in practice
Union and intersect are commutative: swapping the order of the shapes gives the same result. Subtract and difference are not. In subtract, the shape on top (or the last one selected, depending on the editor) is the cutter, so reversing the selection order reverses the outcome. Difference, sometimes called "exclude" or XOR, is symmetrical in shape but still depends on selection for which objects are consumed.
A few consequences worth knowing before you commit:
- Boolean operations usually destroy the original paths and replace them with a new compound path, so keep a duplicate if you may need to adjust the parts later.
- Open paths and shapes with strokes can behave unpredictably; expand strokes to outlines first.
- Self-intersecting shapes can produce odd results with difference and intersect.
A concrete scenario
Suppose you are drawing a crescent moon. Draw a large circle, then a second circle overlapping its right side.
- Union the two circles if you want a merged blob.
- Subtract the second circle from the first to carve out the crescent.
- Intersect them if you actually wanted the thin lens-shaped sliver where they overlap.
- Difference them to get the crescent plus the leftover sliver on the other side — the crescent with a detached piece.
The same four commands appear under slightly different names across editors, but the logic is identical. The Boolean Game turns this into a short interactive exercise where you drag shapes and pick the operation that matches a target result, which is a fast way to build intuition for which command to reach for. For reference material on the surrounding tools, Adobe Illustrator Help and Figma Help Center document how each application names and applies these operations.
Choosing between them
Ask what should happen to the shared region. If it should stay, use union. If it should disappear, use subtract or difference depending on whether you want the cutter shape gone as well. If it is the only thing you want, use intersect. When a result looks wrong, undo and swap the selection order before trying anything else — that resolves most subtract and difference surprises.
Can I use The Boolean Game without prior experience in graphic design or vector editing?
Yes. The Boolean Game is built as a hands-on way to learn boolean operations from scratch, so you do not need a graphic design or vector editing background to start. The page presents it as a stage-based game where the core actions are the four boolean operations: union, subtract, intersect and difference. You learn by doing — combining or cutting shapes — rather than by reading theory first.
What it actually teaches
The skills it drills are the same ones used in vector editors such as Adobe Illustrator, Sketch and Figma: adding shapes together, removing one shape from another, keeping only the overlap, and keeping only the non-overlapping parts. The value is that these operations are usually taught inside a complex application, where menus, layers and tools get in the way. Here they are isolated, so the concept is what you practise.
Who gets the most out of it
- Complete beginners: you can start with no vocabulary. The interface names each operation, and the stage shows you the result immediately.
- People switching tools: if you know one vector editor and are moving to another, the boolean logic transfers directly, even when the menus differ.
- Designers who avoid booleans: if you have been hand-drawing shapes that should be combined or cut, this is a low-stakes way to build the habit.
It is less useful if you already use boolean operations fluently, or if you want a full course in vector design — it covers one family of operations, not drawing, typography, colour or file setup.
Practical notes for a first session
The page includes sound and animation-speed settings, and a slower animation speed can help you see exactly how one shape is being subtracted from another. There is also an Undo and a Start Over, so mistakes cost nothing. If you want to reset everything, the page notes that resetting erases all data as if you had never played.
A useful next step: after finishing a few stages, open a free vector tool such as Figma or Inkscape and rebuild one of the shapes you made in the game, using that app's boolean commands. That transfer step is what turns game familiarity into real editing skill.
Does The Boolean Game work on mobile devices or only on desktop computers?
The Boolean Game is built for a pointer-and-keyboard workflow, so it is best treated as a desktop browser tool rather than a mobile-first game. Its core loop is dragging vector shapes into precise positions, then applying boolean operations such as union, subtract, intersect and difference. That kind of precision is awkward on a phone, where a fingertip covers the shapes you are trying to align and there is no hover state to preview what a drag will do.
What works and what does not
- Desktop or laptop: The natural fit. A mouse or trackpad gives you the control the puzzles assume, and a larger screen makes the before/after of each boolean operation easier to read.
- Tablet: Workable on a larger tablet, especially with a stylus, though you are still fighting the absence of a physical pointer for fine adjustments.
- Phone: Possible to load, but frustrating. Small targets, imprecise dragging and limited screen space make later stages tedious rather than instructive.
A practical way to decide
If your goal is to understand how Illustrator, Sketch, Figma or similar vector editors combine shapes, sit down at a computer for twenty minutes rather than trying to squeeze it into a commute. The lesson transfers directly: once you have internalised why subtract behaves differently from difference, you will reach for the right operation faster in real design work.
If you specifically want mobile-friendly vector practice, look at the official learning resources from the tools themselves, such as Adobe Illustrator tutorials or Figma's help centre, which include short exercises you can follow on a tablet.
How do I share my progress or a specific stage with others in The Boolean Game?
You can share a stage from inside the game itself. The interface includes a Share stage control, so the intended flow is: finish or reach the stage you want to highlight, then use that control to generate a shareable result. The game also exposes a Play again option and a Continue confirmation, which suggests sharing happens at a stage boundary rather than mid-puzzle.
What to expect when you share
The Boolean Game is a browser-based tutorial for boolean operations — union, subtract, intersect, and difference — used in vector editors like Adobe Illustrator, Sketch, and Figma. Its stages are short, self-contained puzzles, so a shared stage is most useful as a demonstration of one operation or one tricky shape interaction.
Because the page evidence does not describe a public profile, leaderboard, or account system, treat sharing as per-stage rather than a running total. If you want someone to see your overall progress, you would need to share the individual stages that represent it, or describe your results alongside the link.
Practical ways to use it
- Teaching a colleague: Share the exact stage where the difference operation finally clicks, so they see the same puzzle rather than a general tutorial.
- Comparing techniques: Two people can play the same stage and compare the shapes they produce, which is more concrete than discussing boolean rules abstractly.
- Building a lesson: A design instructor can collect shared stage links as a set of exercises, each targeting one operation.
For broader vector-editing practice beyond this game, Adobe Illustrator tutorials and Figma's help center cover the same operations in production tools.
hetzner.de
Germany
User reviews (0)