很多時(shí)候，對(duì)于產(chǎn)品經(jīng)理來(lái)說(shuō)一個(gè)靜態(tài)的原型圖是沒(méi)有任何說(shuō)服力的床三。如果是一個(gè)移動(dòng)端的產(chǎn)品經(jīng)理，在框架圖做完后杨幼，就能直接拿出產(chǎn)品進(jìn)行動(dòng)態(tài)演示撇簿，這既節(jié)省了溝通和之后開發(fā)的成本，又使自己的說(shuō)服力大大增加差购。那作為一個(gè)產(chǎn)品經(jīng)理四瘫，如何在剛制定完框架圖或者視覺(jué)效果圖時(shí)，就能通過(guò)手機(jī)動(dòng)態(tài)演示app欲逃，達(dá)到產(chǎn)品上線時(shí)的大部分效果呢找蜜？方式千萬(wàn)種，而你——應(yīng)該選擇最適合你的那一個(gè)稳析。
Axure能做的事：
流程圖：簡(jiǎn)化版Visio洗做，可實(shí)現(xiàn)大部分Visio功能，可隨時(shí)發(fā)布到Internet彰居，輸入網(wǎng)址即可向他人展示诚纸。
框架圖：不想多說(shuō)，暴力陈惰。
圖形處理：各種圖形處理工具畦徘，是的，新版本居然有鋼筆抬闯。
網(wǎng)頁(yè)制作：不需要懂Html代碼可以制作各種網(wǎng)頁(yè)交互效果井辆，以本文為例。
WebAPP制作：想知道溶握？看下面杯缺。
產(chǎn)品需求文檔：沒(méi)有不可能。
能交互的手機(jī)登錄界面
如果是一個(gè)靜態(tài)的原型圖睡榆，登陸界面設(shè)計(jì)只能體現(xiàn)出所有元素內(nèi)容和基本框架風(fēng)格萍肆，但是對(duì)于用戶的使用體驗(yàn)是一無(wú)所知廉赔。可如果等開發(fā)人員制作出來(lái)后太驗(yàn)證效果也為時(shí)已晚匾鸥，所以我們需要一個(gè)既能檢驗(yàn)真實(shí)效果又便捷的開發(fā)工具：
上圖即是我制作的手機(jī)登錄界面，當(dāng)然視覺(jué)效果一般般碉纳，因?yàn)槲抑饕獪y(cè)試的是整個(gè)登錄流程的交互情況勿负。而在整個(gè)程序的設(shè)計(jì)你可以不需要一丁點(diǎn)的html知識(shí)，卻實(shí)現(xiàn)了自動(dòng)生成驗(yàn)證碼劳曹、所有字段邏輯判斷奴愉、用戶輸入時(shí)改變交互等。是的铁孵，就像PPT锭硼，就像易企秀一樣，按照軟件的邏輯蜕劝，制作出屬于你的WebAPP檀头。
點(diǎn)擊右側(cè)進(jìn)入手機(jī)登陸界面測(cè)試.
能體驗(yàn)才是王道
是的，這個(gè)頁(yè)面就像真實(shí)的登錄頁(yè)面一樣岖沛，所有的元素都是需要驗(yàn)證才能通過(guò)的暑始，比如Email，如果用戶輸入的不是一個(gè)郵箱地址婴削，點(diǎn)擊注冊(cè)時(shí)就會(huì)出錯(cuò)廊镜。
在這里我對(duì)所有字段的設(shè)置如下：
用戶名：少于3個(gè)字符出現(xiàn)提示
Email：沒(méi)有@和. 提示
密碼：少于3個(gè)字符出現(xiàn)提示，密碼不一致提示
驗(yàn)證碼：輸入不正確提示
立即注冊(cè)：只有當(dāng)所有字段填寫正確唉俗，才變?yōu)樗{(lán)色嗤朴。
體驗(yàn)了，才知道哪里不好
如果不仔細(xì)的人虫溜，不會(huì)知道當(dāng)我們用手機(jī)填寫注冊(cè)信息時(shí)雹姊，彈出的輸入法會(huì)覆蓋掉底下半個(gè)屏幕，所以當(dāng)我們的輸入字段在屏幕中間時(shí)衡楞，很有可能被輸入法覆蓋掉容为。
于是我優(yōu)化了交互體驗(yàn)，當(dāng)用戶輸入信息時(shí)寺酪，整個(gè)注冊(cè)界面會(huì)自動(dòng)上移坎背。
越真實(shí)，才越可靠
為了更趨近于真實(shí)的注冊(cè)界面寄雀，我采用了隨機(jī)生成驗(yàn)證碼的方式得滤，每當(dāng)網(wǎng)頁(yè)被加載時(shí)，系統(tǒng)會(huì)自動(dòng)生成4位數(shù)字的驗(yàn)證碼盒犹。
如果你會(huì)的多一點(diǎn)
將制作好的頁(yè)面發(fā)到到Axshare固然很好懂更，其他人只需點(diǎn)擊網(wǎng)址就可以看見(jiàn)你制作的頁(yè)面了眨业。可是我更推薦生成Html文檔沮协，然后上傳到自己的服務(wù)器中龄捡。因?yàn)樯芍螅€可以自己手動(dòng)對(duì)網(wǎng)頁(yè)代碼進(jìn)行加工慷暂，像我制作的這樣聘殖，當(dāng)你點(diǎn)擊下面的鏈接時(shí)，自動(dòng)判別查看的設(shè)備是手機(jī)還是電腦行瑞，然后分別進(jìn)入不同的頁(yè)面奸腺，這一點(diǎn)是Axshare永遠(yuǎn)無(wú)法做到的。
歡迎點(diǎn)擊自動(dòng)識(shí)別手機(jī)登陸界面血久。
如果你喜歡突照，歡迎向我索要源碼。
