對(duì)于如何把原型放至手機(jī)上進(jìn)行演示相信大家都已經(jīng)很熟悉了，但是如果幾位同事屏幕大小不一，或者需要安裝到客戶手機(jī)上進(jìn)行演示，這時(shí)候我們就很難保證我們的原型會(huì)顯示完整，要不然就是屏幕太小顯示不完全，要不然就是屏幕太大，會(huì)有留白的地方，以下的教程會(huì)教大家如何解決這個(gè)問題。

本文主要內(nèi)容目錄

1. 設(shè)置原型大小
2. 發(fā)布項(xiàng)目
3. 查看項(xiàng)目

1、設(shè)置原型大小

我們把原型的尺寸定為：375*647（減去了狀態(tài)欄20PX的高度）

2、發(fā)布項(xiàng)目

其它的設(shè)置我就不多說了，主要說一下移動(dòng)設(shè)備的設(shè)置。

• 寬度：375
• 高度：647

以上是IPHONE6標(biāo)準(zhǔn)的尺寸，建議使用IPHONE6尺寸，縮小放大都比較好操作。

• 最小縮放倍數(shù)：0.5
• 最大縮放倍數(shù)：2.0
• 允許用戶縮放：no

最重要的初始縮放倍數(shù)千萬不要填寫，填寫以后默認(rèn)就以iphone6的尺寸訪問，需要你縮放一下才能夠正常全屏顯示，如果沒有設(shè)置，則自動(dòng)以你手機(jī)屏幕大小進(jìn)行全屏顯示。

3、查看項(xiàng)目

發(fā)布完以后，放至網(wǎng)上，這個(gè)時(shí)候我們就可以用手機(jī)進(jìn)行訪問了，我們可以看到無論是iphone5的4.3尺寸還是iphone6 plus的5.5尺寸都是顯示正常并且正常全屏顯示的。

使用蘋果自己帶的Safari瀏覽器文件打開原型網(wǎng)址。

請(qǐng)不要使用帶工具欄的頁(yè)面訪問，這兩個(gè)頁(yè)面都是帶工具欄的index.html,start.html

可以使用這個(gè)網(wǎng)址進(jìn)行測(cè)試：https://test.hanhc.win/default.html

點(diǎn)擊桌面生成的圖標(biāo)就可以訪問了，現(xiàn)在看上去是不是不像是在訪問網(wǎng)頁(yè)呢。

寫在最后

原型訪問的方法有很多，大家都可以根據(jù)自己的實(shí)際情況進(jìn)行選擇，本文只是提供可以自適應(yīng)手機(jī)屏幕大小的方法，把原型放在手機(jī)上更多的時(shí)候是為了方便外出演示的時(shí)候，給客戶查看一種實(shí)際的效果，所以建議使用高保真原型比較妥。

原型只是展示和溝通的一種方式，并非產(chǎn)品經(jīng)理的全部，請(qǐng)不要本末倒置，產(chǎn)品經(jīng)理應(yīng)該更注重在溝通、思維、邏輯、業(yè)務(wù)上，當(dāng)然有時(shí)間把原型做好做漂亮也是一種技能。

作者：Han ，深圳產(chǎn)品狗一枚，目前在某個(gè)不知名電商任職產(chǎn)品經(jīng)理，歡迎相約交流。

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