91网站免费观看-91网站免费看-91网站入口-91网站视频-91网站视频在线观看-91网站下载

SEARCH

夸米動態

三步掌握登錄頁定稿思路

2018-12-12

1、如何進行參考收集?

2、參考收集完后怎么辦?

3、如何選擇符合產品的設計樣式?

 

一、如何進行參考收集?

 

參考收集大家也可以理解為尋找參考,不管是樣式參考還是版式參考,在設計前期一定是會經歷收集的過程。收集可以分為網上資源和項目資源,網上資源也就是大家熟知的花瓣、追波、Behance、站酷、UI中國這些設計平臺,大家可以通過這些平臺了解當前流行趨勢、樣式風格、界面分析等內容獲取幫助。

 

除此之外,我們還可以收集各行業優秀的APP、競品對他們進行分析,因此收集這一步是必不可少的。下圖是我手機上常備的覺得還不錯的APP:

由于這次做登錄界面,因此我首先將這些APP的登錄界面大體過了一遍,了解每個行業的特點。然后我在搜集了一些資源管理和工具類的APP(競品分析是必不可少的)。

 

收集完成后,我們可在每個行業挑選兩到三款APP進行截圖,到這里收集工作也就完成了。(收集工作雖然簡單,但是通過長期積累你會熟知每個行業的設計特點、你知道某個APP更新了,它為什么要更新,更新之后有什么好處等)

 

二、參考收集完后怎么辦?

 

參考收集完后就需要將上面收集到的截圖進行相關的分類(風格樣式分類、展示內容分類等),在設計時由于我們的內容已經確定,因此只需要進行風格樣式分類即可。這里我將登錄界面的樣式分為:白色簡潔、輕裝飾、純色背景、全屏大圖、半屏圖片、插畫背景六大分類。通過分類我們可以了解到不同行業他們采用的設計方式。

 

 

1、白色簡潔

 

白色簡潔風格是目前較為常見的樣式,其目的以信息錄入為目的,多用于體量比較大的APP中,在設計時沒有采用較為復雜的裝飾元素,整個界面以簡潔設計為主,在設計上主要是信息展示的排版設計。如下圖所示:

    

以得到、土豆、拉勾為例,在展示上出入不大,主要設計是信息的排版,得到和拉勾類似采用線條輸入框,居左排版樣式。土豆采用橢圓矩形輸入框,居中排版,同時還加入Logo體現品牌感。

 

 

2、輕裝飾背景

 

輕裝飾背景也就是在簡潔風格的基礎上添加一些品牌裝飾元素,相較于簡潔風格該設計更能體現界面細節,增加界面品牌感,同時也不影響信息的錄入。如下圖所示:

      

輕裝飾在設計上可以有四種展現效果:第一類似網易云音樂和網易美學,取產品相關元素進行裝飾;第二類似好奇心日報做模糊處理增加界面層次感;第三類似網易云課堂加入意向類的圖片;第四類似優酷、36Kr添加幾何元素進行裝飾。

 

 

3、純色背景

 

純色背景在使用時往往采用品牌色,同時搭配Logo進行設計,體現品牌感。需要注意的是,該方式多用在登錄信息簡單,或者以第三方登錄為主的界面中。如下圖所示:

      

Keep、問卷網、騰訊課堂均采用品牌色進行設計,同時可以看出他們的登錄信息都較少,在視覺設計上也較為簡潔。

 

 

4、全屏大圖

 

全屏大圖也就是在登錄信息下方采用圖片的形式填充,其優勢是圖片更容易吸引人的注意力,更容易傳遞情感引起用戶共鳴,如果采用產品相關的圖還能夠提前給用戶有個預期。其缺點是信息和背景融合度較高,對于一些體量較大的產品不太適合,多用在垂直類的APP中。如下圖所示:

   

全屏大圖其圖片是整個界面的核心,因此想要找到一個符合產品的圖片是不易的事情,在進行圖片查找時我們也需要有目的性的尋找,比如咕咚、釘釘選擇的和產品相關的圖片;每日開眼、隨辦、企業查用了較為意向的圖片;馬蜂窩采用全屏動圖讓整個登錄界面更加生動(使用動圖要慎重,因為用戶往往會使用過長的時間查看,拉長登錄時間)。

 

 

5、半屏圖片

 

半屏圖片和全屏圖片類似都可以通過圖片傳遞產品核心功能、或者通過意向圖傳遞產品品牌感,只是半屏圖片其重點是以登錄信息為主。其缺點是在設計上不容易出彩,目前僅有少部分的APP采用該樣式,如下圖所示:  

    

小豬短租、NOTHING、螞蟻短租均使用的是半屏圖片的形式,可以看出其登錄操作模塊在界面的黃金位置上,整個界面設計會有一定的分割感。

 

 

6、插畫背景

 

相比于圖片設計,插畫背景有個優勢就是通過自己手繪不需要到處找圖片,也不用擔心圖片的版權問題,可以完全根據自身產品進行插畫制作。需要注意的是插畫設計好加入品牌識別元素,或者和品牌相關元素,這樣才會顯得有意義。如下圖所示:

   

印象筆記采用鬧鐘、文檔的方式也讓人一目了然知道他的記事功能,in的Slogan就是有趣的人都在in,這幅插畫剛好也表現出了這個意思,右采用品牌章魚卡通形象,讓界面具有可識別性。

 

 

三、如何選擇符合產品的設計樣式?

 

上面我們已經進行了參考的收集、樣式分類分析。現在我們就需要將這些樣式結合我們實際的產品進行梳理,選出適合我們當前的設計方式。

 

任何界面的設計都是有理有據的,也就是我們的設計需要根據我們的設計目的、老板預期、競品分析多方面進行篩選。

 

 

1、設計目的

 

首先我們來看登錄界面的目的主要有哪些?這里我主要歸納了4個方面:個人信息錄入、品牌展現、傳遞信息(商業信息、產品核心作用)、故事或產品的人文情懷。這些目的分別對應著不同的設計樣式。

個人信息錄入:主要使用在體量較大的項目中,其主要涉及目的就是高速高效的幫助用戶登錄,結合上面的樣式分析我們可以推出白色簡潔樣式、半屏圖片展示樣式、輕裝飾風格是以個人信息錄入為主要目的的。

 

品牌展現:如果你覺得千篇一律的白色簡潔風格沒有特點,你也可以根據需要加入品牌識別,比如在界面中添加Logo、添加和產品相關的圖片、插畫元素等。結合上面的樣式分析,主要有輕裝飾風格、純色背景、插畫背景、全屏大圖能夠更好的提現品牌化。

 

傳遞信息:當你的登錄信息較為簡單時,比如僅有第三方或者簡單的登錄信息,這時候登錄界面不單單是以個人錄入為主,還會起著傳遞商業信息、產品信息等作用。結合上面的樣式分析,主要有輕裝飾風格、全屏大圖、半屏圖片能夠更好的傳遞產品信息。

 

故事或產品的人文情懷:這個比較適合小眾的產品,我們知道圖片是好的傳遞情感的方式,因此全屏圖片是不錯的選擇,當然如果產品預算較高,我們也可制作成視頻,更能夠引起用戶的共鳴。

 

分析完后就需要結合我們產品的設計目的進行選擇了,根據前期的需求溝通我們的登錄界面信息簡單,同時用戶需要登錄之后才能進入界面,因此在展現上以品牌展現和傳遞信息為主,因此我們可以推出我們的產品較為適合輕裝飾風格、純色背景、插畫背景、全屏大圖。

 

 

2、老板預期

 

有時候你分析的不一定是正確的,你可以將你的分析和經理說,經理會比你更清楚和老板想要哪種。在前言部分我也提到過,老板想要登錄界面較為活躍,體現銷售行業的朝氣。因此在設計時我們需要考慮這一因素。

 

 

3、競品分析

 

競品分析往往能夠解決我們采用何種樣式,我們的項目定位很明顯,就是客戶資源管理,目標人群也只是本公司銷售人員使用,因此可以將其歸納為工具類的APP,在工具類的APP中常見的設計方式主要有:白色簡潔、純色背景、全屏大圖。

客戶資源管理類的優秀APP幾乎很少,因此這里我找了以工具使用為主的APP,貝殼找房面向人群更廣,主要為大家提供找房信息,他的用戶群體主要是用戶,當然他希望用戶快速登錄為主,因此采用了能夠高效操作的白色簡潔風格,這個樣式我從側面問過經理,覺得不太適合。后我們決定做兩個風格,純色扁平風格和商務背景能夠很好的提現品牌化。

 

后,為了提高過稿率,我將后得出的純色背景和全屏大圖樣式各設計了一稿,提交給老板進行反饋。他們選擇的是純色背景的風格樣式,到這里我們就成功過稿了。

 

這個分析過程大家可能會覺得很繁瑣,其實當你將收集之后的圖片分類對比分析時,基本就能夠確定采用何種風格了,這里提醒大家,你的分析可能和老板預期會有出入,因此好能夠設計兩個版本給老板選擇,同時分別闡述使用他的原因,這樣就能大大提高過稿率。

 

總結

 

今天主要以登錄就界面為例,和大家分享設計沒想法時可以通過收集、分類、分析對比三個方面進行梳理,幫助我們有理有據的找到適合產品的設計方案,提高過稿率。

 

1、收集:平時多收集優秀APP,在你不知道怎么做的時候我們可以結合競品,將這些APP大致過一遍,了解每個行業的設計特點,為后面的分類做準備。

 

2、分類:通過分類可以就可以知道有哪些風格樣式,了解他們的設計優缺點,可以幫助我們做到心中有數。

 

3、分析對比:根據產品設計目的,結合上面的樣式分析,選出適合我們產品的設計方式。
轉自:

 

丨夸米科技

咨詢直線:186-2370-8562  官方網站:www.oceantechmarket.com.cn

?
LOGO

地址

重慶市渝北區金開大道西段106號創新科技園區3座4樓

鄭州市中原區電廠西路西三環交叉口大學科技園東區15E

聯系

400-966-3016
lihao_web@163.com
Copyright@2021 重慶夸米網絡科技有限公司 版權所有 備案號:渝ICP備16002041號-2 站點已申請專利保護 盜版必究 法律支持:河南律師服務中心
多一份參考,總有益處
聯系夸米,免費獲得《策劃方案》及報價
高端網站建設 | 響應式網站 | 企業官網 | 營銷網站 | UI設計 | 小程序開發 | APP開發 | 品牌設計 | 網絡營銷推廣
業務熱線:400-966-3016
QQ咨詢
稍后再說
主站蜘蛛池模板: 中文无码久久精品 | 欧洲女人牲交性开放视频 | 色综合无码黑 | 免费岛国av片在线播放网站 | 亚洲av无码国产综合专区 | 国产又爽又黄又不遮挡视频 | 国产一二三四五 | 亚洲中文字幕成人在线 | 青青草国产免费久久久91 | 日韩一区二区三区射 | 国产愉拍91九色国产愉拍热度飙升 | 国产卡一卡二卡三精品 | 日本特黄三级视频在线播放 | 日本乱偷人妻中文字幕 | 国产高潮视频在线观看 | 99久久婷婷国产综合精品 | 精品国产a∨无码一区二区三区 | 国产成人av大片在线观看 | 国产99视频在线观看无码 | 97伦理影院[天蚕土豆] | 国产免费人成视频在线播放播 | 欧美日操 | 特级无码毛片免费视频 | 中文字幕与邻居少妇乱码 | 夜晚福利院视频 | 黄色视频网站在线观看 | 麻豆精品久久久久久中文字幕无码 | 日本一区 | 人妻精品久久无码区 | 日韩无砖专 | 国产精品自拍第一 | 91在线无精精品秘入口如何安全使用 | 午夜影院c绿象 | 久久精品国产亚洲av四区 | 欧洲vodawifi喷浆3d | 91av中文字幕 | 亚洲精品无码av专区 | 日韩视频中文字幕视频一区 | 日本一区二区在线播放 | 日本一区二区三区久久久 | 国产精品亚洲电影久久成人影院 |