Project Overview
Toontown at Disneyland Park in California was set to reopen after renovations, prompting marketing and product partners to want a web page and a new screen in the Disneyland app to promote the refreshed space.
Problem
As the designer, how do I translate the playful look and feel of a physical space into its supporting digital products?
Solution
I used bright colors and fun shapes to reflect the organized chaos of a real-life cartoon land.
Impact
The product goals were to highlight the space's features, like shops and restaurants, to boost attendance and drive revenue.
Deliverables
13 web pages
App screens
For Context
Below are a few similar pages from Disneyland.com which show how the Toontown home page would have looked without specialized theming.
The Design Process
Research & Inspiration
Photographs and renderings helped with early design inspiration.
Wireframes
One way to convey the organized chaos of Toontown was to incorporate shapes into the layout. I experimented with uneven angles and squashed and stretched shapes that were similar to the land’s architecture.
Color Selection
There was no digital style guide for this project, so I used the Toontown logo along with the images and renderings shown above when creating a color scheme.
Accessibility
At this stage I also began testing color combinations for accessibility.
Final Color Palette for Web
Wireframes for App
The screens below live within the Disneyland app and are meant to help guests manage and maximize their visit to Toontown. These screens also needed theming for brand consistency.
Final Color Palette for App
The app required few additional colors for elements that didn’t exist on web, like buttons, button active states, etc. Those are included below.
Interactive Components
A few app components and their variants are below.
Final Designs
You can view the pages live on Disneyland’s website. The app guide is currently available within the Disneyland app.
App Screen
Mobile Web
Desktop
