The design thinking behind the new

The new

In the last year or so I haven’t mentioned my job very frequently, mostly because I’d been working on something that I wasn’t at liberty to share… that is until today. Yesterday, the small 30 person team I’m a part of at Disney relaunched with a new look and feel, bringing the site firmly into 2012. Since January we’ve been hard at work trying to create our vision of what Disney is on the web, challenging a lot of the status quo and creating something exceptional.

I’d like to mention that the Matterhorn team, our previous codename, is the finest team I’ve ever worked with. I’ve never met more talented, driven individuals, and that without our tight bond this project could never have happened. I should also mention that these views are my own and not those of Disney, you know how that goes. Please read and get a glimpse behind the curtain of how we made it happen.

The Challenge
Our biggest challenge was creating a new way for our Guests (a term we use at Disney to describe our users) to interact with our wide array of content on a day-to-day basis. The Disney company is filled to the brim with content, be it games or video, so that needed to be accessed easily. Plus we needed to be sure that it was easy to find information about the Parks or buy products from the Disney Store. Whereas a lot of companies dabble in one specific field, we needed a site that was flexible enough to showcase probably the widest range of offerings you could imagine. We needed a site that could do everything.

From a design standpoint we wanted to eschew the overly ornamental site design and focus on a few key things: highlighting content, embracing mobile devices, and bringing a breath of fresh air to the online division of Disney.

Disney Site - Responsive Design

Responsibly Responsive / Embracing Mobile
There’s been a lot of “buzz” around the fact that the new site was built responsively, even from our own internal marketing team. For those unfamiliar, responsive design “is an approach to web design in which a designer intends to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones).”

Our team first dabbled in responsive design when we launched a beta version of Disney Video in April, the first entirely responsive video site on the web. This is because of the growing importance of mobile devices as means of content consumption. The adoption numbers for mobile devices grow exponentially, so why wouldn’t we be where the ball is heading? There’s that, and the fact that we’re pulling from a single code base. We change the code once and it changes for the desktop, tablet and mobile sizes.

Honestly, our team is kind of bored of talking about responsive design. It should no longer be considered a special feature, it’s how any self-respecting website should behave in 2012.

UP - Movie Page

Functional vs. Fun
When we began to plan the design of the site we came up with a frame of reference that helped to guide the project. It’s been said that the most important part of Disneyland isn’t actually the rides, but the paths that lead you to each. Without a series of paths that are clean and easy to navigate you’re likely to get lost or frustrated. We took this same approach for the UI of the site.

The site’s UI elements are stripped free of ornament and embellishments, putting the focus squarely on the content. We’re proponents of letting the videos or games be the star of the site. If you compare the old to the new you’ll definitely see a marked difference. In our minds the old site had a heavy layer of unneeded ornamentation that distracted the guests from the content and muddled the exploration of the site.

As for the site not being as fun, which I’ve seen commented here and there, I personally don’t believe that a UI needs to be fun. My favorite example of this is an iPad. Put an iPad into the hands of a child and they’re going to brighten up with excitement. Is this because of it’s design? No, the iPad itself is an aluminum and glass shell with a big button on the front. It’s because it contains all of their favorite games and videos. The UI is invisible, the content is the goal.

Type Considered
On the site we’re using a custom built font called Matterhorn, which was developed by Michael Cina & Associates. It’s a stunning font that comes in a sans serif and a slab serif, each having a regular, semibold and bold weight. We needed something that would be easy for children to read so we went with something more geometric like Avenir, as well as having a bit of character that was both fun and serious at the same time (Yes, we actually said that).

Disney Games

The Evolving Face of Disney Online
The most important thing I can speak to is that everything we’ve done is only the beginning. The site is a living, evolving beast that will change as we do, which personally what’s so exciting to me. There’s still design to be polished, there’s editorial to be refined and there’s technology to be evolved. We still haven’t touched all parts of the site, but we will soon. Here’s a handy list of pages to visit to get a sense of what we’ve done.
Disney Movies
Disney Video
Disney Music
Disney Games
UP – Movie Page

Unfortunately the site isn’t viewable for those outside of the U.S. which is a huge bummer. We’re busy working with the other divisions of Disney to try to get this rolled out to everyone, but that’s a pretty big project.

Disney Video

Disney Movies