Pushing Pixels to Cranking Code: Designing Responsively from Mobile to HD

Pushing Pixels to Cranking Code: Designing responsively from mobile to HD
Philip Zastrow, Web Designer, University of Notre Dame

“We get it; responsive design is important. So I deleted a bunch of slides.” Philip Zastrow of Notre Dame skipped the justification for and overview of responsive Web design and jumped right in to how to rethink the role of the Web designer in this new approach. As he puts it, “Responsive is not a feature. It’s a methodology. It changes how we plan, our design process, and the designer, too.”

For Philip, responsive is a maturing leap in the Web industry — a leap analogous to the separation of structure and style with HTML with CSS. “We’ve gone from designing pretty places where content to live to designing content.” Responsive design means that designers are presenting content in a clear, hierarchical way.

The traditional approach to Web design — the client plans their content, the graphic designer creates a site in Photoshop, and then hands it off to the developer — doesn’t really work anymore. You can’t hand off fixed width concepts to a client because they will judge everything by that.

We need to redefine the Web designer. Designers can’t spend all their time in Photoshop. Designers have to design in the browser window. Photoshop is not a layout tool anymore.The designer has to know CSS. Designers have to be aware of concepts of layout for infinite sizes. It needs to be a collaborative process between developers and designers.