Responsive design is here to stay and Adobe is well aware. Their recent tool Adobe Edge Reflow CC (still in preview) aims to aid the design process between Graphic Designers and Developers when working on responsive projects.
“Edge Reflow CC (Preview) allows you to create beautiful, responsive designs. A new assets management system and integration with Typekit will enhance your workflow and allow you to manage your projects more efficiently. Deep integration between Edge Reflow and Photoshop CC will soon provide seamless web design workflow. Stay tuned for updates.” – Adobe
I believe that it is very important to ease the communication and workflow between Graphic Designers and Front End Developers. Designers are so accustomed to using fixed media. Responsive design is a totally new beast.
The User interface is quite stunning. The Adobe dark interface creates a wonderful high contrast view that puts your artwork front row. The color coordinated media query bar is an excellent addition. It’s bright combination calls out the breakpoint settings.
When it comes to function Reflow has a leg up. Add your breakpoints for each device with the “+” icon that it located in the top right. This feature will allow you to setup the devices you are targeting. Adobe threw in CSS like never before. Reflow provides control over CSS to style your document, bridging that distant gap of designer-developer. CSS styles paired with the grid options panel should cater to foundation and bootstrap users.
The seamless transition between Photoshop and Reflow seals the deal. In fast paced agency environments Reflow will saves time and headaches on responsive projects while empowering the designer.
Once you have finished your design grab the handle located on the right of the UI to move the design into the set breakpoints. You may then move your artwork to better suit the device. Once you’ve configured the preview feature sends your design to the browser, tablet, or mobile device.
If you are overcoming the side effects of Adobe’s choice to break up with Fireworks, Reflow is something you should check out. You can read more about Reflow here: Adobe Edge Reflow CC