很多 UX 和 PM 同學(xué)還是習(xí)慣使用傳統(tǒng)的 Axure RP 制作產(chǎn)品原型，個人覺得 Axure RP 在 iOS 原型階段還是有優(yōu)勢的，比如可以很方便交互模式的創(chuàng)新和細節(jié)， 不拘泥原生控件。在互聯(lián)網(wǎng)上可以很方便能夠找到各種 iOS 組件庫來實現(xiàn)控件，所以本文中并不包含如何實現(xiàn)與 iOS 相同的交互方式。但解決一個困惑， 即如何在 iOS 設(shè)備上優(yōu)雅的呈現(xiàn)原型呢？

首先大致在iOS中原型呈現(xiàn)有這個幾個需求：

• 必須全屏
• 依照場景在線或者離線操作原型
• 如果導(dǎo)入到 App 內(nèi)， 使用 iTunes 原生的方式
• 無需越獄

1. 先前準備工作

1）在原型設(shè)置中適配 iOS （v6.5）

在 Generate prototype 中 Mobile/device 對話框

勾選 Include Viewport Tag

上傳 Home screen icon

勾選 Hide browser nav （when launched form iOS home screen）

2）在原型設(shè)置中適配 iOS （v6.0）

如果還在使用 v6.0 你可以需要自己動手改造原型的HTML文件

在 中追加一下兩行代碼實現(xiàn)基礎(chǔ)的 app 全屏和 Home screen icon 支持

如果你原封不動的使用這段代碼， 請把 icon.png 請放置在原型 html 同級目錄

 

 

3）原型的頁面命名盡量采用英文，避免中文編碼出錯

4）訪問原型的時候不要訪問index.html， 而是直接訪問具體的頁面

我們在實際工作中總結(jié)了2種實踐方案來滿足大部分需求，優(yōu)劣勢對比：

Web App 方式

如果僅支持在線查看， Axure RP v6.5 原生的 Web App 原型方案就可以了

當然我們手動修改過代碼的 v6.0 原型也支持

簡單說一下，因為已經(jīng)設(shè)置好了。

只需要：

1） Safari 打開網(wǎng)站

2） 選擇 添加至主屏幕

3） 在桌面點擊主屏幕上的軟件即可

需要幫助 點擊這里 查看官方說明

遇見特殊的情況， 比如手機無法訪問辦公網(wǎng)，

你可以把原型上傳到虛擬主機或者云上

標簽： iOS 交互原型 交互設(shè)計 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。