如果你做過多款APP,可能會發現他們之間存在很多共性。比如都需要考慮頁面如何加載、如何跳轉頁面,網絡不好如何呈現,如何埋點統計訪問和行為數據,時間如何展示,文本框的輸入等等。其實這些就是每一個PM需要遵守的規則,可以簡單的統稱為設計規范。
為了方便后續的工作,我將這幾年的產品文檔剝離掉具體業務,抽象出一套適用于移動端APP的規范大全。
提供Axure原型文件點擊下載,在線查看唯一更新網址。
頁面類型
基本上就這樣幾種,不一定都用得到。
DraggedImage-1.png
頁面間交互
參考的陳正曦的文章。
DraggedImage-1-2.png
還有幾種不常用的,供參考。
DraggedImage-2.png
手勢
DraggedImage-3.png
頁面的狀態
DraggedImage-4.png
頁面內數據的加載邏輯
DraggedImage-5.png
頁面加載
DraggedImage-6.png
頁面刷新
DraggedImage-7.png
狀態切換
DraggedImage-8.png
申請授權
重點是看獲取系統權限的地方,中間的業務細節可以不看。
DraggedImage-9.png
圖片相關
感覺邏輯上還有點問題,希望獲得大家的建議。
DraggedImage-10.png
時間格式
參考了知乎上一篇文章.
DraggedImage-11.png
文本框
根據某位讀者的需求,特意整理了一下常見文本框的規則。
DraggedImage-12.png
總結
以上是我總結的APP全局規范部分內容,全部內容可點擊查看浪子PRD規范。
本質上是一個產品設計的規范結合,類似于技術中的SDK工具包。
具體來說有功能規范、交互規范、視覺規范。深究下去你還會發現有命名規范、文字規范…
大家可以根據需要,將適合的部分用到自己的產品工作中。