資源描述:
《蘋(píng)果iOS中可交互原型的最佳實(shí)踐-axure控件》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫(kù)。
1、蘋(píng)果iOS中可交互原型的最佳實(shí)踐-axure控件很多UX和PM同學(xué)還是習(xí)慣使用傳統(tǒng)的AxureRP制作產(chǎn)品原型,個(gè)人覺(jué)得AxureRP在iOS原型階段還是有優(yōu)勢(shì)的,比如可以很方便交互模式的創(chuàng)新和細(xì)節(jié),不拘泥原生控件.在互聯(lián)網(wǎng)上可以很方便能夠找到各種iOS組件庫(kù)來(lái)實(shí)現(xiàn)控件,所以本文中并不包含如何實(shí)現(xiàn)與iOS相同的交互方式.但解決一個(gè)困惑,即如何在iOS設(shè)備上優(yōu)雅的呈現(xiàn)原型呢?首先大致在iOS中原型呈現(xiàn)有這個(gè)幾個(gè)需求:必須全屏依照?qǐng)鼍霸诰€或者離線操作原型如果導(dǎo)入到App內(nèi),使用iTunes原生的方式無(wú)需越獄1.先前準(zhǔn)備工
2、作1)在原型設(shè)置中適配iOS(v6.5)在Generateprototype中Mobile/device對(duì)話框勾選IncludeViewportTag上傳Homescreenicon勾選Hidebrowsernav(whenlaunchedformiOShomescreen)2)在原型設(shè)置中適配iOS(v6.0)如果還在使用v6.0你可以需要自己動(dòng)手改造原型的HTML文件在中追加一下兩行代碼實(shí)現(xiàn)基礎(chǔ)的app全屏和Homescreenicon支持如果你原封不動(dòng)的使用這段代碼,請(qǐng)把icon.png請(qǐng)放置在原型html同級(jí)
3、目錄viewrawiOSWebAppMataThisGistbroughttoyoubyGitHub.3)原型的頁(yè)面命名盡量采用英文,避免中文編碼出錯(cuò)4)訪問(wèn)原型的時(shí)候不要訪問(wèn)index.html,而是直接訪問(wèn)具體的頁(yè)面我們?cè)趯?shí)際工作中總結(jié)了2種實(shí)踐方案來(lái)滿足大部分需求,優(yōu)劣勢(shì)對(duì)比:WebApp方式如果僅支持在線查看,Ax
4、ureRPv6.5原生的WebApp原型方案就可以了當(dāng)然我們手動(dòng)修改過(guò)代碼的v6.0原型也支持簡(jiǎn)單說(shuō)一下,因?yàn)橐呀?jīng)設(shè)置好了.只需要:1)Safari打開(kāi)網(wǎng)站2)選擇添加至主屏幕3)在桌面點(diǎn)擊主屏幕上的軟件即可需要幫助點(diǎn)擊這里查看官方說(shuō)明遇見(jiàn)特殊的情況,比如手機(jī)無(wú)法訪問(wèn)辦公網(wǎng),你可以把原型上傳到虛擬主機(jī)或者云上DocumentsinApp方式如果想用于客戶調(diào)研或者私下演示,可以用DocumentsinApp的的方案:這種模式方便用戶研究與客戶訪談時(shí)網(wǎng)絡(luò)環(huán)境千差萬(wàn)變.購(gòu)買(mǎi)AtomicWebBrowser軟件,售價(jià)僅$0.
5、99(RMB6.00)如下圖所示,修改Atomic全屏模式的設(shè)置來(lái)避免對(duì)原型的干擾將原型壓縮為zip文件,在iTunes中上傳壓縮成zip的文檔到Atomic當(dāng)中在Atomic中unzip解壓文檔,并訪問(wèn)主頁(yè)面的html文件進(jìn)入全屏模式至此,您已經(jīng)可以在iOS設(shè)備上實(shí)現(xiàn)原型演示了(三個(gè)手指向下滑動(dòng)可以退出全屏模式)總結(jié)希望上面兩種方式能夠?qū)δ切├_于如何在iOS平臺(tái)實(shí)現(xiàn)可交互原型的同學(xué)們有所幫助如果您在工作中有更好的解決方式,請(qǐng)?jiān)诒卷?yè)面回復(fù),與我們一同傳播給需要的同學(xué)們參考:1.http://www.humanein
6、terface.net/iphoneipad-prototyping-in-axure-rp-pro-6-quick-overview/2.http://mrpm.cc/?p=3423.http://victoriapod.com/useful-meta-tags-for-ios-web-app-developers/4.http://mobile.tutsplus.com/tutorials/iphone/iphone-web-app-meta-tags/5.http://mobile.tutsplus.com/t
7、utorials/mobile-web-apps/remove-address-bar/來(lái)源:百度UED人人都是產(chǎn)品經(jīng)理(woshipm.com)中國(guó)最大最活躍的產(chǎn)品經(jīng)理學(xué)習(xí)、交流、分享平臺(tái)