Playground
An illustrated learning world for the youngest grades, rebuilt from the ground up. Every screen hand-drawn, every interaction made to delight a child still finding their feet.
01 CONTEXT
Its own product, built for the youngest learners
Playground is a separate product in the Izzi family, built originally for the Slovenian market and school grades one to five. It shares some skeleton data with Bookshelf, but it is its own thing, with its own audience, look, and logic. Where Bookshelf is clean and utilitarian, Playground is a fully illustrated world: every interface, button, and interactive element is custom artwork, with horizontal scrolling and a heavy focus on gamification.
Izzi brought us in when Playground was an early-stage product in rough shape, with no system holding it together. We rebuilt it from the ground up. Every illustrated UI element is ours, with some backgrounds by teammates and the animated characters supplied by the company that owns the product.
02 PROBLEM
A charming idea trapped in a product that did not work
The concept was sound: a playful, illustrated learning world for little kids. The execution was not. The product had been built without a designer who understood interfaces, and it showed. Three problems defined the starting point.
No system, and it showed everywhere
There was no design system of any kind. Graphic assets had been made by graphic designers with no UI or UX background, so they were borderline unusable as interface. The design language was cheap-looking and inconsistent from screen to screen. Nothing shared a foundation, because there was no foundation to share.
A visually led audience
Grades one to five covers children whose reading is still finding its feet, from just-starting to fairly confident. The interface cannot lean on labels, menus, and convention the way an adult product can. It has to communicate through illustration, motion, colour, and reward first, so a young user can find their way by sight even on a rough reading day, without getting confused or giving up.
Everything custom, and a huge surface to keep consistent
A fully illustrated product is an enormous surface area. Every screen, every control, every interactive element had to be drawn, then kept visually consistent across the whole product. Consistency at that scale, by hand, was the real constraint behind every decision.
03 WORK
Rebuilding the world, then filling it
The work started with the visual language itself and moved outward into the features built on top of it. Five areas covered most of it.
01 THE OVERHAUL
A coherent illustrated language
Before any feature could be fixed, the visual foundation had to exist. We rebuilt Playground's illustrated language from scratch: a consistent style for interfaces, buttons, and interactive elements, drawn to work as UI rather than as decoration. The goal was a world that felt handmade and alive to a child while behaving like a real system underneath, so every new screen could be built on the same footing instead of reinventing itself each time.
02 THE HOME
A hub optimized for visual navigation
The Playground home is the equivalent of the Bookshelf shelf, but reimagined as a place rather than a list. Content is organised by grade and class, set inside an illustrated landscape the animated characters live in. Navigation leans on imagery and horizontal scrolling instead of text, so a child picks a grade, a subject, and a game by recognising pictures, not by reading menus. It is the front door, and it had to feel like somewhere worth being.
03 E-GRADIVO
The library, rebuilt as a physical illustrated shelf
E-Gradivo is the part of Playground closest to Bookshelf: a scrollable library of learning materials, both regular and interactive PDFs. Here it is reskinned into the illustrated theme, with a physical cartoon shelf that moves vertically as the child scrolls. Same underlying job as the Bookshelf shelf, the direct route into the reading content, but dressed as a tangible object a young user can understand at a glance.
04 THE GAME PLAYER
A gamified player built for momentum and reward
The game player runs Playground's interactive challenges and lessons, and it is where the gamification lives. Progress, scoring, and rewards (the clover and XP system) are woven through the experience to keep a young player moving from one challenge to the next. It was a complex thing to get right under the surface, balancing real learning content against the pacing and feedback a child needs. A variant was later built for Bookshelf, so the player ended up serving both products.
05 FLIPBOOK
The reader, redesigned to match the illustrated world
Playground's Flipbook is the interactive PDF reader, given a complete redesign to align with the illustrated theme rather than sitting inside it as a plain, out-of-place tool. New navigation, new controls, all redrawn to feel like part of the same world as the rest of Playground. It is the reader the Bookshelf version never had time to become, and the one we would point to as proof of what the format could be.
04 DECISIONS
Two calls that defined how Playground felt
Most of the rebuild was steady craft. These two shaped the product's character and how far its work could reach.
CALL 01
Draw everything custom instead of leaning on cheaper, faster assets
A fully hand-illustrated product is slow and expensive to make. The safer route would have been templated or stock-style assets, reused and recoloured, to cover ground quickly. The harder route was custom illustration for every screen and control, which meant far more work and a far higher bar for consistency.
WHAT WE CHOSE
Custom, end to end. For an audience of small children, the illustrated world is not decoration, it is the interface. Cheap or generic assets would have read as exactly that, and the whole appeal of Playground rests on feeling handmade and alive. So every element got drawn, and the system existed to keep all of it coherent.
TRADE-OFF
It was a huge amount of illustration work, and it made the product slower to extend than a templated approach would have been. Worth it, because the custom world is the entire reason Playground works for the children it is built for. A generic version would have been cheaper and forgettable.
CALL 02
Build the game player to serve both products, not just Playground
The gamified player was designed for Playground first, where the gamification belongs naturally. The question was whether to keep it Playground-only, tightly fit to the illustrated world, or to build it so a variant could later run inside Bookshelf too, which meant designing for more than the world it was born in.
WHAT WE CHOSE
Build it to travel. The player was structured so its interactive content, scoring, and pacing could be carried into a Bookshelf variant rather than locked to Playground. One player ended up running the interactive lessons across both products, which is a better use of the work than rebuilding it twice.
TRADE-OFF
Designing for two homes meant the player could not lean as hard into Playground's illustrated style as a single-product version might have. Acceptable, because a shared player meant interactive content reached students in both products from one consistent foundation, instead of two divergent ones drifting apart over time.
05 OUTCOME
What shipped
Playground shipped as a fully illustrated learning world for grades one to five, rebuilt from a rough, system-less starting point into something coherent. The illustrated home, the E-Gradivo library, the gamified player, and the redesigned Flipbook all share one visual language, drawn to work as interface rather than decoration. It is a product a small child can navigate by sight, and one that finally held together as a system.
One lesson carried forward: protect the system underneath the art. The illustrated style carried so much of the product that keeping it consistent by hand, at that scale, was a constant pull. More structure early, more reusable illustrated components, would have made every later screen faster to build and easier to keep on-style as the product grew.
- 5
- grades, one worldBuilt for school grades one to five, the youngest learners in the suite.
- 1
- product, rebuilt ground upTaken from a rough, system-less state to a coherent illustrated product.
- 100%
- custom illustrated UIEvery interface, button, and interactive element drawn by hand, not templated.
