在一般的開(kāi)發(fā)工作之前，我們通常會(huì)設(shè)計(jì)產(chǎn)品原型，大部分為axure繪制的線框圖作為產(chǎn)品的PRD文檔，供UI和開(kāi)發(fā)進(jìn)行前期工作，但是有的時(shí)候客戶(hù)、領(lǐng)導(dǎo)想在開(kāi)發(fā)之前，看到產(chǎn)品的概貌，就必須做產(chǎn)品的高保真原型進(jìn)行模擬，這時(shí)如果做出來(lái)的原型能運(yùn)行在手機(jī)端，那再好不過(guò)
1、首選是制作高保真原型，如圖2：
圖2 高保真的原型圖
(注：高保真原型最好不要用太多內(nèi)部框架嵌套，加載速度有點(diǎn)慢，還是用動(dòng)態(tài)面板慢慢做，層級(jí)多了要有耐心)
iOS的屏幕尺寸目前是有限的幾種，原型尺寸要和其一致。比如iphone5s視網(wǎng)膜下像素為640*1136(The default full screen size of the iPhone 5 is 320 x 568 px (w x h).就是說(shuō)320*568已經(jīng)可以鋪滿(mǎn)全屏，不過(guò)，由于Axure導(dǎo)出的原型在iOS上處理status bar時(shí)有問(wèn)題，需要在高度上減去status bar的高度20，就為320*548，所以保證原型的高寬為320和548,如圖3整體高度為548px：
圖3 高寬為320*548
2、F8進(jìn)行生成設(shè)置，設(shè)置如下圖4：
4、復(fù)制生成的html中原型鏈接，選擇without Sitemap,如圖5：
圖5 復(fù)制鏈接
5、在safari中粘貼鏈接，并打開(kāi)，已經(jīng)可以看到和屏幕寬度的界面，并添加到主屏幕，如圖6：。
圖6 添加到主屏幕
6、可以通過(guò)桌面的快捷icon，進(jìn)入原型，這個(gè)時(shí)候已經(jīng)適配了手機(jī)，躺著桌面的icon,絲毫不會(huì)讓人看得出是原型，下圖7：
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭(zhēng)議評(píng)論。
參與本評(píng)論即表明您已經(jīng)閱讀并接受
上述條款。