2023年7條準則提升用戶登錄成功率

條準則，提升用戶登錄成功率！登錄頁面的設計或許看起來很簡潔。我在2022年花了相當多的時間為一家社交媒體巨頭設計登錄和注冊流程，并從中了解到：海量的思索和測試才能確保用戶勝利和輕松的登錄。

以下是我總結出來的重要閱歷。

什么是登錄？

登錄是進入一個應用程序、網站或服務的入口。關心用戶建立他們的賬戶。

一個登錄流程通常包括一個主要的登錄頁和一個相當簡單的重置流程，其中包括遺忘密碼、重置密碼和其他登錄方法。登錄的首要目標是確保用戶勝利登錄到他們的賬戶。什么是登錄目標？

讓我們花點時間來定義一下“登錄目標”這個術語，這是在做設計決策時的關鍵。

登錄目標是指用戶進入登錄流程的意愿。以有聲思維來表達，它可以是我想登錄、我想檢查我的電子郵件、帶我去那里，等等。

當用戶進入到登錄頁時，他們可能沒有登錄意愿。可能會產生“嗯，我不在乎，以后再做”或“這太麻煩了”或“呀，我現在該怎么辦？”的想法。遺忘密碼、半路遇到困難或切換到另一個頁面/設備，都可能是缺乏登陸意愿的跡象。?

保留或增加登錄流程中的登陸意愿是很好的目標，下面的準則都是為這個目標量身定做的。

Pinterest有一個傳統(tǒng)的、居中的掩蓋式登錄頁。

它有一個亮紅色的主要登錄按鈕，并供應Google和Facebook作為額外的社交登錄選項。

滑到最終——有我對網絡上流行的勝利登錄閱歷的總結。這就把我們帶到了下一個問題——創(chuàng)新的界限在哪里？

登錄是一個品牌展現的絕佳機會點。在視覺上，它可能使用品牌色、品牌照片、品牌插圖，甚至是營銷信息。和大多數設計問題一樣，登錄頁品牌展現的關鍵在于平衡。

登錄操作應當始終占據中心位置。頁面上的其他元素必需謹慎規(guī)劃好，不應當奪走登陸操作的留意力。一條優(yōu)秀的閱歷之談：用戶在登錄頁面上花費的時間越少越好。關心他們連續(xù)前進，盡快發(fā)覺產品中的優(yōu)點和價值。

Facebook在頁面中保持用戶信息在右側，并將恢復流程分解為多個步驟。

亞馬遜把它的恢復流程分解成多個步驟。

它將次要的恢復選項設置為我需要更多關心的可擴展部分，這有助于保持留意力集中在主要操作。

保持留意力集中在主要操作的技巧：

登錄框可以布局在一個主頁、疊加頁，或一個獨立頁面。使用卡片式布局。將操作分為主要和次要操作。使用一個大而醒目的登錄按鈕。盡量削減次要操作的數量——避開消失任何與核心登錄操作無關的內容。

錯誤信息包含有用的提示/示意，指明你在失敗時可以做什么

當你密碼登陸失敗，但你有一個GmailID時，Facebook會增加一個用Google賬號登錄的功能

指導用戶恢復的技巧：

鼓舞用戶嘗試合適的替代方案。在用戶失敗后，支配替代的登錄方案，同時將用戶導航至一個獨立的頁面。在文本中展現出最有用的登錄方案，并在消失錯誤時對用戶做出樂觀響應！

在此供應Medium登錄頁的案例——雖然清楚且設計良好，但它的確有太多的登錄方法。不得不回訪Medium的設計者，假如這個設計對他們來說是好的！

無密碼登錄正火速流行起來。特殊對于只有移動端的應用程序來說，基于電話號碼的認證已常態(tài)化。指紋和FaceID在很多地方消失，使認證流程變得快速、平安。為平臺找到最適合（且可開發(fā)）的方法，并將其作為主要登錄選項。

Google（谷歌）打破了標識優(yōu)先的格式——改成了分步式登錄模式，在不同的步驟中輸入電子郵件和密碼。這種模式對于Google有平安優(yōu)勢，也可以使他們在接下來的步驟中為用戶供應共性化的選擇。頁面也是最小的、全白的、聚焦的。

Uber的登錄頁是簡潔且聚焦的，允許用戶輸入他們的電話號碼并進入下一步。

Facebook有幾個登錄方案，他們用這些方案進行試驗和A/B測試——這是一個右對齊的登錄框案例，它很好地突出了重點。左側的空間被用來打造樂觀的品牌形象——總體來說是勝利的登錄體驗。

Pinterest做了一個簡潔居中的疊加表單，有碩大的輸入框——不斷吸引用戶！還有一個亮紅色的登錄主按鈕，以及一些額外的社交登錄選項。

盡管Airbnb（愛彼迎）在許多方面都做得很好，但它的登錄頁讓人感到操作繁多——這或許是由于基于手機號碼登錄，或許是由于大量的次要登錄選項，導致相當多的認知負荷！

LinkedIn（領英）很好地保持登錄框的簡介、聚焦和居中，有一個醒目的主登錄按鈕。

我對Dropbox的登錄頁面持遲疑態(tài)度——插圖很好看，但它的顏色與界面按鈕的顏色相像——這是附加元素分散留意力的案例。就我個人而言，我喜愛在界面中大膽使用插圖——但評估插圖的使用環(huán)境也很重要。

Amazon（亞馬遜）的登陸頁視覺設計上有些老舊，但對于管理用戶留意力是一個很好的案例——巨大的黃色“連續(xù)”按鈕以及頁面上沒有任何干擾，使登錄任務看起來簡潔快速。

在登錄頁面上放置廣告可能不是一個好辦法——但同時Yahoo（雅虎）有一個與眾不同的標識在登錄框中，其中設計了一些奇妙的功能，關心用戶削減輸入。(參考下圖)

我想把Figma納入優(yōu)秀的登錄案例中——該頁居中于浮層，Google登錄被突出展現（或許是Figma的首選和推廣的登錄形式？），它特別簡潔，幾乎是線框式的。用戶體驗特別好。

感謝我的產品合作伙伴Apurva和我一起學習。實行微小的