APP解鎖流程分享(含邏輯關系圖、用戶流程圖和UX模板Sketch文件)

16 評論 83924 瀏覽 232 收藏 4 分鐘

前段時間做了一個設置app解鎖密碼的小項目。根據需求設計了數字密碼、手勢、指紋三種方式的解鎖流程。解鎖內容不是特別全面,比如不能修改同種類型的密碼。過稿的版本包含很多提示框,我覺得太啰嗦,這里就刪掉了(是的,木有用戶測試,全憑抄和個人感覺)。

APP解鎖流程我分為設置、解鎖、修改、關閉四個部分。

1、設置

三種方式的設置流程不一樣。數字密碼在確認環節錯誤后,進入重新輸入密碼的環節。也就是說第一次輸入的數字已經失效了。手勢密碼始終是驗證后面輸入的手勢是否與第一次輸入的一致,并且會有一個小圖標提示用戶繪制過的圖案。如果實在想不起來可以選擇重設手勢密碼。指紋密碼始終驗證系統指紋。具體流程如下圖

Snip20160705_4

用戶流程圖如下圖:

Snip20160705_10

文末會分享下載無碼高清圖的鏈接。

2、解鎖

密碼和手勢都設置了5次驗證上限,指紋是3次上限。超過上限直接登出,讓用戶使用用戶名和密碼登錄。如果用戶是從忘了解鎖密碼、超過錯誤上限登出的,刪除解鎖緩存,登錄進去后重新設置解鎖密碼。

Snip20160705_7

Snip20160705_11

3、修改

修改第一步是驗證舊密碼,因為可以設置解鎖密碼出現的間隔,如果用戶設置的間隔時間過長,不驗證的話,安全風險比較高。這里畫的時候偷懶了,導致后面畫user flow的時候麻煩了些。

Snip20160705_8

Snip20160705_12

4、關閉

其實就是修改流程的前半段。

Snip20160705_9

Snip20160705_13

分享包中包含:

  1. 設置、解鎖、修改和關閉4個部分的邏輯關系圖
  2. 設置、解鎖、修改和關閉4個部分的用戶流程圖
  3. 制作流程圖使用到的UX模板-ArcTouch Mobile UX Templates(感謝原作者的分享)

希望能為大家提供參考,并且獲得大家的反饋。

分享包下載鏈接http://share.weiyun.com/55bdafddd5724c99ec99485baecdcdf2

官方鏈接:http://pan.baidu.com/s/1hrIjpB2 密碼:q2gd

 

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

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 您好,鏈接失效了,勞煩發一份到郵箱dev_zl@outlook.com,萬分感謝??!

    來自天津 回復
  2. 您好,鏈接失效了,勞煩發一份到郵箱704984831@qq.com,萬分感謝??!

    回復
  3. 連接實效了

    來自北京 回復
    1. 可以從新給一個嗎

      來自北京 回復
  4. 您好,鏈接失效了,請問能再發一個有效的下載鏈接嗎?

    來自北京 回復
  5. 您好,想問一下您的流程圖斜著矩形文案是輸入,這個形狀代表什么意思?

    來自上海 回復
  6. 您好,麻煩問一下 連接原型圖的紅色連線 是用的什么插件?謝謝您。

    來自上海 回復
    1. 同問,好想知道

      來自廣東 回復
    2. 用的現成的模板ArcTouch Mobile UX Templates,這個模板里有紅色連線。

      來自江蘇 回復
    3. 謝謝謝謝 ??

      來自上海 回復
  7. 密碼過多有礙于用戶使用,在使用密碼時,需結合應用場景。

    來自上海 回復
  8. 題主,你好,想問你以上的APP界面流程圖是用什么工具做的嗎? 很美,希望可以學習下。

    來自廣東 回復
    1. 用sketch畫得

      來自江蘇 回復
  9. 分享包鏈接失效了 能重新發下么

    來自廣東 回復
  10. 鏈接失效,無法下載。。。

    來自北京 回復
    1. http://pan.baidu.com/s/1hrIjpB2
      密碼:q2gd
      你的鏈接沒有復制全,試試這個

      來自浙江 回復