Introducing Adobe's Edge Reflow Tool

Introducing Adobe's Edge Reflow Tool

Adobe recently launched a selection of new HTML 5 site developing tools designed to make the creative process of Web development simpler and more convenient. One of these tools is the new Edge Reflow.

Currently only available to members of the Adobe Creative Cloud, Edge Reflow is a responsive design tool able to create visual designs and lay-outs in CSS. It features an intuitive smart design surface that can be resized with ease and subsequently provides an idea of how visuals/ lay-outs will adapt to varying screen sizes.

The tool allows designs to be previewed within a browser. The also new Edge Inspect tool then allows users to check the design in real time. It is then possible to transport the design CSS other code editors, including Edge Code or Dreamweaver, for example, for additional modification.

Edge Reflow's primary purpose is to simplify multi-screen design processes and make them more efficient. It can be used to create visual designs and UX prototypes that can be followed by quickly executed mock-ups.

The tool works on two regions of design - the WYSIWYG layout design canvas and the single element styling property inspector. Media query regions created by breakpoints can be tweaked easily in order to edit boxes, lay-outs and many other visual elements.

Edge Reflow essentially allows developers to create responsive prototypes of Websites. It has the additional benefit of extracting CSS from these designs within a scheduled, specific period of time. Combining layout and code editors into one dual capability tool, Edge Reflow makes a great addition to existing sets of visual design tools.

Another great feature of Edge Reflow is the fact that it permits designers to create prototypes of working responsive Websites without the need for developer input. Naturally, the capability to extract the design's CSS is also a positive point. Reasonably accurate, it can be used elsewhere and subsequently also becomes a time-saving asset.

Giving users browser-like functionality to allow canvas size modifications, layout previews and quick file uploads, as well as assisting in the resolving of potential design issues. It also helps designers to gain a better understanding and application of CSS positioning, allows animations to be added to existing HTML pages, and more.

In short, Edge Reflow is definitely worth checking out, as are the other new Adobe tools - Edge Inspect, Edge Animate and Edge Code, as well as Edge Webfonts, PhoneGap Build and Typekit.

6

We've Moved!

UK Web Hosting are now HostPresto! Same company, same great products, same amazing support - just a new name!

Go to hostpresto.com