界面設計方法(11)：功能按鈕設計

三、修改按鈕1. 功能作用

修改按鈕是對於在界面上已經處於“鎖定狀態”的數據進行修改的功能。

對沒有被鎖定數據的修改可以直接通過編輯的方法對錯誤數據進行修改，但是界面上的數據被鎖定後就不能採用直接編輯錯誤數據的方法去修改了。對於沒有鎖定要求的系統而言不存在修改功能的設計問題。

2. 基本功能

修改數據的方式有很多種，根據系統的整體設計理念，常見的有以下3種主要修改方式：物理刪除方式、解鎖修改方式、紅字更正方式，下面就這3種方式進行説明。

1 ) 物理刪除方式修改

這個方式是直接從數據表上將已保存過的數據刪除，然後再追加一條正確的數據。一般來説這種修改方式僅適用於數據尚未被鎖定的情況，或在系統為維護人員特別設置的維護界面上進行刪除操作。

2 ) 解鎖修改方式

界面已經被鎖定後發生了需要修改的數據時，可以通過解鎖的方法進行修改。但是這種方式看似簡單實則不易，採用解鎖的方式進行修改有兩個注意點，

• 審批流程：如果採用審批流程全部通過後對界面進行鎖定的方式，則刪除數據需要對整個審批參與者做出説明（需要通知每個參與審批的人）。
• 數據引用：通常鎖定後界面上的數據會被下游的其它組件引用，如果解鎖修改就有可能造成一連串的矛盾（需要清除全部引用數據的影響）。

因此，如果不能解決上述的問題則不建議採用解鎖的方式修改數據。

3 ) 紅字更正方式修改

紅字更改方式，是在保留記錄履歷的前提下進行修改的主要方法。所有與業務相關的數據以及需要保存履歷的數據都要採用這個方法進行修改。基本方法是輸入與錯誤數據大小相同的“負值（稱：紅字）”對沖已記錄的錯誤數據以達到修改的效果。這種方法多用在下述情況：

• 保存的數據一旦被鎖定就不能解鎖。
• 不能用物理刪除的方式修改。
• 系統設計規則要求保留所有變更的履歷等。

紅字修改的設計思路如下，假定：錯誤數值A=10，正確數值B=8，修改方法如圖1所示，

圖1 紅字更改方式

修改方法一：部分更換

因已輸入的原始數值大於正確數值，即：A＞B，則只需要從A中減去差額B即可，修改如下。

• 第一條數據A=10；
• 追加輸入第二條記錄，這個記錄是差額B=-2（紅字）；
• 已保存的二條記錄的合計=A+B=10+（-2）=8，修改完成；

修改方法二：全部更換

將已輸入的錯誤數值先用紅字數值B進行覆蓋，然後再輸入正確的數值C，修改如下。

• 追加第二條與A大小相同的紅字B=-10，則兩條記錄合計=A+B=10+（-10）=0；
• 追加第三條記錄，輸入正確數值C=8，則三條記錄合計=A+B+C=0+8，修改完成；

注：正確數據值用了藍色的字“C=8”，因此也有將這種修改方式稱之為“紅藍字處理”的。

4 ) 修改與刪除的關係

如果錯誤數據和變更數據的大小相同、符號相反，則相當於進行了刪除。即，在紅字的修改方式中，刪除只是修改的一個特例，因此可以不單獨設置刪除功能。

3. 管控功能

對鎖定後的數據進行修改需要受到很多方面的約束，常見的一些場景有：

1 ) 權限的約束

是否可以修改，取決於系統管理員是否賦予了用户修改該功能的修改權限。

2 ) 時限的約束

財務相關數據的輸入期間都是有時限要求的，過了時限後原則上是不可以再修改的，比如：3月份的數據有錯誤，但發現錯誤時已經進入了4月份，此時如果直接修改則將要影響已申報的3月份數據，這種情況通常只能在4月以後的數據中加入調整值（在4月份修改的數據是不會影響半年、或全年的統計結果的）。

3 ) 審批的約束

組件上設置有審批流程時，當組件通過了審批後數據將被鎖定。如果要修改必須要設計可以重新進行審批的機制，否則繞過了審批也可以修改則審批就失去了意義。

四、 保存按鈕1. 功能作用

保存按鈕用於將輸入的數據存儲到計算機內部或外部存儲介質上。

用鍵盤輸入到字段控件內的數據只是暫時顯示在屏幕上，如果沒有按下保存按鈕將其物理地記錄到數據庫中，則在關閉窗口後數據就會丟失，再次打開窗口時該條數據就不會顯示出來了。保存按鈕除去具有保存的功能外，通常還會將對規則的檢查掛接在保存按鈕上，以保證將正確的數據保存到數據庫中。

2. 基本功能

保存按鈕的功能就是將數據保存到數據庫，並且要在保存前檢查數據是否合乎數據庫的要求，檢查的內容舉例如下：

• 數值類的數據格式是否合規，如：貨幣，格式，位數等。
• 文本類的數據檢查內容，如：字數，大小寫、是否存在空格等。
• 日期類的數據檢查內容，如：格式，時間。
• 數據不能為空等。

可以看出來，上述規則都不是企業管理的規則，它們是數據庫的規則，所以它不屬於管控功能。

3. 管控功能

在保存按鈕上可以鏈接管控規則。在保存時，檢查是否有違反管控規則的現象。

五、 提交按鈕1. 功能作用

提交按鈕用於組件的業務處理全部完成後發出處理完成的信號。

提交按鈕實際上是一個檢查規則的集合體，提交如果獲得通過，則表明這個組件內的數據輸入和處理全部符合提交按鈕上鍊接的規則，可以提供給下游的組件使用。

“提交”不一定是通用的稱呼，軟件開發商由於習慣不同，也可以用其他的名稱或方式來實現上述功能。

2. 基本功能

提交功能沒有與保存功能等相似的基本功能，它的作用就是將一系列規則依次啓動、執行。

【舉例】當一個“經費報銷”組件的輸入工作全部完成後，按下界面上設置的“提交”按鈕後，在提交按鈕上鍊接的規則將會從1～5依次被啓動，如圖2所示，簡單地説明一下各個規則的含義（不限於此）。

圖2 提交按鈕的處理過程

• 財務規則：檢查報銷金額是否合乎公司財務相關的規定、是否填寫了費用的使用目的等，這些與企業管理規章制度相關的工作可以任意的增加。
• 時限規則：檢查相關的時限規則是否有違反，此時界面上如有“日期”類的字段就可以設置時限檢查，比如：每個月的差旅費報銷截止日為第二個月的第三個工作日前，過時不候，檢查此時本界面上的日期是否超過。
• 鎖定規則：如果在前面所有的規則全部通過檢查，則啓動鎖定界面的鎖定機制，將預先規定的對象（全界面、或部分控件）進行鎖定；
• 審批規則（審批流程）：如果經費金額達到了要上級審批的額度就需要走審批流程，自動啓動審批流程，審批通過後，此組件的處理全部完成。
• 推送信息：如果所有預先設定的規則全部通過後，則向下遊的組件、數據庫以及預先設定好的其它存儲介質推送信息、推送數據和保存數據。

3. 管控功能

嚴格地説，提交不是一個系統操作功能，它與新增、保存等不一樣，它本身就是一個管控功能的觸發按鈕。在管控方面只有對提交按鈕的使用權限。

4. 保存與提交區別

在檢查違規時，對保存按鈕與提交按鈕的設計有很多不同點。

1 ) 功能的目的不同

• 保存：將輸入的新數據保存到數據庫，也可以協助檢查規則的激活。
• 提交：發出數據輸入完成的信號、並啓動一系列的檢查規則。

2 ) 檢查重點的不同

• 保存：檢查的是輸入數據是否有違反數據庫規則的。同時支持分步保存，所有屬於“必填項”的內容在第一次按下保存按鈕前要輸入完，但是非必填項可以分幾次進行輸入、保存。
• 提交：檢查的是輸入數據是否全部滿足包括業務標準和數據庫的要求，按下提交按鈕前，所有的數據都必須要按數量、按規則輸入完畢、缺一不可。

按鈕設計小結：

以上關於按鈕的設計説明，給出了一些對按鈕設計的思路、方法、標準等，按鈕功能當然不止這些，這裏給出的內容可以作為一般按鈕設計的參考意見。從前述的説明可以看出來，按鈕不能只從對系統操作的視角做設計，還要特別關注它們作為對業務標準、管理規則進行檢查和執行的載體作用。

至此，界面設計的全部內容就登載完了，界面設計是軟件設計中工作量最大、最為重要的部分之一，因為工作成果與用户直接的感受有關，也是影響客户滿意度的最為重要的設計工作之一。界面設計是包括需求工程師、架構師、開發工程師、以及從事美工、UI等工作全體人員的協同成果，對界面進行深入、細緻的規劃、設計，是讓客户感受信息化價值、提升客户滿意度的最重要窗口。

本文由 @李鴻君 原創發佈於人人都是產品經理，未經許可，禁止轉載

題圖來自 Unsplash，基於 CC0 協議