Apps are bridging the gap for managing iterative design on responsive websites
Web design is always changing, that’s for sure! We’ve had to work hard in order to incorporate true responsive design into our process. In order to keep up with the lightning fast pace of web, we are committed to designing in the browser and moving away from life in the Adobe Creative Suite. Getting away from utilizing applications like Fireworks, Illustrator, and Photoshop for web design has been exciting! Of course, it has also been extremely challenging to transition as we are an experienced team that has enjoyably used these standard design tools for decades.
We are really excited about the experience and process with two tools we have been using on small Visual Design projects this year: Muse and Macaw. So far, Macaw has been our favorite tool and we find it very promising for our WordPress projects.
For existing sites, when a Photoshop file is still required by a designer or client, we’ve been using and amazing app called Page Layers to create a PSD file. It’s fantastic! Page Layers converts web pages directly into Photoshop files, creating separate layers for all of the elements on the page. This saves a great deal of time when re-designing or improving existing web page designs. By the time a website launches, the static visual design comp is always outdated. We end up making many UX changes and new design decisions as we move through the process, so Page Layers has been the only way to keep up with a current PSD!
To use Page Layers, just open any page in the app’s browser and then save the page as a “psd with layer” or as plain png image. Every web page element (including every image asset, link, etc.) will be saved as separate layer. Layer groups will be created according to the site’s HTML structure.