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

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

UI設計的登錄頁面怎么做?分享登錄頁ui設計指南攻略

Time: 2022-01-18

    說起登錄頁面相信大家是最熟悉不過,現(xiàn)在我們上網聊天或者是上網辦理業(yè)務的時候,都是需要做一些賬號登錄的操作認證,那么這個登錄頁面是怎么做的呢?今天就讓faceui給大家?guī)硪幌玛P于登錄頁ui設計知識。感興趣的朋友進來看看吧。

  UI其實是一個廣義的概念,《現(xiàn)代漢語詞典》將“界面”定義為:物體與物體之間的接觸面,泛指人和物(人造物、工具、機器)互動過程中的界面(接口)。以車為例,方向盤、儀表盤、中控都屬于用戶界面。從字面上看由用戶與界面兩個部分組成,但實際上還包括用戶與界面之間的交互關系,所以可分為三個方向,用戶研究、交互設計、界面設計

  登錄頁ui設計指南攻略

  一、注冊登錄方式

  1.只使用第三方賬號注冊登錄

  這種方式是最快捷的登錄方式,省去了手機注冊的繁瑣操作,幫用戶提高效率,節(jié)省時間。

  2.只使用手機號注冊登錄

  使用手機號+獲取驗證碼是目前最常用的注冊登錄方式,通過發(fā)送短信獲取驗證碼在60-90秒內進行注冊登錄,這么做是為了確認用戶擁有該手機號的使用權。

  手機號+驗證碼是比較簡便的登錄方式,手機號+密碼是比較常用的登錄方式。在輸入手機號后,為了讓用戶查看是否輸入正確,建議手機號顯示樣式為3-4-4模式(如186 3464 ****)

  手機號也是商家進行用戶維護的有效手段,可以在節(jié)假日發(fā)送祝福或者促銷短信,也可以在用戶長期未使用產品時進行短信提示,避免用戶將產品遺忘。

登錄頁ui

  登錄頁ui

  3.使用手機號+第三方賬號注冊登錄

  這種樣式是上面兩種樣式的結合,一般這樣的組合方式是希望用戶使用手機號注冊,所以手機注冊登錄比較突出,第三方注冊會置于頁面底部弱化處理。

  還有一類APP是希望用戶使用第三方登錄,弱化手機號注冊登錄。比如阿里旗下的閑魚、一淘、飛豬等,登錄時為了用戶數據之間的連接,會推薦用戶使用淘寶賬號進行登錄,從而弱化了手機號注冊登錄,這是出于產品屬性方面的考慮。

  4.使用郵箱注冊登錄

  使用郵箱進行注冊登錄是以前PC端常用的方式,一些又有移動端又有PC端的產品會使用。

  5.先體驗后注冊登錄

  一開始用戶可以游客狀態(tài)進入使用產品,當用到添加、收藏、關注、評論、購買等功能就必須要進行注冊登錄了,這種方式一般多用于閱讀類、游戲類或是電商類產品中。

  這種方式對新用戶的產生有積極作用,很多用戶在不了解產品的情況下,可能只是想初步了解一下產品,又不想進行手機注冊,所以會先進入熟悉一下產品,待初步使用了解后,再通過引導讓用戶進行手機號的綁定。

  二、注冊登錄頁面設計要點

  1.分步驟注冊登錄

  先輸入手機號,UI設計中登錄頁的設計指南點擊“下一步”的同時,系統(tǒng)查詢該手機號是否可以注冊,通過的話則進入輸入驗證碼頁面,這樣做的好處是可以及時反饋給用戶,避免用戶在輸完手機號和驗證碼之后出現(xiàn)錯誤toast的情況。

  需要注意的是步驟不宜過多,建議3步以內。

  2.注冊登錄合二為一

  這種方式是將注冊和登錄合到一起,如果是第一次使用,只要輸入手機號再填寫驗證碼就相當于注冊成功了。

  3.彈窗登錄

  在用戶使用必須要登錄才能用的功能時會跳出彈窗登錄界面。

  三、注冊登錄頁面常用背景樣式

  注冊登錄頁面常用背景樣式可分為以下六大類:白色背景、輕裝飾背景、純色背景、全屏大圖背景、半屏圖片背景、插畫背景。

  1、白色背景

  使用白色背景是目前較為常見的設計樣式。頁面以信息錄入為主,不做過多裝飾。

  多用于體量比較大的APP中,主要目的是提高登錄頁面的操作效率,所以沒有多余的點綴。如下圖所示:

  2、輕裝飾背景

  輕裝飾背景會添加一些品牌設計元素或裝飾來體現(xiàn)界面細節(jié),增加產品品牌感。

  輕裝飾背景常見的有以下幾種處理方式:

  1、取產品相關元素進行裝飾。

  2 背景做模糊處理增加界面層次感。

  3、加入意向類的圖片。

  4、 添加幾何元素進行裝飾。

  3、純色背景

  純色背景多采用品牌色,也可搭配Logo進行設計,體現(xiàn)品牌感。

  該方式多用在登錄信息簡單或者以第三方登錄為主的界面中,在不干擾用戶視線的基礎上豐富頁面,采用品牌色進行設計,同時可以看出他們的登錄信息都較少,在視覺設計上也較為簡潔。

  4、全屏大圖背景

  全屏大圖背景就是在登錄信息下方平鋪一張與產品相關的圖片。

  優(yōu)點:圖片更容易吸引人的注意力,視覺上更有沖擊力,也能提前給用戶一個心理預期。

  缺點:信息和背景融合較高,視覺干擾比較大,多用在垂直類的APP中,對于一些體量較大的產品不太適合。

登錄頁ui

  登錄頁ui

  5、半屏圖片背景

  半屏圖片和全屏圖片有些類似, 都是通過意向圖片傳遞產品品牌感,不過半屏圖片重點是以登錄信息為主。

  6、插畫背景

  插畫背景就是自己繪制品牌識別元素或者和品牌相關的元素作為背景。

  優(yōu)點:插畫更有親和力,更能與用戶產生情感共鳴。

  缺點:繪制成本較高,比較費時間。

  以上就是faceui給大家?guī)砹岁P于登錄頁ui設計的一些基本知識,看完后,相信各位朋友都應該清楚的了解到企業(yè)做UI設計中登錄頁是非常重要,這也是為了讓企業(yè)能夠擁有在自己的行業(yè)中脫穎而出。

合作咨詢

上海(總部)

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

辦公地址地圖

北京

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

辦公地址地圖

成都

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

辦公地址地圖
首頁 | 案例 | 服務 | 關于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

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