大多數(shù)情況下，APP的登錄界面決定了客戶對APP的第一印象，所以在進行APP登錄界面設計時一定要格外用心，設計出一個無瑕疵且吸引人的登錄界面才可讓客戶對使用APP有更加強烈的興趣。下面faceui為大家分享一下APP登錄界面設計時應該包含的幾大要素，希望對您有所幫助。

　　APP登錄界面需要包含的幾大要素

　　一、背景的選擇

　　1.純色背景：整體上看起來非常的干凈。

　　2.毛玻璃效果：要控制好效果，注意顏色搭配，否則會看來有點“臟”。

　　3.漸變色。

　　4.蒙版背景圖片：要注意背景圖片的選擇及蒙版的透明度，否則容易造成輸入框和按鈕辨識度降低。

APP登錄界面設計（圖片來自網(wǎng)絡）

　　二、上半部分（即輸入框的上面）

　　當前主流的App登錄界面一般不顯示標題欄，界面整體顯示大方，空間感強，上半部分一般展示圖片（可能是應用的logo）、文字（應用的名稱或一個體現(xiàn)App的短句）或者圖片加文字的方式。

　　三、輸入框和登錄按鈕

　　1.純輸入框，里面有輸入內(nèi)容的提示文字

　　2.輸入框增加一個小圖標，用來標識需要輸入的內(nèi)容

　　3.輸入框前或輸入框中帶title

　　四、注冊鍵位

　　只要兩種表現(xiàn)形式：按鈕和文字。位置一般在登錄按鈕下方。一般更傾向于按鈕，因為使用頻率比較高。

　　五、忘記密碼鍵位

　　大都采用文字展示，畢竟這個功能的使用頻率較低，相對于登錄和注冊是最不重要的功能，一般會放在登錄按鈕的下方，部分App會放到登錄按鈕和文字框之間，居左放。

　　六、聯(lián)合登錄鍵位

　　一般會放在登錄界面的最底部，有些App會放在登錄按鈕之下，注冊按鈕的上方（畢竟聯(lián)合登錄也屬于登錄）。

　　APP登錄界面設計的兩種思路

　　第一種APP登錄界面設計思路：大眾化設計

　　普通純色背景，元素就是登錄框和密碼框，加上登錄按鈕，這類APP登錄界面設計比較大眾化，中規(guī)中矩。通用的布局就是：上-中-下，上面一般放置企業(yè)形象logo或APP名稱，中間就是登錄密碼框，下面就是注冊信息。這類APP登錄界面的背景是漸變的或者多色塊的。很有扁平化的意境。

APP登錄界面設計（圖片來自網(wǎng)絡）

　　第二種APP登錄界面設計思路：：情感化設計

　　在大眾化設計的基礎上，會加上一些情感化的元素，比如人物頭像，代表這個APP有象征意義的圖標或者背景素材。比如信封，旅游圖片。

　　也有一些APP登錄界面背景會隨著當前的時間來變化背景，如果是白天，背景是簡約而陽光的 如果是晚上，則是深層夜晚星空閃耀的背景如QQAPP登錄界面設計。

　　用戶體驗方面的設計注意事項

　　1、把郵箱和手機號輸入框合并成一個，可縮減用戶的操作步驟。

　　2、用戶名密碼這些必填項在沒有輸入時，登錄按鈕為不可用狀態(tài)，避免誤操作帶來的麻煩。

　　3、輸入框中顯示提示信息的方式進一步釋放了畫面空間，讓整個畫面看起來更加簡潔。但是注意輸入框、提示文字的顏色灰度要把握好，顏色太淺不容易查看。

　　4、畫面中核心流程按鈕突出顯示，其它按鈕則最小化顯示，根據(jù)重要程度將顏色加以區(qū)別。

　　5、輸入框的獲得焦點時突出顯示，以便在多個輸入框時辨別焦點所處的位置。

　　6、錯誤提示直接顯示在畫面中，不以彈出對話框的形式或者toast的形式實現(xiàn)。消息提示框（toast）顯示時間如果短的話用戶可能會看不清楚。

APP登錄界面設計（圖片來自網(wǎng)絡）

　　7、頁面中的輸入框、按鈕等其他重要控件盡可能在彈出軟鍵盤時顯示在手機屏幕上半部分，方便用戶切換、確認等操作。

　　8、注冊/登錄失敗的情況，提示信息盡可能地詳細，是賬戶名出錯還是密碼出錯，或者是手機號已經(jīng)被注冊過了。

　　9、輸入郵箱地址時，可彈出自動補全功能，自動加入常見的郵箱后綴。

　　10、發(fā)送驗證郵件后，可給用戶詳細的說明及操作提示，也可以加入一個按鈕直接跳轉到相應的郵箱。

　　APP登錄界面設計不可馬虎，只有多學多試才能設計出令大家都滿意的產(chǎn)品。更多的ui設計心得可長期關注faceui，若有其他的相關需求也可隨時聯(lián)系我們進行咨詢了解哦。