玩轉UI登陸頁設計！用好這些設計技巧，讓你的App脫穎而出！
時間：2023-09-29 10:54:01 | 來源：網(wǎng)站運營
時間：2023-09-29 10:54:01 來源：網(wǎng)站運營
玩轉UI登陸頁設計！用好這些設計技巧，讓你的App脫穎而出?。好靠頰pp都會有一個登陸頁面，除軟件閃屏之外，登陸頁是用戶在使用一款App時遇到的第一個操作頁面，也是第一個傳遞信息給用戶的媒介，由此可見登陸頁UI設計非常重要。只有美觀、實用的app登陸頁才能留住用戶，從而提高用戶轉化率。本文，Pixso將于大家分享app登陸頁面的優(yōu)秀示例，以及探討登陸頁UI設計技巧。
1. 登陸頁的主要UI設計樣式有哪些
登陸頁功能點梳理在進行設計樣式的分析之前，我們需要先了解的UI登陸頁的功能點，以幫助我們規(guī)劃UI登陸頁面的相關內容以及明白為什么要放置這些內容的原因。
- 登陸注冊流程：第三方登陸、驗證碼登陸/注冊、密碼登陸、找回密碼。
- 賬戶體系配套：關鍵點引導綁定手機、關鍵點強制綁定手機、驗證碼驗證賬號、賬號相互綁定。
常見的登陸頁UI設計樣式運用產品符號或是品牌符號來作為設計主要元素，一是可以傳遞產品的品牌感，二是可以渲染產品行業(yè)屬性特征，設計中將兩個特征同時兼顧，可以以超強視覺沖擊力和氛圍渲染力給予用戶視覺和感官的刺激。
這種設計的氛圍感更強，畫面感更加突出，也更容易讓用戶感知到內容，并對產品初步產生一些認識和理解，是當下較為流行的UI設計樣式！因為圖片比顏色的視覺沖擊力更強，也比較容易感知到產品的用途，所以運用品牌行業(yè)相關的圖片來設計登陸頁面也是一種實用的方法，在此基礎上，加上常規(guī)的登陸路徑和輔助登陸路徑即可。
歡迎語有利于打破產品與用戶初次見面的冰冷感，讓用戶有種賓至如歸的感覺。一般可分為兩種場景，一是用戶初次下載未注冊時，與用戶寒暄；二是歡迎已有賬號的用戶回來。
提示：以上示例均可在Pixso資源社區(qū)的中找到，設計師可一鍵復制，免費使用。Pixso內置騰訊、阿里、字節(jié)、今日頭條、螞蟻設計等優(yōu)秀設計規(guī)范，提供海量設計模板和素材，本地化字體資源，供設計師參考和使用。
2. UI登陸頁的設計技巧
登陸（或注冊）操作會占用用戶的注意力，給用戶帶來“負擔”，因此我們要另用戶在登陸頁面上花費的時間越少越好，最好將信息內容保持在頁面中央，讓用戶一眼看到所有信息，用簡潔的語言指導用戶在特定步驟中明確需要做什么（那些幽默但復雜的行話、專業(yè)術語和華麗的語言在登陸體驗中是不實用的），提供給用戶清晰的路徑，使他們能夠方便高效地找到所需的內容，減輕用戶的思考。
焦點設計突出CTA按鈕是焦點設計的好方法。CTA按鈕的目的是吸引用戶的注意力，提高轉化率。因此，按鈕越大，用戶越有可能找到并點擊它，但它不宜太大，以避免破壞視覺組合和布局層次結構。
最佳按鈕應根據(jù)頁面比例進行設計，以便用戶更好地識別它們。使用產品的主題色，可以讓登陸動作的CTA按鈕突出，聚焦用戶的目光，促成用戶行動。
移動端社交軟件設計素材明確反饋并提供幫助在登陸過程的每個階段，用戶都可能會失敗。比如錯誤的輸入電子郵件地址，密碼和網(wǎng)絡問題等，所有這些都可能導致登陸意圖直線下降。因此，登陸頁面最好以合適的方式回應用戶，清晰、及時地反饋錯誤消息。
設置輸入框提示語是方法之一，措詞需要簡潔，大部分的做法是點擊輸入框后，提示語會自動消失。賬號后綴關聯(lián)的提示也能減輕用戶負擔，如示例中針對使用郵箱注冊，比如說在用戶填寫賬戶名輸入
@ 的同時，關聯(lián)出
@qq.com、
@163.com 等，可以減少用戶的輸入，體驗也會更好。
WeUI 微信小程序組件庫（淺色）Toast提示一般用于告知狀態(tài)以及有錯誤發(fā)生的情況下，比如賬號不存在、賬號已被占用、密碼錯誤、驗證碼錯誤等，及時的反饋給用戶注冊登陸不成功的地方在哪里，以免用戶摸不著頭腦，失去耐心而離開應用。
提供靈活的多種登陸方法在登陸頁面的設計上，我們最好提供兩種至三種登陸方法供用戶選擇（添加過多方法容易讓頁面顯得混亂，反而有可能降低用戶登陸意圖，因此限制在三種左右是比較合適的）。
登陸方法通常有電話號碼登陸、電子郵箱登陸、第三方社交賬號登陸（如微信、微博、QQ等）以及人臉、指紋生物識別等，在登陸方法的選擇上，需要先對平臺的特點以及目標用戶進行必要的摸查了解。適當?shù)膫€性化可以促進用戶的好感，例如: 如果用戶是通過電子郵件跳轉來的，則提供帶一次性鏈接選項的一鍵電子郵箱登陸。
恰當?shù)陌踩捅Ｃ芴嵝?/b>
登陸涉及用戶輸入敏感的個人數(shù)據(jù)，例如電子郵件、密碼和電話號碼，當用戶選擇以個人的數(shù)據(jù)來交換產品的使時，就代表用戶還相信設計人員和開發(fā)人員所能實現(xiàn)的功能，足以抵御數(shù)據(jù)攻擊。為了不辜負用戶的選擇和信任，用戶體驗設計師可以通過諸如鼓勵用戶選擇更強的密碼，并提醒用戶避免在網(wǎng)上發(fā)布過多個人信息等功能，來增強安全性。
如上述示例，在用戶注冊賬號時會給出密碼強度的參考，如“弱”、“中等”、“強”等提示。為了好記，大多數(shù)用戶密碼強度到中等就不加以復雜化了，但有了提醒后，許多用戶會為了安全盡量選擇更“強”的密碼。此外，登陸賬號時，采用星號或圓點的形式來顯示，讓用戶得到我的密碼不會被人看到的心理暗示，也能予以用戶安全感，提高對產品的信任度。
3. 小結
綜上所述，登陸頁面發(fā)展至今已經(jīng)有了較為成熟的設計規(guī)范，UI元素相對固定。但往往正因為登陸頁面看似很簡單，導致容易受到設計師忽視，實際上它的地位是不可忽視的，登陸頁的交互方式和細微之處還需要我們多多思考，不同的產品需要根據(jù)自己的屬性來選擇符合自己的方式。
看到這里，相信你對登陸頁已經(jīng)有了自己的想法，打開Pixso試試看吧！
在線咨詢
