學會這兩招,快速提升設計師的作品集格調!(實例演示) - 優設網 - UISDC

學會這兩招,快速提升設計師的作品集格調!(實例演示)

2017/02/03 23028評論區

skills-improve-portfolio-style-1

云南体彩网馬上就求職高峰了,人人又要開始著手整理這一年的作品集,那么如何快速提升作品集的展示效果呢?這篇文章從色彩入手,幫你輕松提高作品集的格調!

一說到作品包裝,有些同學想到的是

套用Mockup:

uisdc-production-20170203-1

拉透視:

uisdc-production-20170203-39

還有一些同學在展示結構上特別用心:

uisdc-production-20170203-2?

有人用了這些方法,作品立刻脫穎而出,而更多的人卻被說成外面功夫,這是為什么?

云南体彩网排版固然重要,但色彩的運用同樣不克不及忽視,有時色彩甚至是作品脫穎而出的關鍵

試想一下,在Dribbble 有很多高人氣作品,雖然內容平平,但只要顏值到位,依然可以圈粉無數:

uisdc-production-20170203-3

在這看臉的時代,沒有顏值的作品,縱使結構考究,也鮮受關注,設計師的作品必須精致。

前言

云南体彩网首先你要明白一件事非常、非常、非常重要的事

云南体彩网作品包裝不是設計圖的簡單羅列,更不是讓你世界展現產品的線上截圖,作品包裝包好比用美顏相機自拍

云南体彩网為的是展現作品最完美的一面,下面將為人人講述,如何提升作品的顏值。

1. 包裝色調

云南体彩网目前主流的 APP 界面配色都是下面這樣

uisdc-production-20170203-4

APP 界面中品牌色已淪為裝點色,界面的顏色主要來自內容,且 APP 的品牌色通常不會隨著設計師的主觀意愿進行調劑

云南体彩网既然設計師無法改變 UI 界面的顏色,那我們就從包裝的配景色著手,常見的配色手法有四種:

( 長圖太占空間,下面均以小圖示意?)

1. 同色系配色

(最常見)

uisdc-production-20170203-5

云南体彩网指主色和副色都在同一色相上,在配色上營造一致性

2. 類似/鄰近配色

uisdc-production-20170203-6?

這種方法最為常見,可以讓頁面顏色更加豐富,且色相過度柔和,看起來非常和諧

3. 中性配色

uisdc-production-20170203-7

云南体彩网即配景以黑白灰為主,突出內容(UI 界面),使之不受配景色的干擾,這種配色不僅非常經典,還很百搭

4. 對比色配色

?uisdc-production-20170203-8

云南体彩网配景和內容色彩間的對比形成強烈的視覺沖擊,使內容變得更加突出

2. 界面色

上文提到,目前 UI 界面中的色彩主要來自內容

在新版 Apple Music 中,蘋果讓每張專輯自己說話:展現專輯原來之美

uisdc-production-20170203-9?

類似的理念,在 Instagram 改版中也早有體現,其設計主管 Ian Spalter表示:「我們相信色彩應該直接來自社交的照片和視頻才對」uisdc-production-20170203-10

云南体彩网對此,我們可以寬泛的理解為界面色=內容色

如今,目前越來越多的 APP 朝著突出內容的方向發展,在內容變得越發突出的同時,內容的質量也釀成一把雙刃劍。好的內容不僅可以提升產品氣質有的時候,可以撐起整個作品,如下:

uisdc-production-20170203-11

uisdc-production-20170203-12

而差的內容則卻能讓產品氣質瞬間歸零,以 Ins 為例:

?uisdc-production-20170203-13

云南体彩网線上產品內容質量受 UGC、運營編輯、后臺技術等多種限制,很難以最完美的效果涌現給人人。慶幸的是,設計師在包裝環節可以通過自己精妙的配圖,展現作品最完美的一面。

但是,配圖并不是簡簡單單的去扒一些美圖那么簡單,不僅要根據整個包裝的配色反復斟酌,還要符合產品原有的氣質,選圖的思路如下。

1. 展現美的內容

uisdc-production-20170203-14

如果你對內容質量的把控度不高,建議你可挑選專業攝影師的作品:

uisdc-production-20170203-15

云南体彩网人像用模特硬照或明星寫真(含網紅),這類的圖片都是經過專業修片,質量有保障

2. 色折衷諧

在確定包裝的整體色調后,內容的色調根據包裝的整體效果進行挑選。

下面這張圖來自Dribbble:

?uisdc-production-20170203-16

云南体彩网用下面兩張圖替換原作品中的圖片,結果會怎么樣??

uisdc-production-20170203-17 uisdc-production-20170203-18?

雖然內容質量過關,但卻破壞了原包裝的整體色調,拉低了展示效果

3. 完善細節

我總結了幾個選圖要點,希望可以贊助人人規避一些問題

1)烘托氛圍

出于某些原因,國內很多設計師時常會出一些英文設計稿

uisdc-production-20170203-19

uisdc-production-20170203-20

如果要做英文設計,在內容配圖上最好以外國人為主,而類似于“今日故宮”這樣帶有中國風的產品,在選圖的時候,如果插入老外圖片則顯得很跳戲。

2)配景不重色

?uisdc-production-20170203-21

如果 UI 界面中配景為白色,那么圖像配景色要避免大面積涌現白色,避免與 UI 配景色相同,造成圖片沒有邊沿感

3)慎用藍天白云

?uisdc-production-20170203-22

藍天白云是中國民間最為常用的素材,作為一個有逼格的設計師你好意思在配圖中涌現這個?

云南体彩网如果要用,除了避免大面積涌現以外,還要調劑圖片的整體色調。

4)主體適當

uisdc-production-20170203-23

盡可能選擇或截取近景圖,圖像的主體可占到圖片尺寸的1/2左右

案例分享

下面將實例講解以往個人作品的包裝思路

uisdc-production-20170203-24

配景

去年受某培訓機構邀請,做一個通過配色提升包裝效果的范例,范例主要想體現在簡單排版的情況下精通過“色”的修改提升包裝效果。

包裝對象

愛奇藝啪啪奇6.1設計圖,如下

uisdc-production-20170203-25

包裝開始?

1. 確定包裝的主色

初步設定:產品的主色為綠色,故在整體配色上,以冷色系為主,同時選用綠色的類似色進行搭配。

uisdc-production-20170203-26

云南体彩网豐富:接著我又在配景色中加入了紫色

云南体彩网不僅可以使包裝顏色更加豐富,形成柔和的漸變,還可以增加一絲神秘感,提升整體感覺??。

uisdc-production-20170203-27

2.確定素材

原設計圖中所用素材人物,多以微笑為主和藍紫色的冷艷氣質不符,為此我把目標鎖定在面無臉色的 Model 上,并結合展示結構。

uisdc-production-20170203-28

云南体彩网如果整體都是艷麗的顏色,不僅會造成視覺疲勞,且會降低素材的新意,所以需要找到藍紫色和白色兩套素材。

原本盤算以亞洲模特為主,無奈亞洲模特可用素材不多,不僅顏色相對單一,且多為雜志封面。

uisdc-production-20170203-29?

云南体彩网最終還是選用了國外模特:

uisdc-production-20170203-30

3. 中文 or 英文

云南体彩网啪啪奇原始的設計稿為中文,我是真真切切不想將其替換成英文(嫌麻煩)。

云南体彩网可在中文界面下,部分頁面展示效果較差,人人可通過下面兩組對比自行感受下

uisdc-production-20170203-31

云南体彩网最后出于對展示效果的考慮,還是將界面中的漢字替換成了英文。

4. 細節調劑

云南体彩网至此,文字釀成了英文,圖片素材采取國外模特,為了進一步完善包裝效果

將頁面中的圓角改為直角(直角更符合冷艷氣質),并調劑蒙層的細節

uisdc-production-20170203-32

同時將界面和包裝中涌現的社交圖標,如QQ、微信、微博等國內應用逐一換成Facebook、Twitter、Ins等國外應用:

?uisdc-production-20170203-33

5. 輸出制品

uisdc-production-20170203-34

文字是展示的一部分,在包裝環節可結合產品特點及包裝整體效果選擇文字內容(中/英文、字體)

對某些字體特殊的產品,如 今日故宮:

uisdc-production-20170203-35

 

在包裝上,采取與APP相同的中文+方正清刻本悅宋字體包裝效果自然更佳

后記

uisdc-production-20170203-36

以上三類產品,都可以通過上述方法快速提升包裝效果,好比下面的界面:

uisdc-production-20170203-37

雖然結構簡單,卻能做出酷炫的包裝。

uisdc-production-20170203-38

結束語

作品的展示包裝固然重要,但優秀的設計思維才是支撐設計師未來途徑的基石,如果陷溺于包裝,忽略真實的產品設計,反倒會給自己帶來無盡的煩惱。

『 顏值只能攬客,活好才是硬事理,設計師應當內外兼修?』

最后祝人人在年底收獲更好的機會,2017年有更多更好的作品出街面世。

歡迎關注作者的微信公眾號:

hbsjsqr20170123

「給應屆卒業生的簡歷制作指南」

  1. 阿里丨《這些年我在設計師簡歷中發現的10個問題》
  2. 魅族丨《寫好一份簡歷的十個基本法》
  3. 設計顧問丨《簡歷中的哪些細節會影響第一印象?》

【優設網 原創文章 投稿郵箱:yuan@7daer.cn】

================關于優設網================
“優設網7daer.cn“是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.7daer.cn/book/
設計微博:擁有粉絲量180萬的人氣微博 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.7daer.cn

優設大課堂

非特殊說明,本文版權歸原作者所有,轉載請注明出處
本文地址:http://www.7daer.cn/skills-improve-portfolio-style

發表評論 加載中....

評論加載中....

uisdc

評論區都快餓癟了,看看我期盼的小眼神...

您還沒有登錄

優設啟用更平安省心的 微信掃碼登錄

微信掃碼

300萬設計師聚集地!優設網是極具人氣的設計師平臺
2012年成立至今,一直專注于設計師的學習成長交流

把好文章收藏到微信

打開微信,掃碼分享
學設計 優設網 在這里