February 20th, 2015
Responsive web design’s combination of fluid grids and media queries has really changed the design and development process. It’s an elegant way to ensure that one set of code can display appropriately across devices. It is, however, a bit of a problem with large legacy products and waterfall strategies.
Having individual deliverables, getting signoff, and passing it down the line isn’t exactly efficient when dealing with responsive design. Working in photoshop results in the unwieldy task of providing a mockup for every breakpoint. If anything, such as a header size, needs to be changed, every comp needs to be changed, including the spacing of all the elements. This also leads to design or development issues being found much later in the process.
Stephen Hay has been designing with fluid grids since before the term “responsive web design” was coined. He’s seen that many of the problems stem from not putting a premium on the content and how it will be displayed. Too often organizations are starting with the visual design or interaction design and things start breaking once the content is introduced. When working as a solo practitioner, it is a very iterative process and a natural way to work. Though there are obstacles to introducing this way of working to a larger organization, it results in a workflow more suited for the responsive environment.