雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁 案例 服務(wù) 關(guān)于 face+

用戶登錄界面設(shè)計步驟有哪些?分享用戶登錄界面設(shè)計知識

Time: 2021-09-26

       現(xiàn)在很多軟件都是需要賬號登錄這一個部分,那么這個用戶登錄界面設(shè)計是怎么做的?相信各位朋友都是非常想知道的,今天就讓faceui來給大家分享一下用戶登錄界面設(shè)計步驟。

  目前,有兩種主要的登錄類型,一種是通過在網(wǎng)站本身注冊登錄,第二種是使用第三方社交網(wǎng)絡(luò)帳號,目前很多應(yīng)用程序都采用第二種登錄方式,設(shè)計師和開發(fā)者只需要做好登錄按鈕和接口就好了。

  用戶登錄界面流程優(yōu)化細節(jié)

  1、使用電子郵件登錄

  傳統(tǒng)的注冊流程中,不設(shè)置用戶名還是很正常的,而Email通常是必填的項目,當然,兩者都用是比較常見的情況。我想說的是,允許填寫用戶名的地方,應(yīng)該也支持Email輸入。

  我曾碰到過同時支持用戶名和Email登錄的輸入框,但是標注只寫了“用戶名”,這是典型的設(shè)計敗筆。

用戶登錄界面設(shè)計

  圖片來源于網(wǎng)絡(luò)

  問題在于,在不同的網(wǎng)站,用戶通常使用一個Email注冊,但是用戶名各不相同。如果僅僅只能使用用戶名登錄的話,用戶體驗明顯不夠方便。

  2、明顯的錯誤提醒

  當用戶登錄的時候,系統(tǒng)監(jiān)測和反饋信息的方式也是非常值得深究的。當用戶輸入錯誤的時候,系統(tǒng)反饋的信息太多可能會給黑客盜號的機會,而反映信息太少的話,則會讓用戶感到迷惑。

  我們很清楚,用戶輸入錯誤的時候,系統(tǒng)返回給用戶的信息是“無效輸入(Invalid input)”肯定是沒多大意義的。你必須用更通俗的語言來告訴用戶,他們的輸入有錯誤。

  如果你想提供更好的用戶體驗,不妨使用JavaScript來幫助用戶來驗證信息。這樣做最完美的例子就是手機輸入法的糾錯功能,當你輸入“.con”的時候,輸入法會自動糾正成“.com”,或者提供用戶糾錯的機會。當用戶輸入錯誤以及因為輸入錯誤再次輸入的時候,不妨提供準確的說明信息,合理引導用戶。這不僅讓用戶更輕松,也能節(jié)省時間。

  3、加上“忘記密碼?”鏈接

  你可能認為加上“忘記密碼?”的功能是一件理所當然的功能,但是確實有些網(wǎng)站忽略了它?!巴浢艽a”鏈接和登錄框一樣重要,不要隱藏這個鏈接,也不要讓用戶耗盡心神才能找到它。讓它時刻為用戶準備著。它無需放在顯眼的地方,但是它應(yīng)該緊靠著用戶登錄表單,以備不時之需。

  4、讓用戶專注于登錄

  通常,登錄框會以彈出框的形式存在,或者以單獨的登錄頁面而存在。無需跳轉(zhuǎn)頁面就完成登錄確實有其優(yōu)勢,但如果你考慮到頁面中其他元素對于用戶的干擾之時,你就應(yīng)該清楚單獨登錄頁面的必要性。你要向用戶展現(xiàn)內(nèi)容、推薦商品,讓用戶登錄之后再進行更流暢不是嗎?當用戶進行注冊、結(jié)帳的時候,通常都是單獨頁面,讓用戶專注做一件事情,那么這種設(shè)定理當延伸到登錄界面。相比于復雜的內(nèi)容頁,登錄頁面的內(nèi)容更少,加載更快,這也是單獨登錄頁面的優(yōu)勢。

  5、標識很重要

  不管什么時候,都不要在提交信息的按鈕上標注“提交”或者“完成”,而應(yīng)該用“登錄”。這很簡單。對于用戶而言,這會讓用戶明白他們的操作和預(yù)期是一致的,盡管對于系統(tǒng)而言這種行為就是提交信息。

  不僅如此,在登錄框中標明“輸入用戶名或者郵箱”,避免使用占位符或者其他的容易讓用戶迷惑的標識。這些都是增強用戶體驗的重要組成部分。

用戶登錄界面設(shè)計

  圖片來源于網(wǎng)絡(luò)

  用戶登錄界面設(shè)計步驟有哪些

  1.在桌面上,鼠標左鍵雙擊程序,打開VB編程軟件,在左邊工具欄上,單擊【Label】按鈕,在Form1窗口上繪制出兩標簽,用來寫文字的說明。在這里寫上用戶名和密碼。

  2.接著,根據(jù)窗口的大小,感覺文字小了,可以在Label屬性窗口上,修改Font屬性值,單擊其選擇按鈕就可以更改字體的大小了。

  3.然后,在彈出的字體對話框中,選擇四號字的大小,單擊【確定】按鈕后,就可看到Form1窗口上用戶名的字體變大了。密碼的字體大小也如此操作。

  4.接著,在程序左邊工具欄上,單擊【TextBox】按鈕,在Form1窗口上繪制出兩文本框,并在TextBox屬性面板上,修改Text的值,將其清空

  5.然后,在程序左邊工具欄上,單擊【CommandButton】按鈕,在Form1窗口上繪制出兩命令按鈕在其屬性面板上,將Caption的值改為確定。另一個改為取消。

  6.最后,在程序左邊工具欄上,單擊【Image】按鈕,在Form1窗口上繪制出兩圖框,并修改其兩處屬性值,選取兩個圖標后,將它們重新布局的更好看些后,單擊運行,登錄窗口就出現(xiàn)了。

  用戶登錄界面設(shè)計步驟有哪些?以上就是faceui給大家解答的相關(guān)的問題,看完后,大家是不是覺得這個用戶登錄界面設(shè)計有點簡單呢?感興趣的朋友,不妨去嘗試做一下吧。

合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號22號樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點地圖
北京辦公地點地圖
深圳辦公地點地圖
在微信中搜索faceui
或保存二維碼在微信中打開