Axure新技能：自適應手機屏幕大小

Han
23 評論 64248 瀏覽 225 收藏 4 分鐘

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

本文主要內容目錄

  1. 設置原型大小
  2. 發布項目
  3. 查看項目

1、設置原型大小

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

2、發布項目

其它的設置我就不多說了，主要說一下移動設備的設置。

  • 寬度：375
  • 高度：647

以上是IPHONE6標準的尺寸，建議使用IPHONE6尺寸，縮小放大都比較好操作。

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

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

3、查看項目

發布完以后，放至網上，這個時候我們就可以用手機進行訪問了，我們可以看到無論是iphone5的4.3尺寸還是iphone6 plus的5.5尺寸都是顯示正常并且正常全屏顯示的。

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

請不要使用帶工具欄的頁面訪問，這兩個頁面都是帶工具欄的index.html,start.html

可以使用這個網址進行測試：https://test.hanhc.win/default.html

點擊桌面生成的圖標就可以訪問了，現在看上去是不是不像是在訪問網頁呢。

寫在最后

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

原型只是展示和溝通的一種方式，并非產品經理的全部，請不要本末倒置，產品經理應該更注重在溝通、思維、邏輯、業務上，當然有時間把原型做好做漂亮也是一種技能。

 

作者：Han ，深圳產品狗一枚，目前在某個不知名電商任職產品經理，歡迎相約交流。

本文由 @Han??原創發布于人人都是產品經理。未經許可，禁止轉載。

更多精彩內容，請關注人人都是產品經理微信公眾號或下載App
Han
hanhc.cc
2篇作品 78564總閱讀量
07-178477 瀏覽
產品從免費到付費，如何讓用戶“心甘情愿”接受？
12-203552 瀏覽
為什么你降價了，客戶還是不買單？
10-302165 瀏覽
數字化項目負責人不需要懂數字化？
04-284946 瀏覽
B站“背棄”播放量？
01-163990 瀏覽
【社交電商】解讀拼團背后的產品邏輯「取消/退款篇」
評論
評論請登錄

  1. 正在學習，在這里有學到了新技術了，開心 ??

    來自廣西 回復

  2. 作者有點兒偏執呢，下面兩個認真的讀者為你指出了錯誤，你都懶得回到原文去看一眼，就簡單粗暴的回復他們：我沒錯。

    你自己回去看一下吧，你的原意是：“最重要的初始縮放倍數千萬不要填寫”，但對應位置的原文里寫的是：“最重要的最小縮放倍數千萬不要填寫”。樓下那個哥們，這是恨不得截個圖片給你發到回復里呢，我這是看不過去了，特意注冊了一個賬號上來說你的。。。。。第一個回復就送給你了。

    來自遼寧 回復

    1. 我并不是沒有回去看文章，只是理解錯他說的地方了，已經糾正，謝謝指出錯誤

      來自廣東 回復

    2. 666

      來自廣東 回復

  3. 最重要的最小縮放倍數千萬不要填寫，填寫以后默認就以iphone6的尺寸訪問，需要你縮放一下才能夠正常全屏顯示，如果沒有設置，則自動以你手機屏幕大小進行全屏顯示。

    來自廣東 回復

    1. 不好意思，看錯地方了，這里是寫錯了。

      來自廣東 回復

  4. 有錯別字啊，不是最小縮放倍數而是初始縮放倍數。而且我做的7的尺寸，按照作者說的方法去設置，用7PLUS去打開，結果是：然并軟?。?！

    來自廣東 回復

    1. 可以肯定告訴你，你說的那個地方并沒有錯別字，就是填最小縮放倍數0.5（實際情況可以根據你自己來填寫）。初始縮放倍數是不需要填寫留空的。你自己都把參數寫錯了，你可以用我的測試網址試一下，我的測試網址都可以，你的不可以，是否應該考慮是你自己設置錯誤造成的呢？

      來自廣東 回復

  5. 請問為何我ax中點擊生成后，跳轉了網頁頁面，然后不知該如何在手機中打開，是否可說明一下？

    回復

    1. 可以加我QQ聊：290306487

      來自廣東 回復

    2. 我也是同樣的問題 請問你現在解決了嗎

      來自湖北 回復

  6. 如果大家覺得使用axshare看原型慢的話，可以聯系我（QQ:290306487），我可以提供一種免費并且速度比較快的方法

    來自廣東 回復

  7. 是初始縮放倍數千萬不要填寫吧？是不是寫錯了

    來自遼寧 回復

    1. 并沒有，如果填了初始縮放倍數，第一次打開就會按設定好的倍數顯示，需要手動縮放一下才能正常全屏顯示，如果不設置的話，就默認按你手機屏幕的大小進行縮放，不需要你手動，就也就是為什么“允許用戶縮放”那里我建議填no，填了no ,用戶就不能手動縮放了，網頁就會自動縮放成適合你手機的大小，而你也不能主動縮放了，這樣體驗會更好些

      來自廣東 回復

  8. 同在深圳，準備開發轉產品。

    回復

  9. 點擊生成后生成的是單個文件，怎么上傳到axshare上面呢

    來自廣東 回復

    1. 同問

      來自浙江 回復

    2. 可以加我QQ聊

      來自廣東 回復

  10. 高保真的話用H5直接寫效率會高一點

    來自廣東 回復

  11. 然而axure在手機上的演示效果，特別是動態效果實在是差得難以忍受

    來自浙江 回復

    1. 其實這看每個人的要求，你要像H5那樣是不可能的，但是說差到難以忍受還是不至于的，只要設置恰當，瀏覽起來視覺效果還是挺不錯的

      來自廣東 回復

  12. 好東西，收藏了

    來自廣東 回復

    1. 順便關注一下哈，以后會有更多類似的文章

      來自廣東 回復