In this series, we will take a look at the responsive design workflow — tools and processes designers use for creation of the modern digital experiences.
Over the past decade, Photoshop has played a major role in the web design process, and it’s the tool of choice for almost every web designer now. What an irony it is, when photo editing software becomes an industry standard for designing a digital experience – something so different and so much more complex than photos. This seems even more strange, when you realize that there have always been tools better suited to web design.
It worked well. Until responsive design.
Nevertheless, Photoshop had something mysterious that made everyone forget about its original purpose. Designers very quickly developed great processes for using Photoshop as a web design tool and it worked really well. Until responsive design.
Responsive design in Photoshop is a painful process.
Responsive design helped us realize that the web has no edges, no fixed canvas, and that we don’t have as much control over what our users see as we used to think. We learned that the web is fluid and so our design process should be too, but the workflow in Photoshop assumes the exact opposite of all these things. Responsive design in Photoshop is a painful process — usually, you have to maintain many different presentations of the same content in several separate documents. This is just asking for errors and inconsistencies.
While it still makes sense to include Photoshop in some stages of your web design process, like editing photos or creating more complex visuals, there are great tools around with features better suited for designing a modern digital experience. Next time we will take a look at some options, and I will also describe the responsive design workflow we use at XHTMLized and X-Team to make our lives easier.