近日,Adobe發(fā)布了一款名為Edge Reflow的工具,可以用于響應(yīng)式設(shè)計(jì)的可視化創(chuàng)作,提高通過HTML5和CSS3技術(shù)在不同設(shè)備上所進(jìn)行的網(wǎng)頁開發(fā)效率。Adobe Reflow現(xiàn)已免費(fèi)開放下載,付費(fèi)Creative Cloud用戶將免費(fèi)更新Dreamweaver、Edge Animate和最新的代碼編輯器Edge Code。使用Adobe Edge Reflow做出的響應(yīng)式設(shè)計(jì)作品將會(huì)實(shí)時(shí)展示在運(yùn)行Edge Inspect tool 的實(shí)體設(shè)備上。
Reflow的主要功能是通過在設(shè)計(jì)的過程中將所有的“斷點(diǎn)”“模塊”進(jìn)行可視化的展示,讓開發(fā)者可以在工具中一邊進(jìn)行間距的調(diào)試,一邊測(cè)試展示效果。
這些功能在布局、樣式的調(diào)試效率上都有很大的改進(jìn)。
圖示:拖動(dòng)頂部顏色滑塊以設(shè)定“斷點(diǎn)”,各個(gè)設(shè)計(jì)板塊將會(huì)隨著不同寬度自動(dòng)進(jìn)行調(diào)節(jié)
開發(fā)者通過Reflow的幫助,可以更加輕松的在同一個(gè)界面中完成多項(xiàng)開發(fā)工作,調(diào)試各種尺寸的設(shè)備上所展示的網(wǎng)頁。
在布局上使用直觀的用戶界面,可以在設(shè)計(jì)的過程中針對(duì)不同的屏幕尺寸設(shè)置斷點(diǎn)。