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

文本是我們畫原型的時(shí)候肯定會(huì)用到的元件，我們PM必須學(xué)會(huì)根據(jù)使用場(chǎng)景來(lái)合理的設(shè)置文本樣式。

如果你不懂得如何設(shè)置也不會(huì)影響工作，但是會(huì)導(dǎo)致你的原型看起來(lái)很丑不美觀和會(huì)浪費(fèi)很多時(shí)間。對(duì)于有追求的PM來(lái)說(shuō)，原型的美觀也是衡量自己能力的體現(xiàn)。

建議對(duì)照之前的文章《Axure原型如何根據(jù)使用場(chǎng)景來(lái)設(shè)置頁(yè)面樣式》一起學(xué)習(xí)下我用Axure設(shè)計(jì)APP原型的經(jīng)驗(yàn)技巧，以我畫的微信APP原型來(lái)作為演示案例，方便大家快速了解。

本文主要講解文本的樣式，但是在Axure中文本的本質(zhì)就是沒(méi)有邊框的矩形，所以也會(huì)涉及到矩形樣式的使用場(chǎng)景。

位置

一般來(lái)說(shuō)調(diào)整文本位置的時(shí)候，是通過(guò)拖動(dòng)的方式然后憑感覺放到某個(gè)地方。

但是如果你想把文本放在固定的位置上，那么請(qǐng)直接設(shè)置“X軸坐標(biāo)，Y軸坐標(biāo)”。比如像APP每個(gè)頁(yè)面的框架，上導(dǎo)航的位置，上導(dǎo)航2個(gè)按鈕的文字位置這些都是固定位置。建議直接輸入XY坐標(biāo)。

尺寸

文本的尺寸，一般無(wú)需設(shè)置。默認(rèn)情況下是自適應(yīng)的效果。

但是矩形有時(shí)候是需要設(shè)置尺寸的，包括高度和寬度。

比如微信APP的消息卡片，如果我們按照通欄的方式來(lái)設(shè)計(jì)，那么寬度應(yīng)該是375px。高度可以根據(jù)感覺來(lái)，但是更建議自己調(diào)整一下。我們PM需要考慮第一屏需要展示多少個(gè)消息卡片，其實(shí)需要倒推出來(lái)高度px，并且標(biāo)識(shí)好并告知視覺設(shè)計(jì)師。當(dāng)然這個(gè)工作由資深的UI去做也可以。

填充

給文本所在的整個(gè)矩形填充顏色，類似于PS的填充背景色。很少需要對(duì)文本填充，一般是對(duì)矩形使用。比如點(diǎn)擊消息卡片的時(shí)候會(huì)有填充色。

陰影

一般不會(huì)對(duì)文本采用陰影，而是對(duì)矩形使用陰影。另外移動(dòng)端APP用陰影效果的并不多，Web產(chǎn)品還是經(jīng)常需要用到的。

陰影還分外部陰影和內(nèi)部陰影，一般會(huì)用前者來(lái)表示交互效果。

邊框

邊框有多種屬性。分別來(lái)講。

線寬，是指邊框的寬度px，默認(rèn)是1px。

線段顏色，是指邊框的顏色。

線段類型，是指采用實(shí)線虛線，小虛線，大虛線等等。

邊框可見性，是指矩形的4個(gè)邊框是否都顯示，默認(rèn)都顯示。如果你去掉矩形的4個(gè)邊框，等于文本元件。你可以根據(jù)需求去顯示部分的，比如微信APP-我-表情頁(yè)面的上導(dǎo)航，就可以利用這個(gè)功能去實(shí)現(xiàn)原型。

圓角半徑

是指把矩形的四個(gè)直角變成圓角，比如我的頭像，往往會(huì)改成圓形。直接把圓角半徑的值設(shè)為很大。

如果設(shè)為很小，比如5px，則和微信中一樣。邊緣是圓角，其他地方還是看得出來(lái)是矩形。

不透明

代表的是矩形的不透明度。請(qǐng)區(qū)別于填充色的不透明度。比如微信的掃碼頁(yè)面， 底部工具欄就是有一定透明度的。

字體

建議在畫APP原型之前就把頁(yè)面樣式中的字體設(shè)置好，以后每個(gè)頁(yè)面中的字體默認(rèn)都是該字體。如有特殊需求，單獨(dú)修改即可。

需要注意的是，如果你覺得Axure中文字沒(méi)有換行，在瀏覽器中查看換行了。請(qǐng)更換成Arial字體，或者把文本的寬度設(shè)置長(zhǎng)一些即可。該方法大部分時(shí)候可以解決此問(wèn)題，不是100%。另外該問(wèn)題應(yīng)該屬于Axure的bug，一直沒(méi)有修復(fù)掉。

行間距

一般情況下無(wú)需修改，使用默認(rèn)的即可。如果修改過(guò)想恢復(fù)成默認(rèn)也很簡(jiǎn)單，直接輸入2短行就行了。

項(xiàng)目符號(hào)

點(diǎn)擊文本或者矩形就會(huì)給每段文字前面加上項(xiàng)目符號(hào)標(biāo)志，再點(diǎn)擊一次即可取消。

畫原型的時(shí)候很少用到，如果是寫活動(dòng)描述或者寫邏輯的時(shí)候倒是經(jīng)常用到。

對(duì)齊方式

文本的對(duì)齊方式，是指文本相對(duì)于矩形框的對(duì)齊方式。每個(gè)文本其實(shí)是寫在一個(gè)矩形框中的。

請(qǐng)注意不要和多元件的對(duì)齊搞混，后者是指選中多個(gè)元件然后讓他們對(duì)齊。你可以用前者是矩形內(nèi)部，后者是矩形外部來(lái)進(jìn)行區(qū)分理解?？梢詫?duì)照舊文《Axure如何調(diào)整線框圖的對(duì)齊細(xì)節(jié)》進(jìn)行分別學(xué)習(xí)。

左對(duì)齊

比如消息列表內(nèi)容列表中的同一字段，需要使用文本對(duì)齊方式。像微信APP的消息列表中的昵稱字段，就應(yīng)該統(tǒng)一使用左對(duì)齊。當(dāng)昵稱有不同長(zhǎng)度的值，居中對(duì)齊和右對(duì)齊都會(huì)很丑。

居中對(duì)齊

而像上導(dǎo)航中的文本，應(yīng)該采用居中對(duì)齊。符合我們對(duì)于ios人機(jī)交互規(guī)范的理解，當(dāng)然Android可能左對(duì)齊。

右對(duì)齊

像微信APP的消息列表中的消息時(shí)間文本，就應(yīng)該使用右對(duì)齊來(lái)進(jìn)行展示，此時(shí)左對(duì)齊和居中對(duì)齊不合適。

填充

這里的填充是指矩形中文本離矩形邊框的上下左右矩形，類似于css中的margin概念。請(qǐng)區(qū)分上面所講的背景填充色。

用一個(gè)實(shí)例來(lái)給大家演示一下效果，然后就可以在實(shí)際情況中則需使用。

總結(jié)

不少作家也分享了他們對(duì)于樣式的理解，我寫這篇文章是希望大家從使用場(chǎng)景的角度去理解為什么要設(shè)置這個(gè)樣式，以及如何設(shè)置。而不是單純的講解Axure功能，這個(gè)沒(méi)有實(shí)際意義。原型設(shè)計(jì)才是目的，Axure只是工具。

相關(guān)閱讀

Axure原型如何根據(jù)使用場(chǎng)景來(lái)設(shè)置頁(yè)面樣式

Axure如何調(diào)整線框圖的對(duì)齊細(xì)節(jié)

#專欄作家#

浪子，業(yè)務(wù)型PM，浪子PRD系列51prd.com，公眾號(hào)langzisay，個(gè)人微信nuanai88。

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

題圖來(lái)源于網(wǎng)絡(luò)