轉(zhuǎn)載藍藍設(shè)計(   www.shtzxx.cn  )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供有效的   BS界面設(shè)計 、 cs界面設(shè)計 、  ipad界面設(shè)計   、  包裝設(shè)計 、  圖標定制 、  用戶體驗 、交互設(shè)計、   網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

來源：http://www.uisdc.com/100-things-you-should-know-about-design

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中，   請點這里

關(guān)于登陸估計大家每天使用的都很頻繁了，每次上網(wǎng)都會習(xí)慣性登陸下微博，淘寶，郵箱，空間等，在每天進進出出無數(shù)門戶的時候有誰又曾在密碼不錯誤的情況下停留在WEB登陸頁面是的界面設(shè)計看一眼呢？下面藍藍設(shè)計就和朋友們就談?wù)勥@道不起眼的門。

從公共平臺的角度看

用戶活躍度是檢驗產(chǎn)品成功與否的重要指標之一，傳統(tǒng)行業(yè)的商家極為重視門面的裝潢，因為一個好的門面可以聚集人氣，招攬更多的顧客。古時候的大戶人家院子門口的石獅子或其他的擺件的擺放極為講究，有一定的風水學(xué)說道理，更能彰顯主人家的身份地位.由此可見，“門面’就如人的臉面之于人的形象一樣重要，而WEB的登錄頁面就相當傳統(tǒng)的“門面”。

從個人博客的角度看

個人登陸頁面一般只有自己會用到，所以別人基本是看不到的，但也不排除像我一樣無聊什么都好奇的人存在，什么都想看看，什么都想改改的。那么個人登陸頁面的設(shè)計就完全是抒發(fā)個人情感，體現(xiàn)自身個性的一個地方，你完全不需要在乎它的交互是否友好等問題。你的地盤你做主。

各大網(wǎng)站的WEB登陸

現(xiàn)在越來越多的大型網(wǎng)站把登錄和首頁放在一起設(shè)計，由此可見登錄頁面的重要性，一個出彩的登錄界面，將提升產(chǎn)品的品質(zhì)，賦予產(chǎn)品獨特的氣質(zhì)，登錄界面也是一個發(fā)揮情感化設(shè)計，提升用戶體驗，拉近與用戶之間距離的兵家必爭之地，本文不談趨勢，不講交互大道理，不涉及技術(shù)，就侃侃用戶登錄頁面的一些設(shè)計表現(xiàn)形式。希望這些設(shè)計表現(xiàn)手法能給大家?guī)硪恍﹩l(fā)和靈感。

優(yōu)雅大方

如果說iPad是介于傳統(tǒng)電腦和手機之間的產(chǎn)品，那么tumblr則是介于blog和twitter之間的服務(wù)。相比twitter，它的功能更復(fù)雜、內(nèi)容展示性更強、更加重視多媒體的應(yīng)用。Tumblr做為輕博客的鼻祖，帶來一種全新的視覺體驗， 安東尼·德·圣-埃克蘇佩里曾說過，“完美就是多一點則太多，少一點則太少。” Tumblr的登錄頁面沒有過多的視覺干擾，優(yōu)雅大方，一切元素的存在都是為了用戶更好的登錄，登錄過程非常流暢。

精致的質(zhì)感表現(xiàn)

iCloud是蘋果公司所提供的云端同步服務(wù)，用戶有5GB的免費存儲空間。 負責Macintosh用戶界面設(shè)計的柯戴爾·瑞茨拉夫回憶說：“喬布斯會一個像素一個像素地檢查屏幕上的每個細節(jié)，確保相關(guān)的圖像準確對齊。他非常重視細節(jié)，細致程度居然達到了像素的層面。如果發(fā)現(xiàn)問題，喬布斯就會立即沖著某個工程師大吼起來。”iCloud登錄頁面的設(shè)計繼承了蘋果公司對細節(jié)的苛求, 細致的紋理，微妙的陰影，精致的質(zhì)感，完美的細節(jié)，金屬光澤可以隨著鼠標指針移動，底部的圖標可以隨著分辨率的大小自適應(yīng)，改變排列方式，確保用戶的瀏覽體驗。

iCloud給我們上了很好的一課，有句大家都聽過卻未必做到的話——細節(jié)決定成敗，豐富的細節(jié)可以提升設(shè)計的價值，也是判斷一個設(shè)計高下的一條很重要的標準之一，精致舒適的質(zhì)感紋理，給用戶一種沉浸式，充滿驚喜的登錄體驗，是一種很棒的表現(xiàn)方式。

小清新的插圖

在網(wǎng)頁設(shè)計中，插圖非常具有表現(xiàn)力，它與繪畫藝術(shù)關(guān)系密切。所以大部分設(shè)計職位，對手繪能力出眾者格外青睞，許多表現(xiàn)技法都是借鑒了繪畫藝術(shù)的表現(xiàn)技法。插畫藝術(shù)與網(wǎng)頁設(shè)計的的結(jié)合，具有獨特的藝術(shù)魅力，從而更具表現(xiàn)力。越來越多的設(shè)計師，將插畫運用到網(wǎng)頁設(shè)計中來，生動有趣溫情的清新插圖，能迅速的抓住用戶的眼球，讓登錄界面的更加具有親和力，

163郵箱的登錄頁面就采用了大幅的插圖,小郵差很快喚醒了80后等待來信的記憶，有故事的插圖與用戶建立情感的聯(lián)系，喚起用戶的心靈共鳴，讓用戶更有歸屬感。

Vimeo是一家提供高清視頻存放服務(wù)的網(wǎng)站，在這里可以找到很多來自世界各地非常有創(chuàng)意的設(shè)計師。相信登錄過Vimeo的朋友都對Vimeo的登陸頁面記憶深刻。

天貓和淘寶的話做為中國最大的在線交易平臺的話，也是非常注重登陸頁面的設(shè)計，而且還在登陸窗口下面設(shè)置了一個 ”登錄頁面”改進建議 按鈕，可以看出淘寶是非常注重用戶體驗設(shè)計的.天貓的話就更多注重品牌化.

人文關(guān)懷的品牌傳達

設(shè)計以人為本，以人為本的設(shè)計不僅能提高產(chǎn)品的品質(zhì)，還能提高設(shè)計的藝術(shù)水平，而登錄頁面是體現(xiàn)人文關(guān)懷，傳播品牌理念的絕佳位置。

QQ郵箱登陸頁面每一次刷新都能看到不同的內(nèi)容，或用海子的詩，或用邁克爾.杰克遜的歌詞，喚起用戶的共鳴，設(shè)計手法簡潔，主體信息突出，引導(dǎo)清晰，并沒有多余的元素，界面中最重要的操作“登錄”按鈕使用了交通中通行的綠色，而沒有使用常用的藍色，細節(jié)設(shè)計非常考究，對每個細節(jié)都注入人文的關(guān)懷。

新浪微博將登錄框設(shè)計成一條圍脖的樣式，用戶的每一次登錄都是一次品牌傳達的過程，切合新浪力推的圍脖品牌理念，織圍脖的概念深入人心。不過如今新浪開始走營銷路線，就連登陸頁面也不忘加個廣告位.讓你每一次進入都感覺像是登陸了最大的營銷平臺.

越來越大的登錄框

越來越大的輸入框設(shè)計，讓用戶輸入起來感到心情舒暢，登錄過程非常愉悅，在顯示器越來越大的今天，mailchimp大輸入框顯的霸氣十足，并且一反常態(tài)的可以看到自己的密碼，第一次在WEB登錄框里見到這種設(shè)計，非常貼心.正是這種不拘一格的設(shè)計，讓mailchimp從一個內(nèi)部項目蛻變成一個該公司最成功的商業(yè)產(chǎn)品。

簡約而不簡單

WEB設(shè)計的風格越來越趨向于簡潔，登錄頁面大量地使用留白可以讓登錄框更加突出。的減少用戶分心，從視覺的角度來看，簡約的設(shè)計是平靜的，砍掉了多余的元素，顏色，形狀和紋理，不能使用讓人眼前一亮的設(shè)計元素，只能靠空白去做視覺吸引力。布局的權(quán)衡及簡化設(shè)計做的不到位的話很容易變的單調(diào)乏味，wordpress后臺登陸頁面采用適當?shù)耐队埃疑那擅钸\用，以及出錯的抖動提示，讓整個登錄頁面簡約而不簡單.堪稱典范。

隨著互聯(lián)網(wǎng)的高速發(fā)展，移動互聯(lián)網(wǎng)的到來，WEB設(shè)計越來越呈現(xiàn)多元化。盡管一個好的設(shè)計并代表產(chǎn)品就一定會成功，但卻能為產(chǎn)品加分，為產(chǎn)品注入設(shè)計DNA，創(chuàng)造獨特的風格和視覺感受， 好了，今天就先侃到這，作為用戶使用的入口，希望這篇小文可以讓大家對登錄頁面重視起來，設(shè)計出更多精彩的登錄頁面。

對于個人來說我也不忘貼出自己的登陸頁面展示下，抒發(fā)下個人情感。

至于表達的是什么就大家自己體會吧，一幅美麗的蒲公英，在黑夜的月光下隨風飄蕩.看似自由自在，但卻身不由己.每一次登陸博客都能提醒著我.