Plum Landing aims to teach kids about ecosystems through videos, games and hands-on activities. I was part of the team that created the Plum Landing brand and designed the digital experiences—this was during my time as a design manager at WGBH Digital. My role on the project was to oversee the web and game designers, create the visual branding system, design the website and initiate the game design and prototyping process. We worked with Global Mechanic who created the characters and animation—much of the inspiration for the digital brand came from their initial character design and illustration work.

Logo Design

I think logos do not have to tell you exactly what a brand is about. That's an unreasonable expectation for a symbol and some typography. They do need to be simple, memorable marks that can act as the personality of a brand. Most importantly, they need to be versatile and work with all the complex variations in a brand system. Logos are usually viewed in a more cluttered context: a website, a game, a billboard whizzing past you—they’re almost always surrounded by other content competing for your attention.

I pushed for a simple solution for Plum Landing logo, and I lost that battle. The executive producers wanted the logo to convey all the important things that the project was about, and they wanted it to include the main character. So I ended up with an earth and the main character, Plum, on top. And there’s an arrow going around the earth to represent the kids travelling to different places around the world. Yes, it’s very literal and pretty complex for a logo, but I think it turned out well and has held up nicely in various applications.

I created custom lettering for the logo. Most of the shapes and buttons in the brand are blobby and bubbly—this comes from the blobby, morphing, bean-shaped body of Plum, the alien main character. So the lettering was inspired by her design.

Here are some early iterations of letter and shape options:

Site Design

The website needed to address a bunch of goals. Mainly, we made sure there was an easy path to playing games and watching videos, which is what most kids are coming to do. The site also needed to introduce a new brand and cast of characters in an engaging way. The characters have profiles with Instagram-like galleries, and the spaceship is used as an index. We built a gallery for displaying user generated content: photos and drawings based on environmental-themed challenges, and a user profile area for collecting points and earning stickers and badges.

Once the basic structure and flow of the site was worked out, I created a system of styles and components to use across the site templates. The components needed to be flexible and reusable to be used across the site and extended within the design of games and apps.

Game Design Direction

The games are where kids learn and have the most fun, and that’s where our team devoted a lot of resources and creative energy. As lead designer on the project my responsibility was to ensure we were making fun games with innovative game mechanics and that our designers were producing quality work.

Early on, I helped the team envision what the overall structure and experience of the game could be by creating UX flow diagrams:

From years of making kids games, I’ve learned that the best solutions come out of prototyping multiple game mechanics at once and testing them out with kids—then iteration. Much of my involvement on this project came early on in the game design discovery phase. I would sketch out game layouts and game mechanics. Some of my sketches were done as inspiration for what a game could look like, focusing on the perspective and scale:

The most useful sketches were ones done to explain detailed game mechanics and user interactions across screens:

I created low fidelity mockups for prototypes. The key was to focus on the design of the core mechanic and not worry about the rest of the game. My preference was to test and iterate on the core game mechanic first and let the rest of the areas of the game fall into place later.

I wireframed out unique app experiences like this one involving the integration of user photos into a scene with fictitious animals.

I created quick animations as a proof of concept to show how the experience could play out:

Additional Plum Landing site design by Tara Taylor and Frank LeClair.