We’re always looking for opportunities to try out something new. Since our case studies needed updating, we decided to take the opportunity to update our site with a responsive/adaptive design.
Initially, we started out building it to scale down for tablet and mobile devices. However, about half way through, we decided to shift gears and start with mobile first. Taking on mobile first gave us a different perspective on the design.
- It really challenged us to think of this more in terms of information design
- It encouraged us to think of DOM structure first, leaving the old model of designing with boxes and arrows behind
- It helped us write less code than going from desktop down to mobile
It was a really interesting and fun challenge and the results are in the following video.
PS. In the process of building our site, I wrote a responsive grid system that handles one column, two column, three column, four column and five column layouts with just 13 lines of CSS. It’s entirely flexible and can be set to fully fluid or fixed fluid and centered. It’s entirely based on ems and % for measurement. And yes, we’ll be releasing it publicly as a responsive HTML5/CSS3 framework pretty soon.
If the video doesn’t show up for you, you can watch it on Vimeo.
