Tuesday, January 03, 2017

Cat in the Hat Website Refresh

We recently had the pleasure of working with Penguin Random House and PBS Kids to revamp the PBS Kids Cat in the Hat Knows A Lot About That website. The primary goal of the revamp was to create a responsive site in HTML5 that worked well on desktops and mobiles, all while capturing the charm of the Cat in the Hat universe.

The previous website was a tough act to follow. It did an excellent job of highlighting the characters from the show while displaying the site content in exciting ways. However, as screen sizes have grown (and shrunk in the case of mobiles) it was in need of an update both technically and in terms of modern web design.

For the landing page, we decided to retain a similar layout to the previous site, but remove the borders allowing the content to fill the page. This layout shifts as the screen grows or shrinks in size ensuring that it always looks good.

On mobile devices the landing site transforms into a vertical format that is easy to navigate via touch by visitors of all ages.

For the games and printables page, we designed the page around a Seussian machine that pumps out the site content in a joyful manner. The conveyor belt of content shifts via buttons or touch scrolling allowing visitors to access content in an easy, playful manner.

Even the video page got an update with a unified but flexible layout for mobiles and desktops.

It's always intimidating working on the website for a beloved property. There are so many goals that you're trying to accomplish all at once, technically and artistically, all while trying to retain to spirit of what makes the property so loved. It can feel like a juggling act. We loved working on this project and we hope that we managed to capture and share some of the magic that makes Cat in the Hat such an enduring character. If you want to see the site yourself, you can check it out here.