本文筆者分享了指紋識別的設計案例，詳細地介紹了設計過程，并對過程中出現(xiàn)的問題進行了復盤總結，供大家參考學習。

指紋識別的功能是以前做過的小案例，當時做的時候，出現(xiàn)了很多小問題，現(xiàn)在復盤總結一下幫助自己加深記憶，也希望能夠幫助到大家～

一、需求內容

1. 在手機的【設置】頁面內新增一個【指紋識別】的功能，該功能要滿足以下三項要求：

①用戶最多可以定制十個指紋

②每個指紋都可以在手機鎖屏時快速解鎖

③每個指紋都可以在解鎖的同時開啟一個手機app

2. 繪制出此功能內含有的全部頁面，包括各類可能出現(xiàn)的交互情況（比如彈窗、滑動、跳轉等等）

二、需求分析

1. “錄制指紋最多可定制十個指紋” — 要考慮到三種狀態(tài)：空狀態(tài)（0個指紋）、使用狀態(tài)（1-9個指紋）和極限狀態(tài)（10個指紋）

2. 新建指紋的流程，要考慮到正常情況和異常情況，如長時間無法識別指紋、指紋命名重復、指紋錄入失敗

3. 編輯指紋（刪改查）

4. “每個指紋都可以在解鎖的同時立即開啟一個手機app”–不同的指紋可以綁定同一個app、相同的指紋只可以錄入一次

三、設計過程

(1) 添加指紋流程

存在兩處很明顯的設計問題：

問題A: 前面是空狀態(tài)流程，到A頁面提示“已存在重復指紋，請修改指紋名稱”是使用狀態(tài)(已有指紋時)可能會出現(xiàn)的頁面，這種情況是流程場景弄混淆了，做空狀態(tài)流程時，就要是空狀態(tài)應該出現(xiàn)的頁面，特殊的情況可以在旁邊標注上。設計是需要嚴謹的，不要因為個人輸出文檔時的失誤，導致項目延遲，所以在制作交互文檔的時候，一定要謹慎，謹慎，再謹慎；

問題B：底部按鈕出現(xiàn)兩個功能，一般APP都是這樣做的，如電商類app，加入購物車和立即購買按鈕；但是硬件的功能按鈕不允許這么設計的，會給系統(tǒng)帶來不穩(wěn)定的隱患；

（2）對已有指紋的刪改查

添加指紋后，不能對指紋本身進行修改，只能對該指紋對應的名字與綁定的app進行修改；指紋本身不可修改只可以刪除；

編輯A頁面的指紋名稱和對應打開的APP，需要點擊跳轉到B頁面，B頁面的設計包含了對該指紋的刪改查，頂部是對指紋名稱進行修改，中間部分是更改對應的APP（只能選擇一個），最下部分是對指紋進行保存和刪除的功能，這樣做的目的是提高用戶的操作效率，在一個頁面完成所有的操作；

但是從用戶體驗角度詳細分析，內容的詳情頁展示過于飽滿，導致頁面的操作效率不但沒有提高反而降低了，還有如果后期迭代需要對指紋再增加幾項功能，頁面完全不能容納，會需要架構的重構，所以需要增加一項編輯頁面，劃分邏輯，提高操作效率；

修改后的如下：

根據上邊的分析，增加了一頁編輯頁面，不僅提高了效率，功能邏輯也更加清晰。

以上就是我對“指紋識別”交互設計的總結～

作者：杜昭，微信：17611113635，微信公眾號：設計的威嚴

本文由@杜昭 原創(chuàng)發(fā)布于人人都是產品經理，未經許可，禁止轉載。

題圖來自Unsplash, 基于CC0協(xié)議。