- 原文地址：Getting the login page right
- 原文作者：Boluwatife Ben-Adeola
- 譯文出自：掘金翻譯計劃
- 譯者：Lisa
- 校對者：changkun horizon13th
使登錄頁面變得正確
事先聲明，這篇文章討論的是目前登錄頁上已采用的設計，而不是討論關于如何設計的新見解。常言道：「普天之下，莫非舊聞」，但如果我們連歷史都不曾了解，又如何能知道它會去向何方呢？好啦，這個理由已經足以支撐我寫下這篇文章了。
因此，一般結論是：創建登錄/注冊頁的藝術（沒錯，它是一門藝術）不是隨意的！或者至少不應該只是為了獲得最佳結果。App 的整體體驗是一個非常重要的因素，應該符合整個 App 的當前目標。
接下來，我將就決定登陸頁的布局因素進行討論。
1 ) 訪問的平臺：網站還是 App ？
訪問平臺的影響基于一個相當顯然的事實：大部分訪問桌面端版本的用戶是新用戶。這些人希望在決定使用他們時間（和帶寬）來下載本機 App 之前，先了解一下你是做什么的。App 是一種忠誠工具，這是一條經驗法則：當人們欣賞你的服務，并希望享受 App 提供的所有優點，如即時通知和其他功能時，人們會下載它。也就是說，大多數訪問 App 的用戶都是老用戶，而大多數訪問網站都是新手，這個假設是有意義的。那么這個經驗是如何告訴我們，當這兩個群體訪問各自的平臺時，該怎么構建第一頁呢？為了具有深刻的印象，我另起一個段落：
為本地 App 創造一個以登錄為中心的頁面，為桌面版本構建一個以注冊為中心的頁面！
這樣做的目的僅僅是為了分別迎合兩種群體中的大多數人。
舉幾個在工作中運用這個規則的例子，以免你錯過它。
紅色框是用于登錄的空間，紫色是用于注冊的空間。
正如你能夠從圖片中看到的那樣，就在每個頁面上各自分配的空間方面，相對于登錄來說，頁面對注冊有明顯的偏好。
與以上的圖像相同，相同的顏色約定在這里被運用。
在相同網絡下，移動 App 的情況卻是恰恰相反的！
2 ) 網絡規模
有一種情況，通常在網站中，你會有兩組訪問者，包括老用戶和新用戶，他們平等地聚集到相同目的地。但是，你應該不會同時擁有兩個群體相同程度的涌入。這意味著當你剛剛推出你的服務時，你肯定會（希望）擁有很多新用戶，而不是那些現有的用戶（ beta 測試人員和開發團隊）。那么，你認為誰才會讓你的準備更有意義呢？當然是新用戶，那么怎么辦？下面是另一個教學時間，且聽我慢慢道來：
在你的平臺的早期階段，應該創建一個以注冊為中心的頁面！
很明顯，很多設計師（大部分是開發人員）只是提供了用于登陸頁面的常見模板，即登錄頁面。但問題是，為什么你看到這個給你靈感，決定你的 App 也應該如此的 App 界面的唯一原因，是因為該 App 已經有一個成熟的社交網絡！這就是為什么你首先就想要使用它！所以當我們喜歡的網絡剛剛成長和需要數字時，我們大多數時候看不到它們，就像我們現在一樣。所以你不是從錯誤的人那里得到建議，只是在錯誤的時間運用它。也許如果我們回到這些平臺最初的樣子，看看他們在你現在所處的位置，那么你會有想法去做什么。
你真幸運，我碰巧擁有一個哆啦A夢（對于那些不幸的沒有看過這部電影的人，我正在談論一臺時間機器），并會幫助你及時回到那些最好的網絡最初的樣子。
1?—?2008, 2?—?2009, 3?—?2012.
是的，它就是 Twitter .
1–2008?—?這是他們第一次的登陸頁面，剛剛推出了新的想法，登錄形式幾乎沒有裝飾和邊框（字面上）。但是，通過一個鮮艷的召喚點擊的按鈕告訴你注冊，另一個紅色 CTA 按鈕告訴您觀看演示視頻，你會看到它們正聚焦在告訴你新平臺是做什么的，不是太注重登錄，是因為他們知道現在的焦點是吸引他們的第一批成員。對于少數已經加入的人呢？他們可以弄清楚登錄表單的位置。
2–2009?—?好的，他們得到了一些關注和可觀的成員數量，幾乎立即（推出一年后）為現有用戶進行了更多的考慮，現在已經有合理的數量來關注 UI 功能了。但是注冊按鈕仍然在中間至高無上的位置，在充滿活力的檸檬綠色中。
3–2012?—?從按鈕開始，我們在這里！所以他們現在有穩定的新來者和更多的現有用戶。這在登陸頁面上如何反映？通過對新老用戶給予同等的關注。為什么？因為新用戶必須始終照顧，而現在的用戶群體太多，以至于無法忽視和不能悉心照顧，這樣可以確保所有用戶都能繼續使用并愛上這個平臺！
所以你會發現一個問題可能會發生，當一個設計師四處尋找新網絡登錄頁的好概念時，當他發現了 Twitter 并對自己說：“天才！把登錄和注冊頁面放在一起！讓我們也這樣做把“。但是，呃...不行！由于你不能細致的了解 Twitter 用戶的新舊用戶比例，因此你不能采用他們的方法。在這個故事得到教訓了嗎？好吧，又到教學時間了！所以通常的方法是：
觀察學習對比過去和當前的設計，有時會更加明智。
3) 特殊情況
當然，總是有那些不符合你發現的模式的人，讓你看起來像是破解了所有 UI/UX 的代碼。不，他們必須沖在前面，打破規則，做自己的事情。這些包括像 Facebook 這樣的登錄頁面，盡管用戶數量龐大，但仍然傾向于新的注冊用戶。就像我們自己的 Medium ，由于處于用戶群體增長的早期階段，甚至他們的本地 App 都是以注冊為中心。但是我們可以理解他們的方法思想。所以我猜這是符合用戶基數大小的規則 (#2).
好的，那么最后的消息是，不要像不值得思考的登記頁面一樣對待登錄／注冊頁面，因為每個設計決策，無論多么平凡，都值得你去深思熟慮。最后的話...與團隊的其他成員交談，聽整個產品的策略，看看你的設計決策如何幫助他們從一開始實現所有這一切，從我們的第一個但通常被忽視的朋友開始 - 登錄頁面。或注冊頁面，作為戲劇性的結尾，我必須只使用它們中的一個。 :-)
掘金翻譯計劃 是一個翻譯優質互聯網技術文章的社區，文章來源為 掘金 上的英文分享文章。內容覆蓋 Android、iOS、React、前端、后端、產品、設計 等領域，想要查看更多優質譯文請持續關注 掘金翻譯計劃。
