轉(zhuǎn)帖|使用教程|編輯:郝浩|2015-06-11 17:20:25.000|閱讀 416 次
概述:在一般的開發(fā)工作之前,我們通常會設(shè)計(jì)產(chǎn)品原型,大部分為axure繪制的線框圖作為產(chǎn)品的PRD文檔,本文將向你講解Axure產(chǎn)品原型在手機(jī)上是如何運(yùn)行的。
# 界面/圖表報(bào)表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
在一般的開發(fā)工作之前,我們通常會設(shè)計(jì)產(chǎn)品原型,大部分為axure繪制的線框圖作為產(chǎn)品的PRD文檔,供UI和開發(fā)進(jìn)行前期工作,但是有的時(shí)候客戶、領(lǐng)導(dǎo)想在開發(fā)之前,看到產(chǎn)品的概貌,就必須做產(chǎn)品的高保真原型進(jìn)行模擬,這時(shí)如果做出來的原型能運(yùn)行在手機(jī)端,那再好不過,如圖1(注:上圖是仿照丁香園的家庭用藥,做的一個(gè)高保真原型)。
原型制作軟件有挺多,不過個(gè)人使用之后,最后還是依然堅(jiān)持使用Axure,優(yōu)點(diǎn)頗多,也可能是先入為主,這個(gè)教程Axure也是必須軟件之一,適配為iphone5s。
1、首選是制作高保真原型,如圖2:
(注:高保真原型最好不要用太多內(nèi)部框架嵌套,加載速度有點(diǎn)慢,還是用動(dòng)態(tài)面板慢慢做,層級多了要有耐心)
iOS的屏幕尺寸目前是有限的幾種,原型尺寸要和其一致。比如iphone5s視網(wǎng)膜下像素為640*1136(The default full screen size of the iPhone 5 is 320 x 568 px (w x h).就是說320*568已經(jīng)可以鋪滿全屏,不過,由于Axure導(dǎo)出的原型在iOS上處理status bar時(shí)有問題,需要在高度上減去status bar的高度20,就為320*548,所以保證原型的高寬為320和548,如圖3整體高度為548px:
2、F8進(jìn)行生成設(shè)置,設(shè)置如下圖4:
3、生成原型文件,上傳到axureshare或者放置在EasyWebSevr的根目錄下,用本機(jī)IP替代電腦名稱,獲得完整路徑。
4、復(fù)制生成的html中原型鏈接,選擇without Sitemap,如圖5:
5、在safari中粘貼鏈接,并打開,已經(jīng)可以看到和屏幕寬度的界面,并添加到主屏幕,如圖6:
6、可以通過桌面的快捷icon,進(jìn)入原型,這個(gè)時(shí)候已經(jīng)適配了手機(jī),躺著桌面的icon,絲毫不會讓人看得出是原型,下圖7:
本文轉(zhuǎn)載自
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn