相信許多產品和設計師童靴都可以用原型設計工具制作制作出逼真的產品交互原型,如果能方便、直接地在 iPhone上演示這些APP原型,對于我們模擬用戶真實體驗,展示設計亮點都有很大幫助。壯壯結合自己這幾天閱讀資料和摸索實踐,總結了一下個人認為最 高效的方法,希望對在iPhone上演示APP交互原型有困擾的童靴們有所幫助。 首先,簡單介紹下我了解到的制作及演示APP原型的工具:
本文出自Tencent CDC Blog:http://cdc.tencent.com/?p=7246
作者:壯壯
? ? ? ? ?1.上手難易度:POP、快現最輕巧簡單,用手機拍下腦暴、手繪草圖,添加熱區,立即可以在 iPhone上演示原型,并且POP內嵌的交互動作如側滑、展開、消失,快現的搖一搖等,即可滿足一般的動態演示需要;iMockups、Mockop、 Grafio Lite等工具內嵌iPhone 控件庫,可導入設計稿圖片,在產品構思階段使用較方便;Flash、Fireworks需要一定的編程or代碼基礎;Axure入門簡單,熟練精通有門 檻~~~
? ? ? ? 2.功能性:功能最強大全面的當屬Axure,用好動態面板,多數交互效果都可實現,PC端、移動真機上都可演示原型。
? ? ? ? 3.使用效率:個人來言還是Axure,日常設計稿通常用Axure完成,原型素材導入、更改 十分方便;UIDeigner內置了大量的iPhone控件,自定義模版的使用對于團隊協作十分高效,用UIDPlayer即可在iOS設備上演示移動原 型,只期待UIDeigner盡快增加更多的交互動作;Keynote、 PPT添加鏈接過于繁瑣,而且不易更改。
?????????鑒于自己的使用經驗,我的總結主要針對如何在IOS設備上高效地演示Axure(v6.5)制作的高保真原型。按演示原型的查看方式分,演示方式分為兩種:Web APP模式和APP打開模式,對比兩種模式的使用條件、使用方法及演示效果如下表:
綜合以上幾點,個人比較推薦“APP打開模式”,雖然需要花費6.00元購買Atomic Web APP,但離線也可以演示,不受網絡環境限制,并且原型導入、頁面打開、更新的速度都比較快,不擔憂原型在線被盜等安全問題。而Web?APP模式最贊的 一點是能夠在桌面生成圖標,還原初始進入體驗,但是在線演示原型的信息安全讓人覺得不靠譜。補充一點,支持“APP打開模式”的APP還有iZip、 GoodReader、Mercury,但它們在全屏顯示、頁面跳轉等方面都不及Atomic理想。無論哪種模式,想要在iOS設備上完美地、高效地演示 app原型,先要做好生成原型時設置工作,完成原型界面與屏幕分辨率的適配。
打開Generate(F5)生成原型對話框,選中Mobile/Device
下面詳細介紹兩種演示模式的應用
APP打開模式(6.00購買Atomic Web作為演示原型的工具)

Web APP 打開模式
原型制作時還有幾點注意事項:
1.頁面命名最好都用英文,以防中文在解壓時出現亂碼;
2.APP主頁面不要用index來命名,否則打開Index時默認隱藏側邊欄,后續無法復制URL;
3.設計尺寸大小取決于選擇的演示方式:a).Web APP模式:屏幕高度-ios設備狀態欄高度,eg:設計尺寸=480-20px=460px;b).APP打開模式:采用設備默認尺寸
寫在最后:
原型設計、演示相關的工具&應用的增長和更新的速度實在太快,本人接觸使用地很有限,大家有更好的推薦歡迎留言交流;原型演示僅僅只是產品設計師表現想法的手段,毋須拘泥于工具,所以挑自己最順手的,走起吧~
參考文獻:
1.App are alive when Viewing on Your iPhone
2.Desining apps using the iPhone App Template
3. 把axure生成的html原型導入到iPad或iPhone的方法
4. iOS 中可交互原型的最佳實踐 ?
5.用 Axure 制作的 app 原型生成后放到手機上,如何演示效果最佳?
6:移動App原型設計神器 – POP(Prototyping on Paper)
7.Web Applications 開發技巧(一)
8.Changing the Viewport Width and Height?
本文出自Tencent CDC Blog:http://cdc.tencent.com/?p=7246
作者:壯壯
復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。
發評論!每天贏獎品
點擊 登錄 后,在評論區留言,系統會隨機派送獎品
2012年成立至今,是國內備受歡迎的設計師平臺,提供獎品贊助 聯系我們
標志設計標準教程
已累計誕生 729 位幸運星
發表評論
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓