根據這幾年的產品運營經驗總結得來，不一定適合所有的移動端 WordPress APP 團隊，但是對於大部分中小團隊還是比較有借鑑價值。移動端 WordPress APP 原型設計，是方法論，所以適用於所有的原型軟件，並不侷限於 Axure RP 。

　　定保真

　　正式畫 WordPress APP 原型之前，需要明確 “原型該畫到什麼程度” 。因為它決定了 PM 的工作量多少以及產品上線的質量。

　　原型畫到什麼程度，一般取決於上級的要求，或者延續團隊之前的習慣。當然也可以根據團隊實際能力以及上線要求來優化原型交付標準。

　　不建議大家按照所謂的高保真、中保真、低保真原型來理解。看上去劃分很，實際概念不清晰。所以我明確了他們的概念，方便大家理解其中的差異。

　　低保真=黑白線框圖，無互動

　　中保真=黑白線框圖，帶主要互動

　　高保真=配色線框圖，帶全部互動

　　一般來説低保真原型就能夠滿足設計和開發需求。如果給甲方看可以使用中保真原型。高保真原型除了裝 B 很少用到。

　　畫頁面

　　畫頁面是畫原型的必備工作，比如需要提前確定頁面的尺寸和位置，不過初級 PM 容易忽視關鍵步驟。

　　建議使用 375×667 來畫 WordPress APP 原型頁面，能夠上下相容目前主流的所有螢幕解析度。可參考舊文章《為什麼 375×667 是移動端原型的理想解析度》。如果您的手機是 Android，那麼使用 360×640 也可以。其他尺寸畫頁面會影響視覺設計師畫出有一定誤差的視覺稿。

　　至於位置更少有 PM 關注，但是它影響着您在手機上預覽原型的展示區域。像墨刀、 xiaopu 、 justmind 預設幫您把位置設為 (0,0)，而 Axure，mockplus 是無限畫布需要 PM 手動設定。不設定的後果就是手機上預覽原型的時候很難看到頁面內容。

　　確定頁面尺寸和位置後，接下來就是用原型軟件畫出一個個頁面。可參考舊文章《如何使用 Axure 規範的畫出頁面的線框圖》。

　　不是特別建議 PM 在原型階段就把頁面中的元素進行配色，會妨礙了視覺設計師的發揮。當然如果您想提升自己對視覺的感覺，請配色之後只輸出黑白線框圖交付給視覺設計師 (Axure 是支持這樣的功能) 。

　　加互動

　　如果您只畫了所有頁面，就交付給設計和開發，那麼無疑是低保真原型。建議加上主要互動，以中保真原型的標準交付給大家。

　　所謂的主要互動，先是指頁面之間的跳轉。這個做起來很簡單，但是能夠展示整個產品的頁面關係。能夠讓設計和開發快速的評估整個版本大概需要多少工作量。可參考舊文章《如何正確地畫出頁面流程圖》。

　　其次，可以把 WordPress APP 中的下導航、上導航、常見 toast 、彈層一併畫出來，方便讓大家瞭解頁面內的互動體驗。如果提前做成 WordPress APP 組件庫然後快速呼叫，效率就特別高。

　　不建議 100% 的把所有互動畫出來，部分互動特別複雜會浪費很多時間，還不如直接寫文字邏輯表述。

　　定保真& 畫頁面& 加互動，這就是我理解的 WordPress APP 原型設計三部曲。

　　就我所知大部分初級 PM 只知道第二步 “畫頁面”，往往忽視定保真和加互動的重要性。