利用axure原型在手機(jī)上做"APP"

Axure不僅能制作靜態(tài)的視覺稿、頁面,還能添加交互動作,是進(jìn)行原型設(shè)計(jì)的最佳軟件之一,更是產(chǎn)品經(jīng)理和交互設(shè)計(jì)師必備的軟件之一。對于產(chǎn)品經(jīng)理來說,畫完線框圖,再加上交互就成了更加形象的原型圖。一份生動形象且充滿邏輯性的原型圖,交到設(shè)計(jì)師或者程序員手中能令后續(xù)的工作進(jìn)展的更加順暢。

Axure不但支持在PC端生成html網(wǎng)頁形式的預(yù)覽,同樣也支持在移動端的預(yù)覽(包括交互!)相比于PC端網(wǎng)頁形式的預(yù)覽,移動端的展示效果更加逼真,能近乎真實(shí)的模擬一個APP。

那么如何把加了動效的原型圖在手機(jī)上展示出來呢?這里介紹兩個方法

方法一:

  1. 按照將要展示的手機(jī)分辨率尺寸制作原型圖,比如我想要在iphnoe5s上看那就是640* 1096 (除去state bar的40 所以注意并不是喔640*1136)

  2. 注冊一個axure share賬號,用來在服務(wù)器上發(fā)布自己的作品


    注冊界面
  3. 發(fā)布設(shè)置:publish>previews options>點(diǎn)擊configure

選擇preview options
選擇configure
  • 在左側(cè)欄中選擇:Mobile/Device
  • 右側(cè)輸入尺寸 (根據(jù)所想展示的手機(jī)而定)
  • 勾選上[防止垂直方向移動] 和[自動關(guān)聯(lián)號碼]
  • 用114*114的尺寸做一個模擬app的icon直接import
  • 勾選隱藏邊框


    設(shè)置

發(fā)布到axure服務(wù)器后,會自動生成一個Link (記得勾選without sitemap)

發(fā)布成功后生成Link

下面就是手機(jī)上的操作了:
用手機(jī)上的safari瀏覽器打開剛剛生成的Link,網(wǎng)頁加載完畢后點(diǎn)擊[添加到主屏幕]

添加到主屏幕

輸入你想給它的取“名字”,比如:Earon,點(diǎn)擊添加

給你的應(yīng)用取個名字

你就可以在桌面看到你的“app”啦

在桌面

雖然不是一個真正的app,但是幾乎所有的交互都可以實(shí)現(xiàn),還是蠻逼真的:)

方法二:

類似PS有Psplay,Sketch有mirror一樣。
Axure同樣有一款叫Axure share的app
無需以上的設(shè)置,只需要按照屏幕尺寸設(shè)計(jì),之后直接上傳,就可以從手機(jī)端的Axure share 中看到上傳的文件。直接打開即可

隨手做的丑圖
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容