|
Edge Reflow application is used by web designers to create a native web surface with CSS design and layout features in a familiar and intuitive way. Edge Reflow helps designers to create resizable layouts that simulate the look and feel of both desktop and mobile devices; control media query breakpoints in design for custom device sizes, add typography to their projects using the integrated Edge Web Fonts, and preview their work on desktops as well as mobile devices using the integrated Edge Inspect plug-in. You can extract CSS code and hand off to developers with confidence that your design vision will remain uncompromised throughout development.
Edge Reflow does not supply with HTML export features, but you can preview HTML designs in web browsers and experience the responsive behaviors in end-user environments. Now let us get to know the new features of Edge Reflow.
Flexible design approach and media-query breakpoints
To change the sizes of design canvas there is resizable canvas handle available that can be moved in horizontal direction.
With each resize, you can begin to see sizes where your design will break down. Once you hit a size where the design breaks, move the canvas back to the last known good size and add a breakpoint. To do this, click on plus icon that adds a new media query marker to the ruler above the design surface.
Any change you make will be specific to this new media query. As you change your design at this size, specific CSS styles for this region will be highlighted in the properties inspector as a matching color to the current region’s color.
You can read full version of this overview on Designmodo.com
| 
