編者按：作為世界最著名的客戶關(guān)系管理軟件巨頭，Salesforce 在CRM軟件設(shè)計(jì)上有著深入的了解和過硬的設(shè)計(jì)和開發(fā)經(jīng)驗(yàn)。諸如CRM這類企業(yè)級的軟件中，表單類的界面非常多，這也促成了今天的這篇文章。一個(gè)優(yōu)秀的表單到底要具備怎樣的素質(zhì)？如何提高表單的用戶體驗(yàn)和使用效率？看看Salesforce 的團(tuán)隊(duì)是怎么做的。 Salesforce 用戶每天都在和表單打交道，無論他是銷售人員、主管還是經(jīng)理。所以，對于Salesforce而言，能否無縫地添加、編輯、刪除信息就是確保企業(yè)生產(chǎn)力的核心因素和驅(qū)動(dòng)力所在。這也是為什么Salesforce的UX團(tuán)隊(duì)將表單設(shè)計(jì)和編輯作為新產(chǎn)品 Lightning Experience的核心。

1、標(biāo)簽&字段的對齊 在Lightning 中，表單里的標(biāo)簽和它所對應(yīng)的輸入字段是一起左對齊的，并且標(biāo)簽處于輸入框的上方。這種設(shè)計(jì)方式可以讓用戶操作更加省心高效，和之前的版本相比，用戶在瀏覽和操作的時(shí)候，只需要進(jìn)行上下眼動(dòng)就可以搞定一切，無需左右掃視。 一切都是左對齊的 雖然新的設(shè)計(jì)會(huì)在垂直方向上占用更多的空間，但是標(biāo)簽和字段的匹配會(huì)讓整個(gè)界面在視覺上更加易用清晰。為了讓用戶在輸入的時(shí)候看得更清楚，成對的字段和標(biāo)簽會(huì)更加靠近，兩個(gè)不同的組之間的間隙會(huì)更大。無需左右掃視之后，用戶可以更加順暢地填寫表單。 在視圖模式之下，我們采用了相同的原理來設(shè)計(jì)，這樣使得信息的層次結(jié)構(gòu)更優(yōu)秀，同時(shí)確保了整體的可讀性。

2、設(shè)置默認(rèn)值 如果你是一名銷售人員，你的工作內(nèi)容可能涉及到同潛在用戶進(jìn)行溝通（也就是“Leads”）。如果你想在Salesforce中跟蹤這些潛在用戶的信息，那么通常你得先創(chuàng)建一個(gè)相應(yīng)的檔案。如果要這么做的話，可能會(huì)創(chuàng)建下面的這種Lead 表單： 在Salesforce中創(chuàng)建一個(gè)新的Lead 表單 看起來很簡單，是吧？但是如果我們仔細(xì)看看，就能逐漸找出這種表單在設(shè)計(jì)上的門道。第一個(gè)可編輯的字段是“Lead 狀態(tài)”，它包含了以下選項(xiàng)：無聯(lián)系、有聯(lián)系、開放狀態(tài)、合格、不合格。 研究表明，設(shè)置一個(gè)默認(rèn)值會(huì)引導(dǎo)許多人在多種不同的語境和環(huán)境下選擇默認(rèn)選項(xiàng)。好了，回到最初的問題，如果你是一個(gè)銷售人員，在同新的潛在用戶的溝通的時(shí)候，第一次填寫這個(gè)表單的時(shí)候，你可能會(huì)更傾向于選擇“開放狀態(tài)”而非空著不填寫。 好了，在絕大多數(shù)的情況下，新建一個(gè)Lead 表單的時(shí)候銷售人員會(huì)選擇“開放狀態(tài)”。而在之后每次新建這類表單的時(shí)候，在這個(gè)字段上耗費(fèi)一兩秒來進(jìn)行選擇。但是如果這種表單的數(shù)量非常多，比如有幾百份，那么這個(gè)修改成本就非常之高昂了。這就是為何要為一些字段設(shè)計(jì)默認(rèn)值。

3、預(yù)填寫相關(guān)字段 許多記錄的相關(guān)頁面會(huì)根據(jù)“發(fā)布者”來執(zhí)行一些預(yù)制的操作，比如創(chuàng)建新的任務(wù)和事件（我們在淘寶下單的時(shí)候，系統(tǒng)會(huì)幫你填寫預(yù)制的默認(rèn)收件地址、收件人和聯(lián)系電話，這種機(jī)制與之類似）。那么我們看看下面的頁面： 發(fā)布者登錄之后觸發(fā)的操作 系統(tǒng)會(huì)自動(dòng)填寫發(fā)布者信息

在理想的狀態(tài)下，用戶會(huì)認(rèn)真填寫每一個(gè)字段的詳細(xì)信息，然而事實(shí)上用戶并沒有這么做。

在這個(gè)案例中，這個(gè)Lead 表單是關(guān)于一個(gè)名叫Walter Junior的人，并且這是執(zhí)行一次調(diào)用之后顯示的界面。這個(gè)用戶相關(guān)的信息包含了四個(gè)字段，而其中“姓名”和“項(xiàng)目”兩個(gè)字段都被預(yù)先填寫，由于這是一個(gè)調(diào)用信息的界面，所以項(xiàng)目中默認(rèn)填寫的是“Call”，而相關(guān)用戶的名字也無需填寫，直接填寫進(jìn)去了。 在理想的狀態(tài)下，用戶會(huì)“勤勉”地填寫所有字段，并且詳細(xì)地描述每一個(gè)細(xì)節(jié)和相關(guān)的信息。然而實(shí)際上，人是有惰性的，操作者總會(huì)詳盡辦法偷懶。每一個(gè)新增加的字段，都是用戶完成表單的巨大屏障。為了解決這個(gè)問題，我們作出了一個(gè)妥協(xié)方案：系統(tǒng)預(yù)先填充一些相關(guān)的關(guān)鍵內(nèi)容。當(dāng)用戶填寫的表單涵蓋這些預(yù)制信息的時(shí)候，系統(tǒng)會(huì)幫用戶填寫預(yù)制的信息，這樣一來，這個(gè)有四個(gè)字段的表單中，用戶需要填寫的僅僅只有2個(gè)字段（請繼續(xù)腦補(bǔ)淘寶下單的時(shí)候，自動(dòng)添加收件人信息的機(jī)制）。

4、讓表單擁有更好的可訪問性 在設(shè)計(jì)新的Lightning Experience 的時(shí)候，我們對于它的可訪問性設(shè)計(jì)就有一個(gè)基本的構(gòu)想。由于鍵盤輸入還是目前我們用戶的主要輸入方式（考慮到我們這是一個(gè)企業(yè)級軟件），所以一定要對鍵盤有良好的兼容和適配，必須確保用戶僅用鍵盤就可以執(zhí)行全部的操作。為此，我們?yōu)槊總€(gè)表單組件建立了特定的鍵盤交互模式，而且這些模式的構(gòu)建是遵循W3C的規(guī)則來設(shè)計(jì)的，這也確保了這套交互的準(zhǔn)確和廣泛的適配性。 這是一個(gè)日期選擇器組件，旁邊是W3C中推薦的設(shè)計(jì)模式 然而上述的全部規(guī)則并不是剛好合適的，真正的重度用戶傾向于更高頻度地使用鍵盤，而他們也會(huì)從真正高度一致的鍵盤輸入體驗(yàn)中收益。如何評判整套鍵盤交互的易用和可靠性呢？一個(gè)真正為核心用戶設(shè)計(jì)的日期選擇器可以讓他們完成全部的日期選取、必要的編輯，而雙手無需離開鍵盤。

結(jié)語：更多的問題 對于Salesforce的UX團(tuán)隊(duì)而言，Lightning Experience 是一個(gè)里程碑，不過要做的事情還有很多。比如我們需要提升輸入體驗(yàn)，引入行內(nèi)編輯功能。 不管你在團(tuán)隊(duì)中處于什么樣的地位，是設(shè)計(jì)界面還是編寫代碼，無論是要設(shè)計(jì)復(fù)選框還是要制作更為復(fù)雜的CRM程序，表單的設(shè)計(jì)至關(guān)重要。在許多情形下，用戶需要同這些表單進(jìn)行長時(shí)間、大范圍的交互和操作，任何效率上的提升都會(huì)帶來體驗(yàn)的極大優(yōu)化。請務(wù)必記住，精心設(shè)計(jì)的界面不止是要保證形式上的漂亮，方便和高效的設(shè)計(jì)也是造福用戶的重要手段。