干貨推薦|Web、PC客戶端和移動端APP設計自檢表(附思維導圖源文件下載)

12 評論 38395 瀏覽 748 收藏 6 分鐘

在進行功能設計的時候,有一個List的清單可以幫助我們更好更完整地設計產品功能。今天作者@不知 辛苦數天整理了一份產品設計用的設計自檢表。推薦各位收藏。

最近整理了一份設計自檢表,適用于Web、PC客戶端和移動終端APP設計,主要用來在做產品設計的時候檢查設計內容的完整性,盡量考慮不同環境下產品的交互,同時補充一些做產品設計時容易忽視的細節。

思考的過程比較發散,可能還是會有一些遺漏的細節,會在后續不斷完善,也歡迎大家借鑒和吐槽。

一、顯示

1. 屏幕

顯示-屏幕

說明:

在PC端的Web或PC客戶端設計,需要考慮屏幕的分辨率不同而呈現不同的設計效果,對于一些Web的實現方式不同,還需要考慮不同屏幕尺寸下的顯示效果。PC端還存在調整窗口大小等操作,這種情況下是否需要對頁面布局進行調整?如何調整?都是需要根據產品的實際情況綜合考慮的問題。

而移動終端也同樣需要考慮分辨率的問題,除此以外就是支持橫屏還是豎屏?是否支持兩種屏幕方向的切換?若支持切換,布局如何調整?

2. 內容加載

顯示-內容加載

在做Demo的時候,往往會按照常規的內容加載量在做,但是不要忘記初始和無限大這兩種極限的情況哦!

二、網絡

網絡

說明:

網絡這塊考慮的四個方向之間其實存在著一定的關聯性,大家在不同的網速、網絡環境下可能會選擇不同的加載方式和數據傳輸方式。目前來說,這里提到的藍牙已經幾乎不再用于在文件等內容的傳輸了,而更多是用在做一些智能硬件的適配上。而VPN在To C的設計場景中幾乎不會出現,在To B的設計中才有可能偶爾需要考慮一下。

三、操作

操作

說明:

幾種設計平臺的設計模式各有不同,比較容易忽視的主要是一些狀態保持、快捷鍵操作。

四、輸入

輸入

說明:

輸入需要從輸入的格式、方式、校驗幾個角度考慮,不僅包含手動輸入,還有文件上傳等,在移動終端上,輸入的方式更加多樣。

五、流程

流程

說明:

在實際的設計中,會有單獨的業務流程設計,這里只是簡單提一下比較容易忽視的幾點,也就是當前狀態的顯示、加載內容的方式、操作的反饋。

六、狀態

狀態

說明:

這塊整理得比較零碎,主要是目前想到的一些情境下,需要考慮相關交互的設計呈現

此處連接可能包含連接服務器或連接用戶的情況,而不僅僅是網絡連接,比如QQ視頻也是一種連接

七、緩存

緩存需要考慮2個問題:

  • 何時更新緩存?
  • 何時清除緩存?

這里需要考慮手動和自動的機制

八、特定條件觸發

特定條件觸發

說明:

這一塊是指在一些特定條件下觸發的操作,比如賬號注冊、多次驗證賬號密碼失敗、支付等,或是點擊到一些特殊格式的內容。

特定條件觸發的操作也是比較發散的命題,需要后續完善。

總結:

以上內容均為本人思考整理,并以思維導圖的方式放在了百度云上,Mindjet格式的源文件見下方鏈接:

作者鏈接:http://pan.baidu.com/s/1bfAtx8 ?密碼: aa77

官方鏈接:http://pan.baidu.com/s/1i3O1rs5

 

本文由 @不知 原創發布于人人都是產品經理。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 666,很干

    來自浙江 回復
  2. 感謝大佬!

    來自廣東 回復
  3. 作者是一個測試,不是產品吧?

    來自安徽 回復
    1. 確實是產品。。。

      來自上海 回復
  4. 網盤地址已失效,再分享一次吧

    來自廣東 回復
    1. 官方鏈接那個網盤還可以下哦,內容是一樣的

      來自上海 回復
  5. 作者您好,謝謝您的整理,可以留個微信或者郵箱聯系方式嗎?

    來自上海 回復
    1. ? 微信公眾號 不知,ID是 a_half_infinite

      來自上海 回復
  6. 產品小白,在此鞠躬致謝

    來自四川 回復
  7. 對于小白的我覺得非常受用,備注提示不能轉載,表示尊敬作者所以沒轉載

    來自廣東 回復
  8. 正準備自己寫一份,正好與作者比對一下。 ??

    來自上海 回復
    1. 哈哈,我倒是覺得很有用,好想轉,備注提示不能轉,好不開心

      來自廣東 回復