These components can be shared within a Library, or as Linked Smart Objects that are pulled into a master PSD. For example, if you’re creating a pattern or component guide in Photoshop, one designer can be working on a component while another designer simultaneously works on a different one. With the addition of Creative Cloud Libraries and Linked Smart Objects, designers can share assets quite easily. If you can swing it, try using artboards, layer comps, or smart objects instead of managing tons of PSDs.

This helps eliminate confusion about which PSD is the right PSD. If you’re making multiple comps for multiple pages, Photoshop now has artboards that can help you stick to a single document. If you dig a little deeper, you’ll find a glut of responsive resources attached to various guidelines, and a few tips for designing for multiple devices. Those familiar with the site will see a lot of familiar guidelines, such as quintessential tips like ‘Name Your Layers’ and ‘Name Files Accurately’, each an attempt at ridding the earth of practices like ‘Layer copy copy 5’ and ‘client-final-v3.psd’, respectively. The guide is broken down into the following sections: Though engineered for Photoshop, many of these principles apply to Sketch and similar, layer-based design tools. For those new to the concept, Photoshop Etiquette is a best practices guide that promotes efficiency through clarity in web design. Photoshop Etiquette was given a fresh coat of paint by Adjacent, a design studio in Syracuse, NY. At worst, it’s not being able to find the file you need in the first place. It’s having to fix images that have already been exported. Inefficiency is inheriting a file from a coworker and spending valuable time attempting to figure out where to start because it’s not clearly labeled. If we want to save time, we need to invest a bit upfront in staying organized and clear. The fact remains: anything worth doing is worth doing well. With Photoshop taking on different roles in our workflows, layers and exported files are easy targets for cutting corners. Often masked as efficiency, poor organization and communication are products of rushing to ship a project. With seemingly more to do in order to publish a website, being efficient is unquestionably high priority, if we want to be profitable. Responsive design typically comes with a lot of moving pieces, from images, concatenated CSS files, and more. For the sake of this article, we’ll define etiquette as transferring files in an organized, clear, and discernible way. With alternatives to the heavy Photoshopping we may be familiar with, it’s fair to question if we still need etiquette. Others have adopted apps like Keynote for prototyping.Ī flurry of new tools and techniques has seemingly put good ol' fashioned etiquette on the back burner. Many designers have moved on from Photoshop as their workhorse to Sketch, Affinity Designer, or similar.

Applications like Webflow and Macaw have made breakpoint visualization digestible for the code-averse. There’s also been an explosion of tools attempting to make a responsive workflow more efficient. With a shift from page-based design to building a design system, it’s truly an exciting time. Style Tiles, Style Prototypes, Visual Inventories, Element Collages, style guides, and even designing in the browser have all been suitable approaches to multi-device design. The traditional comp-to-HTML workflow was only beginning to be critiqued, and since then, we’ve seen a myriad of alternatives. In 2011, everyone was just getting their feet wet with responsive web design.

A lot can happen on the web in a few years, and these past five have illustrated that better than most. It’s been almost five years since Photoshop Etiquette launched, which officially makes it a relic on the web.

Webdesign in photoshop