← Back

05 · A campus turned into an explorable island

Jaazzoo Joyland

A website for Jaazzoo Joyland, a play-based early-years learning environment: designed to feel less like a school website and more like entering the world of Jaazzoo itself.

Context
Internship at Because
Focus
Hero visual · Visual direction · Motion · Interactive experience

Created together with a team member.

Jaazzoo Joyland website showing the illustrated school campus as an interactive island.
Jaazzoo Joyland: an explorable campus island
View full project

Concept

Instead of conventional navigation, we translated the physical school into a playful illustrated island, generated from the actual layout of the campus. Its spaces became locations on the map, with interactive points placed across the island.

  1. 01

    Physical layout → illustrated world

    The actual campus layout shaped the island, keeping its spaces recognisable within a playful digital world.

  2. 02

    Locations → entry points

    Interactive coordinates connect the pool, main building, playground, garden and library to their corresponding content.

Exploring the island

The island became the site's navigation. Clicking a location opens its content in an interactive panel, so information appears within the same visual world rather than taking people away from it.

Rainbow Romp location panel opened alongside the campus island.Mindscape Studio location panel within the island navigation.Splash Pool location panel opened from the campus map.

Playful design

The interface is colourful, experimental and approachable, reflecting Jaazzoo’s emphasis on play and curiosity.

Custom lion emoji language

Inspired by the lion in the Jaazzoo logo, we developed a set of custom lion emojis used across the site.

Twelve expressive lion emojis developed from the Jaazzoo identity.

Extending the world

The playful language continues beyond the map: the wider website introduces the learning environment, its values and ways to connect, using the lion characters as expressive details throughout.

The wider Jaazzoo website

Jaazzoo page introducing its early-years learning environment.Jaazzoo values section using custom lion imagery.

What I learnt

  • Designing for exploration

    A website can guide people through interaction, not only through menus.

  • Physical to digital

    The campus itself became the foundation for the visual and navigational structure.

  • Building a brand language

    One existing brand element can grow into a broader digital vocabulary.

  • Designing for personality

    Colour, motion, illustration and micro-interactions make an information-heavy site more engaging.