Axure小白的福利又來(lái)了，本教程主要講述查看原型的一系列基礎(chǔ)操作以及相關(guān)設(shè)置。

希望大家邊學(xué)邊操作，學(xué)習(xí)效果更佳哦。

Axure RP 8 教程 – 查看原型

1.快速預(yù)覽查看原型

快速原型的快捷鍵為“F5”?；蛘?，單擊快捷鍵功能中的預(yù)覽圖標(biāo)進(jìn)行預(yù)覽。導(dǎo)航菜單“發(fā)布”-“預(yù) 覽選項(xiàng)”中進(jìn)行預(yù)覽設(shè)置。

2.生成HTML查看原型。

生成原型的快捷鍵為“F8”?；蛘?，單擊快捷鍵功能中生成圖標(biāo)。還可以通過(guò)導(dǎo)航菜單“發(fā)布”-“生成原型文件”中進(jìn)行生成。

3.生成部分原型界面

發(fā)布原型時(shí)，如果不需要將所有頁(yè)面生成或者發(fā)布，可以在生成HTML的設(shè)置中打開(kāi)“頁(yè)面”的設(shè)置，取消“生成所有頁(yè)面”的勾選，則可以設(shè)置生成指定的頁(yè)面。注意，子級(jí)頁(yè)面無(wú)法單獨(dú)發(fā)布，勾選子級(jí)頁(yè)面時(shí)會(huì)自動(dòng)勾選父級(jí)頁(yè)面。如果需要單獨(dú)發(fā)布子級(jí)頁(yè)面，需要在頁(yè)面管理面板將子級(jí)頁(yè)面的級(jí)別調(diào)整到一級(jí)頁(yè)面。

4.為原型添加標(biāo)志

在生成HTML的設(shè)置中有“標(biāo)志”的設(shè)置，可以為原型添加圖片標(biāo)識(shí)或者文字標(biāo)題。原型發(fā)布后會(huì)顯示在工具欄的頁(yè)面面板中。

5.發(fā)布原型到AxShare

發(fā)布原型到AxShare是將做好的原型發(fā)布到Axure官方提供的空間中，通過(guò)自動(dòng)生成的網(wǎng)址進(jìn)行訪問(wèn)。發(fā)布到AxShare的快捷鍵為“F6”。發(fā)布到AxShare需要注冊(cè)相關(guān)賬號(hào)，網(wǎng)址為：http：//share.axure.com/

6.移動(dòng)設(shè)備設(shè)置

制作移動(dòng)設(shè)備原型需要遵循規(guī)范將原型制作成標(biāo)準(zhǔn)尺寸。移動(dòng)設(shè)備原型尺寸計(jì)算工具：http：//www.iaxure.com/share/yxcc/ ? ?（個(gè)別移動(dòng)設(shè)備可能會(huì)有出入）。

除了制作標(biāo)準(zhǔn)原型尺寸，還需要在生成的HTML文件配置中，進(jìn)行“移動(dòng)設(shè)備”的設(shè)置，讓生成的HTMl文件“包含視圖接口標(biāo)記”才可以正常顯示。

7.web字體設(shè)置

當(dāng)原型使用一些特殊字體時(shí)，在沒(méi)有安裝該字體的設(shè)備上將無(wú)法正常顯示。web字體可以較好的解決這個(gè)問(wèn)題。

方法一

需要網(wǎng)絡(luò)以及在線CSS文件支持，以FontAwesome字體為例。在web字體設(shè)置中，單擊“+”添加新的配置，勾選“鏈接到CSS文件”，將該字體官方網(wǎng)站提供的“.CSS”文件地址填入到超鏈接中即可。這樣只要瀏覽原型時(shí)有網(wǎng)絡(luò)支持，即可正常顯示字體。

方法二

支持在線字體和本地字體，以FontAwesome字體為例，圖中的src是在線字體代碼。

如果是本地字體代碼應(yīng)該為： ? ?font-family：FontAwesome

src：url（’fontawesome-webfont.ttf’）format(‘true-type’)

注：使用本地字體需要將字體文件“.ttf”復(fù)制到生成的HTML文件中。

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