
表單設計中,各種設計模式和技巧已經越來越成熟了。在諸多設計技巧當中,懸浮標簽這一設計手法,應該是對于用戶體驗提升最明顯的一種。今天主要給大家分享ui界面表單設計內容,希望對你們有幫助!
1.固定標簽允許用戶瀏覽更多內容
雖然只有四個字段,但是當你采用頂部固定標簽時,用戶實際上需要瀏覽更多的內容,因為有8個元素要查看。
要輸入的標簽和空白字段是完全分開的8個元素,當用戶的視覺在處理信息時,會自然感到信息相對密集,并且要處理的內容相對多。
2.提交數據前的最終檢查
表單填寫完成后,用戶通常會在提交前快速檢查其內容的正確性。用戶必須上下掃描輸入內容和相應的標簽來匹配,以確保填寫的字段是正確的。這時,輸入框的邊界會擋住視線,即使空間關系是根據相關元素的鄰近原則設計的,在這個過程中也不會顯得如此清晰和明顯,所有這些都將使最終的檢查工作變得不那么迅速。
此外,還有一種設計模式,是讓標簽作為占位符放置在輸入框中,當用戶單擊輸入時,標簽會自動消失。這種設計很簡單,但是用戶在輸入時很容易忘記需要輸入哪些字段,也會導致問題。
第三種解決方案是我們現在所說的懸掛標簽,它結合了前兩種方法的優點,并成功地避免了兩種方法的缺點,減少了第一模式的視覺障礙,并且保持了簡約的設計。同時,當用戶輸入時,標簽將自動浮動不會消失,不會讓用戶迷茫。
3.字段和焦點
在表單設計中,視覺焦點控制也是一個非常重要的因素。當用戶在輸入過程中連續在輸入框和鍵盤之間切換時,在輸入完成后檢查輸入內容,以確保正確填寫所有字段。
在這種情況下,我們可以比較前面提到的三種模式下的視覺識別程度:
第一種是頂部固定標簽設計,字段突出,標簽的識別度不足;
第二種是當用戶輸入時,字段消失。在這種模式下,字段足夠突出,但文字標簽完全不見,用戶無法判斷輸入內容是否滿足要求;
第三種是浮動標簽,標簽和字段內容有顏色和大小的區別,而邊框和標簽圍繞著字段,主次分明。
4.提交時報告信息出錯
在這三種模式下,當用戶輸入錯誤時,表單需要立即報告錯誤,并讓用戶調整內容進行填寫。然而,在這種要求下,頂部固定標簽和浮動標簽的設計模式可以更清晰地傳遞錯誤報告信息,而隱藏標簽的設計只能通過輸入框的顏色來識別,相對識別性較差。
手機瀏覽
全國
19974831731





