中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

如果PM對原型的視覺要求比較高，那么畫線框圖的時候一定要注意各種細(xì)節(jié)，比如元件相對于頁面的位置，和其他元件是否對齊等。

接下來通過一些原型實(shí)例，給大家講解一下如何優(yōu)化線框圖的細(xì)節(jié)。以下方法對單一元件或者選中多個元件都有效。這些功能除了常用工具欄，也可以在菜單欄，和右方的檢視視圖中找到。

設(shè)置元件的位置

下圖中的“昵稱”這個文本元件，需要距離左邊框和上方banner一個合適的距離。

我們可以通過設(shè)置該元件的X值和Y值來調(diào)整效果，不過此方法比較難操作，而下面幾種方法更簡潔。

設(shè)置元件中文字的相對位置

除了設(shè)置元件的XY位置，我們也可以使用相對距離來調(diào)整元件位置。

對齊元件到網(wǎng)格

當(dāng)我們需要把元件放置在畫布中的合理位置，請?jiān)诳瞻讌^(qū)域右鍵選中“柵格和輔助線-顯示網(wǎng)格”和“柵格和輔助線-對齊網(wǎng)格”。

此時我們再去拖動元件“昵稱”的時候，你會發(fā)現(xiàn)慢慢拖動的時候，每次距離都是固定的10px，這就是下圖中最后一個頁面設(shè)置的網(wǎng)格默認(rèn)間隔。

對齊元件到其他元件

當(dāng)我們需要通過拖動的方式元件去對齊到其他元件，我們可以開啟“對齊元件”功能。請?jiān)诳瞻讌^(qū)域右鍵選中“柵格和輔助線-對齊元件”。

開啟之后，我們再去拖動元件去對齊其他元件的時候，就會有藍(lán)色的虛線提示，告訴你對齊成功。如下圖“♀21射手”成功和“昵稱”做到左對齊。

相對其他元件對齊

當(dāng)我們希望多個元件能夠看起來視覺一致的時候，可能用到對齊功能。

比如下圖，選中“♀21射手”、“互聯(lián)網(wǎng)”、“產(chǎn)品經(jīng)理”這3個元件，然后在工具欄中點(diǎn)擊頂部對齊。對齊結(jié)果以先選擇的為準(zhǔn)。

至于其他對齊的方式，方法是一樣的。

相對其他元件分布

繼續(xù)上面的案例，我們希望“21射手”、“互聯(lián)網(wǎng)”、“產(chǎn)品經(jīng)理”這3個按鈕的間距一樣。那我們依次選中并設(shè)置水平分布。

同理根據(jù)實(shí)際場景選擇垂直分布進(jìn)行使用。

先組合再對齊

如果我們希望這3個按鈕代表的整體也比較協(xié)調(diào)，那我們先把這3個按鈕組合，然后相對于矩形框左右居中，然后在取消組合即可。

建議結(jié)合上篇文章《如何使用Axure規(guī)范的畫出頁面的線框圖》一起學(xué)習(xí)，掌握起來會更快。

#專欄作家#

浪子，業(yè)務(wù)型PM，浪子PRD系列51prd.com，公眾號langzisay。

本文由 @浪子 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自 Pexels，基于 CC0 協(xié)議