首先和大家介紹壹下項目背景,它是壹個地產客戶資源管理的APP,目標人群就是我們公司的銷售人員約3000人,以前他們在客戶資源管理上主要使用的後臺管理系統,但是常常會出現資料跟進不及時,或者資料錄入不完善的情況,這次在APP中得到了改善並增加了壹些新的功能。
我主要負責這次界面的設計工作,整個界面設計完成還算比較順利,只是登錄界面遲遲不過稿,因為想到咱們的產品是工具類、需要登錄之後才能進入界面進行操作,因此登錄界面就是大家進入APP看到的第壹個界面,在設計上我采用的是全屏大圖的商務風格,使用了壹個和房產有關和商務類的圖片。
不過後來老板反饋登錄界面的背景圖像有壹層霧,他建議圖片最好是藍天白雲看上去活躍點,不要氣死沈沈的。
大家看到藍天白雲可能會笑,這設計出來會不會太low,我開始也是這樣想的但是轉念壹想。老板只是覺得這個界面沒有生氣不活潑,我們的目標人群本來就是自己公司的銷售員工,在設計上壹定要是充滿朝氣。
後來我嘗試了多種圖片類型:商務辦公、海景房、純意向類圖片等,覺得都不能很好的表達。這時候同事看到我有點糾結,於是就提醒我我換個思路不壹定要設計成這種全屏大圖風格,現在很多APP登錄界面設計都較為簡潔,不用拘泥於壹種樣式。那還有什麽樣式較為適合呢?於是晚上回家我對登錄界面的設計樣式進行了梳理,我主要從三個方面入手:
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、分析:根據產品設計目的,結合上面的樣式分析,選出適合我們產品的設計方式。
以上就是我在項目中遇到問題的總結,希望對大家有幫助,看完妳可以找個界面來分析試試,看看是不是這樣。
插畫的7種風格特點-扁平、流行、常用的風格、簡潔明了
扁平插畫簡單來講就是把復雜的關系簡約化,讓畫面更加清爽整潔,也是現在比較常用的風格了,很多商務工具類的APP會選擇使用這種風格。比如說拉勾、釘釘...
特點-扁平插畫的變種、增加顆粒感、有質感、光影關系好
肌理插畫顧名思義就是給插畫加上了些肌理質感(比如雜色)和光感,本質也和扁平插畫差不多,壹些想體現質感的頁面會用到這種風格。以下是壹些設計師的作品。
特點-美術功底要求最高、應用廣、展現內容豐富。手繪風格的插畫運用的也比較廣,常見的有壹些插畫繪本,故事場景設計等。下面這些是摘自插畫師-顧心的作品。
特點-簡潔、圓潤、可愛、斷點
MBE插畫(dribbble的壹位設計師創作了這種風格),它主要的特點就是圓潤、可愛、呆萌、簡潔。在APP中的引導頁、啟動頁和缺省頁運用也比較廣泛。
特點-唯美、顏色的采取近似色、顏色明亮鮮艷。
漸變插畫有點類似日本漫畫場景的感覺,風格特別唯美浪漫。光感比較強,所以也稱為微光插畫。顏色壹般采用相近色,顏色種類不要太多。
特點-2.5d插畫、立體感強、視覺沖擊強。
立體插畫也稱為2.5D插畫,也就是在二維的空間裏表現三維的事物。所以現在越來越多的設計師去學習C4D這個軟件,雖然AI和PS也能做,但會麻煩壹些。很多電商類的APP會選擇使用這種風格。比如說京東...
特點-形狀、描邊、抽象畫處理
描邊插畫除了運用形狀,還在它的外輪廓都運用了描邊,可以很清晰的表達抽象事物。經常運用在壹些圖標icon上,比如閑魚、轉轉...
什麽樣的人適合選擇插畫做為副業？市場上對插畫的需求有多大？去壹些垂直性網址去做壹個崗位插畫師,接單子繪圖,另外就是在火山視頻,西瓜小視頻,
抖音
視頻,今日
今日頭條
等視頻平臺把制圖全過程分享出來,進行壹些講解,吸引粉絲量,兩邊都能掙錢,如同耳科趙醫生壹樣,工作網絡兩不耽誤。壹段有故事的畫才算是有靈魂的,這兒涉及到2個方面。壹個是畫自身會講故事,換句話說看到的人就能聯想到很多事或含義;另壹方面,是本人要會講故事,即別人問妳或者妳積極介紹自己的出畫,可以敘述出讓人感到印象深刻的小故事。
因為本人對這個行業不是很清楚,因此是以非專業的視角去看看這件事情。提到商業插畫,想必大家都不會陌生,尤其是近幾年,伴隨著網絡銷售、電子商務和科技有限公司的高速發展,商業插畫的市場在快速擴張,插圖的需求量也越來越大!從插圖近百年來發展的趨勢和互聯網的大環境看來,未來十年,商業插畫的市場需求只增不減,並且要求會越來越大!
壹件事能不能長期性持續下去,看環境因素和內部環境的感恩回饋是不是優良。外界環境是指畫插畫能不能不斷為妳帶來最理想的收益,社會身份,職業成長,自身價值認同等。內部結構便是本身了,自身的才能、布局、長遠發展這些,包含身體的健康可能會影響到這個問.題的結果。假如--直能持續穩步發展,自然也是可作為終身職業的。
應當還不錯的。這是最近幾年新出的產業鏈。發展前途什麽的都不錯的、商業插畫的前景還是很不錯的,現階段插畫行業在國外還是挺空白的,優秀人才很急缺。壹個樂觀的推測說:"商業服務插畫師將在未來17個新興行業中遙遙領先,它和大牌明星、羰Α⒖發工程師、時裝設計師等職業壹樣將成為高收入人群。商業服務插畫師是電腦繪圖領域中較為急缺的人才,它運用十分廣泛,手機遊戲角色設定、廣告招貼設計、卡通吉祥物設計方案、出版發行插畫圖片這些。
商業插畫將傳統藝術創作從紙和筆中解放出來,根據壹臺電腦、壹個
手繪板
來達到最好的視覺沖擊。關鍵是要有好的念頭
《向左走,向右走》
這是壹本只花妳十分鐘的愛情故事,壹本不得超過每千字的書,壹本繪畫超過文字的書,它取得成功,意外地使龍套插畫家火爆了壹番。好壹點的插畫師不壹定全是科班,最重要的是還要有好的念頭,才能把商家的用意淋漓盡致地表達出來。如果妳想要學的商業的話也可以去專門的培訓機構學習。像中國插畫網什麽的都有自已的培訓機構。妳自己多看看。