Clash of Clans
Every action is a timer you can either wait out or pay to skip.
Clash of Clans turns its entire base-building interface into a grid of countdown timers. Tap a building, see a remaining duration, and a green 'finish now' button quotes the gem cost to skip the wait. This dual-state pattern — wait or pay — repeats across construction, troop training, and resource collection, making time itself the resource the UI sells. The base view doubles as a direct-manipulation editor: drag a structure, watch the placement grid snap, see defensive ranges overlay as translucent rings. Attacks switch context entirely to a deploy-and-watch mode where troops obey only their pathing AI, so the interface deliberately strips control away at the climax. The persistent shield timer and clan-chat dock keep social and defensive status in the player's peripheral vision.
Clash of Clans keeps the home village on screen almost all the time, and every menu opens as a panel over it rather than replacing it. Upgrades, the shop, the clan castle and the builder huts are reached by tapping the building itself, so the village doubles as the navigation. A new player learns the game's structure by learning where things stand on the grass.
The progression gate is the Town Hall level. It caps what can be built and upgraded, and the shop greys out anything that needs a higher hall, which makes the next goal obvious but also stretches each tier across weeks of play. Builders are the real scarce resource: each one can work on a single job, so the interface constantly invites you to queue the next upgrade the moment a builder is free.
Multiplayer battles show the other side of the design. Before attacking you see the loot on offer and can skip to the next opponent for a small gold fee, and after the fight a results screen counts stars, trophies and resources. The replay and defence log let players study how their layout held up, which turns base design into an iterative loop driven by other people's attacks rather than by the game's own hints.
App store
Flows
Flows for Clash of Clans are being captured
We haven't taken Clash of Clans apart screen by screen yet. Explore the UX patterns it's known for, or request an audit of your own product.
Request a UX auditLanding page
We haven't captured Clash of Clans's landing page yet.
Flows
Flows for Clash of Clans are being captured
We haven't taken Clash of Clans apart screen by screen yet. Explore the UX patterns it's known for, or request an audit of your own product.
Request a UX auditNotable UX patterns
How does your product compare to Clash of Clans?
Get a free UX Snapshot of your page — a quick read on what works and what to fix.
Teardowns
Teardowns of Clash of Clans are coming
We haven't published a written teardown of Clash of Clans yet. Explore related topics, or request an audit.
Request a UX auditFree course
WCAG 2.2 Fundamentals: Audit a Screen for Accessibility
6 lessons · ~25 min
Start lesson 1 →