The Children’s Museum of Pittsburgh provides innovative museum experiences for children of all ages. They’ve been recognized repeatedly for their commitment to children and design excellence. The Museum itself is nationally respected, recently named by Parents Magazine as one of the top ten children’s museums in the United States.

The website they’ve maintained for the last seven years, however, did not meet their otherwise rigorous standards. The information was disorganized, duplicated, and difficult to manage. Their dated content management system prevented them from fixing many nagging problems, and the site’s Flash-based navigation made it unusable on popular mobile devices.

Bearded was asked to redesign and develop their website, completely re-imagining the site experience. What resulted is a site that fits with their already successful and well-known brand, and is focused on their most essential goal: helping interested users visit the museum.

Knowing how important a mobile experience is to young parents, Bearded implemented a flexible, responsive website layout. The new Children's Museum website adapts to your desktop, laptop, tablet or smart phone, stretching and reconfiguring itself to provide an optimal viewing experience on any device it’s accessed on.

The benefits aren’t just limited to mobile devices, either. You can see the effect of a responsive layout by simply resizing your browser window on your desktop computer. This means that users who just like to keep their browser windows smaller will enjoy an optimized layout as well.

The Children’s Museum website’s events calendar is a great example of responsive web design in action. In wider browser windows users will see a familiar calendar layout. But for phone-sized displays, where space is at a premium, we took a different approach. If we simply shrunk the calendar layout down, the text would be too small to read and the links wouldn’t be big enough to tap with a finger. Not only that, but we’d be monopolizing precious screen space with days that didn’t even have events scheduled. On the new Children’s Museum website, mobile users will see a vertically-formatted event list, with any event-less days hidden from view.

A major benefit to the responsive website approach is that we don’t need to build and maintain a separate mobile website to achieve these kinds of customized experiences. Because the Children's Museum website knows how big your browser is, it can serve you a layout that’s tailored to your specific viewing environment, whatever that might be.

The Children’s Museum of Pittsburgh website was chosen as a winner in the 15th Annual HOW Interactive Design Awards.