整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
PM完成Axure原型評(píng)審后，一定不能忘記備份這些原型html，后續(xù)可能需要查詢以及技術(shù)撕逼。
希望通過(guò)Axure原型的幾種使用場(chǎng)景，讓初級(jí)PM對(duì)它的來(lái)龍去脈有個(gè)清晰的了解。而不是停留在“我知道”“大概會(huì)用”的水平。
PM會(huì)經(jīng)常修改AxureRP源文件，然后生成不同的原型。
但是對(duì)外評(píng)審的原型應(yīng)該是唯一的。
并且該版本的產(chǎn)品需求文檔PRD就是這個(gè)原型。
請(qǐng)注意兩者不能混為一談。
一般來(lái)說(shuō)我們是在Axure生成原型Html的時(shí)候，自動(dòng)在瀏覽器中打開了原型并查看。
但是如何打開已備份在電腦中的原型呢，很多初級(jí)PM摸不著頭腦了。其實(shí)也不復(fù)雜，如果你學(xué)會(huì)一點(diǎn)html網(wǎng)頁(yè)的知識(shí)。
請(qǐng)進(jìn)入該原型對(duì)應(yīng)的目錄，比如APP名稱V2.0版，我們會(huì)發(fā)現(xiàn)存在data、file、images、plugins、resources等文件夾，以及很多html網(wǎng)頁(yè)。請(qǐng)找到start.html，然后雙擊打開就是你熟悉的原型啦。
當(dāng)原型評(píng)審后，PM需要將原型放到網(wǎng)上供所有團(tuán)隊(duì)成員進(jìn)行設(shè)計(jì)和編程。
不管是放到內(nèi)網(wǎng)展示，還是外網(wǎng)展示。其本質(zhì)都是將Axure原型的所有文件都上傳到服務(wù)器，包括所有的html文件，圖片文件，js文件，css文件。不能缺少任何文件，否則就無(wú)法正常顯示。
如果你只是修改了某個(gè)頁(yè)面，也切記生成并將所有文件上傳一遍，而不僅僅是該頁(yè)面對(duì)應(yīng)的html文件。因?yàn)槠鋵?duì)應(yīng)的js，css文件，圖片文件也可能被修改
上傳之后然后把對(duì)應(yīng)的原型網(wǎng)址發(fā)給其他團(tuán)隊(duì)成員即可查看。
由于Axure原型是由html+js+cs組成的文件，我們?cè)谏傻臅r(shí)候?qū)⑺麄兎胖迷谥付夸洝?/p>
嘉定我們將該產(chǎn)品的所有原型存放于D://PM/APP名稱，那么建議以“APP名稱V1.0版”的格式命名，并生成原型。
當(dāng)然你也可以繼續(xù)壓縮之后存起來(lái)，不過(guò)就不太方便后續(xù)的查詢。
有時(shí)候我們需要回退版本的時(shí)候，需要把舊版本的原型也拿出來(lái)。那么請(qǐng)用舊版本的原型html去替換當(dāng)下的原型目錄。
不過(guò)不太建議這樣，還不如新增一個(gè)版本來(lái)處理。
由于Axure生成的原型，是以Html文件進(jìn)行索引內(nèi)容的。而Html是以你在Axure中新建的頁(yè)面來(lái)作為基礎(chǔ)的。如果你畫Axure原型的時(shí)候是以你產(chǎn)品中的頁(yè)面來(lái)進(jìn)行命名和創(chuàng)建的。那么我們可以通過(guò)搜索“頁(yè)面名稱”關(guān)鍵詞去查詢你想要查詢的頁(yè)面。
如果你使用的搜索工具支持搜索文件內(nèi)內(nèi)容，比如Windows下面的everthing，Mac自帶的spotlight。那么可以通過(guò)搜索“頁(yè)面內(nèi)文字”關(guān)鍵詞去查詢你想要查詢的相關(guān)頁(yè)面。
不過(guò)我更建議你進(jìn)入到具體版本的原型html文件夾里面進(jìn)行搜索，而不是進(jìn)行全局搜索。
以上就是Axure原型的使用場(chǎng)景。請(qǐng)一定要理解Axure原型的本質(zhì)是html+js+css，每次生成原型的時(shí)候會(huì)在本地生成目錄并寫入這些文件。
浪子，業(yè)務(wù)型PM，浪子PRD系列51prd.com，公眾號(hào)langzisay，個(gè)人微信nuanai88。
本文由 @浪子 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。
題圖來(lái)自 unsplash，基于 CC0 協(xié)議
輯導(dǎo)讀：對(duì)于 Axure原型工具，很少有產(chǎn)品經(jīng)過(guò)系統(tǒng)學(xué)習(xí)，一般都是直接上手，邊摸索邊學(xué)習(xí)，這直接導(dǎo)致很多快捷操作被忽視。筆者在日常工作中總結(jié)出以下小技巧，希望對(duì)各位有幫助。
之前整理了2期Axure的使用技巧，大約有36個(gè)技巧，具體可查看下邊的文章：
產(chǎn)品必會(huì)的Axure使用技巧（第一彈）
產(chǎn)品必會(huì)的Axure使用技巧（第二彈）
最近在使用Axure時(shí)又整理了幾個(gè)我覺(jué)得比較實(shí)用的技巧，今天把第三彈分享給各位。
我使用的Axure8示例，不過(guò)在Axure9中同樣可用。
格式刷可以用來(lái)復(fù)制樣式
先選擇需要復(fù)制樣式的控件，然后在點(diǎn)擊鋼筆旁邊的“更多”，點(diǎn)擊選擇格式刷
然后選擇需要復(fù)制樣式的目標(biāo)控件，點(diǎn)擊“應(yīng)用”，就可以將樣式復(fù)制過(guò)來(lái)。
不過(guò)在Axure9中，可以直接右鍵復(fù)制樣式
Axure中自帶了流程圖元件，很多產(chǎn)品經(jīng)理喜歡直接在Axure中畫流程圖，但是在畫泳道圖時(shí)，Axure沒(méi)有提供泳道圖的樣式。
不過(guò)我們也可以畫出泳道圖樣式，就是使用“表格”，調(diào)整一下表格數(shù)量就可以了。
在之前的第一彈中說(shuō)過(guò)這個(gè)，不過(guò)這次還是想再說(shuō)一遍。
在做列表需求時(shí)，經(jīng)常需要畫列表，不過(guò)Axure的表格我用不慣，所以每次都直接在Excel里把列表字段寫出來(lái)。
然后直接在復(fù)制到Axure里，就可直接把Excel表格復(fù)制過(guò)來(lái)。
不過(guò)復(fù)制過(guò)來(lái)會(huì)有幾個(gè)問(wèn)題：
1、樣式不能復(fù)制。只有復(fù)制表格后，在手動(dòng)調(diào)整樣式。
2、合并單元格不能復(fù)制，主要是Axure不支持合并單元格。
選中需要修改的表格，然后直接修改寬度與高度，即可批量修改選中表格的尺寸。
如果想修改個(gè)別表格，按照ctrl鍵，再選中即可。接著修改寬度與高度，就可直接修改選中表格的尺寸了。
最近領(lǐng)導(dǎo)要求給原型頁(yè)面上加上編號(hào)，然后發(fā)現(xiàn)一個(gè)很快速的方法。
先選中一個(gè)頁(yè)面重命名，然后在重命名狀態(tài)下，使用鍵盤上下鍵，進(jìn)到下個(gè)頁(yè)面時(shí)還是重命名狀態(tài)，就可以直接重命名了。
在生成html文件后，點(diǎn)擊生成html文件夾內(nèi)的start.html或者index.html查看時(shí)，會(huì)出現(xiàn)安裝插件的提示。
直接安裝插件這個(gè)方法就不說(shuō)了，不過(guò)有2個(gè)快速的解決方法：
1.直接點(diǎn)擊要查看的單個(gè)頁(yè)面。不直接點(diǎn)擊start.html、index.html等入口。
2.修改源代碼，繞過(guò)提示。
打開start.html或index.html的代碼
刪除下方標(biāo)的代碼，然后保存，重新點(diǎn)擊點(diǎn)擊入口打開，就ok了。
最近安排手下的實(shí)習(xí)生去畫原型，最后需要合并在其它源文件中。
他是直接復(fù)制粘貼過(guò)去的，頁(yè)面少這樣沒(méi)啥問(wèn)題，要是頁(yè)面多了，一個(gè)個(gè)復(fù)制粘貼也挺費(fèi)勁的。
我們可以直接使用“文件”下的“從RP文件導(dǎo)入”
選擇需要導(dǎo)入的RP源文件后，然后在勾選需要導(dǎo)入的頁(yè)面，一直Next就行了。
Axure也支持替換、查找文字，直接Ctrl+f。
當(dāng)出現(xiàn)字段批量替換時(shí)，就不用一個(gè)個(gè)去找了。不過(guò)在替換后，不支持撤銷，替換錯(cuò)了也影響不大，再替換回來(lái)就行了。
第三彈先到這，我在整理整理其它的Axure小技巧，湊夠一篇文章再分享給各位。
本文由 @王大鹿 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載
題圖來(lái)自Unsplash，基于CC0協(xié)議
起Axure，做產(chǎn)品的朋友再熟悉不過(guò)了，它是我們?cè)谌粘坦ぷ髦凶畛Ｒ?jiàn)的原型制作軟件之一，今天分享的文章，主要是教大家如何使用Axure打造簡(jiǎn)單的個(gè)人網(wǎng)站，不會(huì)編程我們依然可以做網(wǎng)站。
演示地址：https://vip.uedart.com/demo/UEDART_019/index.html
接下去將分為幾個(gè)步驟去闡述：
舉個(gè)例子，我構(gòu)建的是一個(gè)小型個(gè)人展示站
包含以下主要內(nèi)容：網(wǎng)址導(dǎo)航、常用工具、實(shí)用資源、案例展示，通過(guò)思維導(dǎo)出對(duì)其內(nèi)容進(jìn)行
整理如下圖所示：
因?yàn)槲覀兪抢肁xure去制作網(wǎng)站，在我們平時(shí)工作的流程常常是，原型-設(shè)計(jì)-前端-開發(fā)，而這里我們只需進(jìn)行原型和設(shè)計(jì)，這里將不再有前后關(guān)系，為了節(jié)約時(shí)間，我們可以把Axure當(dāng)做設(shè)計(jì)工具，直接進(jìn)行頁(yè)面設(shè)計(jì)，里面所需的圖片素材可以用ps輔助設(shè)計(jì)。
創(chuàng)建一個(gè)項(xiàng)目文件夾用來(lái)整理此網(wǎng)站涉及到的全部資源素材
采用的是藍(lán)色調(diào)，可以看下我的主色、輔助色的配色如下
導(dǎo)航布局如下，采用了頂部導(dǎo)航的方式，設(shè)置了動(dòng)態(tài)面板并將此轉(zhuǎn)化成母版用于多個(gè)頁(yè)面
如下圖所示，有懸停效果和點(diǎn)擊跳轉(zhuǎn)的設(shè)置
網(wǎng)址導(dǎo)航欄目的左側(cè)菜單設(shè)置，滑塊移動(dòng)位置的y坐標(biāo)按具體位置設(shè)置，每個(gè)元素都要設(shè)置
左側(cè)導(dǎo)航在滾動(dòng)時(shí)觸發(fā)具體欄目類別，采用的是熱區(qū)范圍來(lái)觸發(fā)，當(dāng)窗口滾動(dòng)時(shí)觸發(fā)相應(yīng)的類別選中
布置完畢將柵格去除（紫紅色是1200px寬度的邊界）
拿網(wǎng)址導(dǎo)航頁(yè)做示例，每個(gè)單元模塊標(biāo)題，網(wǎng)址卡片、左側(cè)導(dǎo)航的排布盡可能規(guī)范統(tǒng)一，立馬包含了各種元素的基本規(guī)范如：字體大小、顏色、寬度、懸停交互效果點(diǎn)擊跳轉(zhuǎn)效果
合理利用中繼器做頁(yè)面的數(shù)據(jù)關(guān)聯(lián)
常用工具與實(shí)用資源頁(yè)面，采用了中繼器來(lái)制作，在中繼器的微型數(shù)據(jù)表中，插入對(duì)應(yīng)字段后，關(guān)聯(lián)每項(xiàng)參數(shù)的內(nèi)容（對(duì)元件名稱進(jìn)行命名），以后增加一條數(shù)據(jù)對(duì)應(yīng)改變其內(nèi)容即可。
如下圖包含了圖片，標(biāo)簽，標(biāo)題，詳情描述幾個(gè)內(nèi)容，在中繼器中就要有相應(yīng)的字段來(lái)進(jìn)行控制
（1）我們需要一個(gè)域名，可以到阿里云萬(wàn)網(wǎng)去購(gòu)買https://wanwang.aliyun.com/，我選擇的域名是uedart.com的域名；
（2）我們還需要一個(gè)服務(wù)器，我選擇的是海外云虛擬機(jī)，不需要備案可以在阿里云進(jìn)行購(gòu)買；
（3）都準(zhǔn)備好之后，我們要做的是按照阿里云的步驟進(jìn)行虛擬機(jī)的設(shè)置布局，下載Filezilla進(jìn)行關(guān)聯(lián)，將我們axure生成的文件進(jìn)行上傳，上傳之后，我們?cè)龠M(jìn)行域名的解析，即可通過(guò)域名對(duì)我們的網(wǎng)站進(jìn)行外網(wǎng)訪問(wèn)。
可以將index和start的html刪除，復(fù)制第一個(gè)頁(yè)面的html改名成index重新上傳即可
至此通過(guò)以上5個(gè)步奏，我們利用Axure完成了一個(gè)小型網(wǎng)站設(shè)計(jì)與制作，當(dāng)然這并不是一個(gè)傳統(tǒng)意義上的網(wǎng)站開發(fā)，只是借此向大家介紹下，利用Axure的html生成，我們可以簡(jiǎn)單的處理一個(gè)網(wǎng)站的制作，如果只是個(gè)人的網(wǎng)站，且不需要過(guò)多的復(fù)雜功能，此方法足以滿足各位的需求，大家也可以利用這樣發(fā)方式來(lái)制作自己的網(wǎng)站。
謝謝大家的觀看！
本文由 @時(shí)光若刻 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。
題圖來(lái)自 Unsplash，基于 CC0 協(xié)議
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
