最近在設(shè)計(jì)長(zhǎng)達(dá)50-100個(gè)字段的長(zhǎng)表單，在分步驟表單與長(zhǎng)表單中倒騰來倒騰去。突然某一天看見自己連體衣的扣子，意識(shí)到解扣子這么麻煩為什么要用扣子，改為拉鏈上洗手間該方便的多好啊。 產(chǎn)生了拉鏈、扣子與長(zhǎng)頁面、步驟頁的思考，所以想從扣子衣拉鏈這日常生活細(xì)節(jié)的角度去聊一聊什么時(shí)候該用步驟頁，什么時(shí)候該用長(zhǎng)表單。
1、拉鏈：連續(xù)不斷的拉索，快，易滑動(dòng)，會(huì)夾肉成用于皮衣、運(yùn)動(dòng)衣、包包。穿著時(shí)不用關(guān)注具體位置，易上下拉動(dòng)。
2、扣子：間隔的別在衣服中，慢，不能滑動(dòng)，慢條斯理。常用于西裝襯衫，可以選擇性的只扣某個(gè)位置。
3、向?qū)Р襟E頁：分割的頁面，需分配注意力點(diǎn)按按鈕。
4、長(zhǎng)頁面：連續(xù)不斷的頁面內(nèi)容，快，易滑動(dòng)，滑動(dòng)時(shí)無需分配注意力，常見于網(wǎng)頁新聞。易沉浸。
推薦使用分步驟頁的場(chǎng)景：
1、內(nèi)容過多，限制性條件較多，適合分步校驗(yàn)，逐步增加激勵(lì)。
2、考慮用戶使用電腦分辨率，頁面高度過低時(shí)如一些高度768px的便攜電腦，滾動(dòng)條難以精確定位操作時(shí)建議分頁面。
3、新手用戶分割頁面簡(jiǎn)化步驟，簡(jiǎn)化單頁面信息量減少學(xué)習(xí)成本，常見于自助終端。
分布設(shè)計(jì)要點(diǎn)：
1、上一步下一步按鈕應(yīng)盡量保持在同一位置如固定在界面底部，便于快速點(diǎn)按。
2、導(dǎo)航條在業(yè)務(wù)允許情況下可來回點(diǎn)擊。
3、每個(gè)步驟頁分別校驗(yàn)，激勵(lì)表單填寫。
4、注重信息分類，避免同類關(guān)聯(lián)較緊密的信息分散在不同的頁面中，導(dǎo)致頻繁切換頁面，信息斷裂。另，分類命名很重要，考量業(yè)務(wù)理解力。
5、單頁面與分頁面對(duì)代碼來說存數(shù)取數(shù)規(guī)則不同，特別長(zhǎng)表單都有默認(rèn)聯(lián)動(dòng)取數(shù)規(guī)則，此時(shí)與需求開發(fā)協(xié)同考慮。
相反的頁面信息量少，關(guān)聯(lián)緊密，校驗(yàn)規(guī)則少、屏幕大則考慮長(zhǎng)頁面填完即走的方式處理。另，長(zhǎng)表單因使用鍵盤頻率高，應(yīng)考慮表單快捷鍵填寫方式。
這兩個(gè)月項(xiàng)目特別緊張，123456的加班，能通過這樣的思考解決日常工作疑問感覺設(shè)計(jì)更有依據(jù)了。
