作者：不洗碗工作室 Ajiajiajia葭
轉載請標明出處
作者聯絡方式：549044363@qq.com
參考文章：http://www.uisdc.com/use-sketch-design-switch-1
在今天之前的每一天，我對漸變色是懷有偏見的。我認為它很俗，扁平化才是王道。然而今天，日常開啟比較喜歡的一個app--圖蟲，看到它的logo漸變了，內心有點莫名的失落，但我轉念一想，iPhoneX走的也是漸變趨勢，應該是我孤陋寡聞了，確實，2018 漸變 悄然而至。
漸變色是用兩個或多個不同的顏色畫成一個元素，這些顏色之間淡入或淡出，從明到暗，或由深轉淺，以各種形式的過渡變化，色彩在設計表現中起到灰常灰常灰常灰常灰常重要的作用，“漸變色”的運用正在逐漸的被各種領域在使用，包括 UI介面、品牌logo、海報、插畫、字型設計等等，特別是iphone X 的恢弘漸變介面簡直引領色彩上的潮流，先來看一組圖片，感受一下漸變帶來的活力。
- iphone X 的漸變開屏系列
- 大牛們利用漸變的成功設計
- 陌陌的漸變色 Logo --年輕而富有活力
為什麼要使用漸變呢？
- 醒目，可以讓你第一時間去記住它，利於促進品牌的推廣
- 獨一無二，讓品牌打造出自己唯一的標識
- 情緒的傳遞，漸變色不僅僅是單一的情緒表達，而是一種恢弘情緒的傾瀉
- 它來源於生活而高於生活（詳情見下?）
為什麼說漸變色來源於生活而高於生活呢？ 這幾張圖告訴你
小時候就很喜歡潑墨山水畫，愛看愛拍也愛畫，現在想想，就是將現實中漸變的美景渲染到漸變的設計稿中，比如這位設計師畫的：
說到底，自己能夠弄出來才是硬道理，好的，乾貨來了?
這是根據我借鑑的那片文章步驟弄出的漸變，跟著步驟大概的把流程熟悉了一遍，動手做幾個就會得心應手咯
啦啦啦啦啦....青青草原來一曲
01 新建畫板（快捷鍵 -- A ）
02 設定彩色背景
- 為畫板上色
- 在畫板上畫一個矩形，使其與畫板完全匹配。
- 解除邊框（borders）顏色，然後點選填充自己想要的顏色
- 注意填充皮膚右上角的“+” 按鈕，點選它。如你所見，在此前的圖層之上新增新的填充圖層。選中漸變皮膚請選中它，在畫板上從左上角到右下角畫漸變。
- 確認你的形狀的左上角的顏色是白色（#ffffff）、右下角是黑色（#000000）。點選漸變色選擇器中的黑色，設定它的透明度為0。漸變色的透明度的調整可以通過滑動取色器右下方的滑塊或者在RGB右側的“A”字母輸入框輸入。選擇白色，設定透明度為60
- 記得設定填充為“overlay”
- 然後再次點選新增按鈕。這次選擇第三個標籤以得到徑向漸變。調整漸變為從左上角到右下角
- 確認左上角顏色為白色，右下角顏色為黑色。保證他們的透明度都為50%。同樣設定這個填充為“overlay”。一個簡單的漸變雛形顯現
如果打算新建logo圖示，那就繼續跟我走吧?（用我之前的青青草原來示例）
- 用iOS圖示模版建立圖示的外形，複製貼上來我們的畫板上
- 使用右側邊欄頂部的排列工具，將圖示置於背景的中間。
- 點選“align horizontally” 按鈕（水平居中第四個圖示）和 “align vertically” 按鈕（垂直居中，第七個圖示）
- 修改色彩為#ffffff。點選“+”按鈕新增第二個平色填充
- 鍵盤上點選“O” 選擇橢圓形狀工具。
- 可以右側邊欄設定圓的尺寸
- 使用的排列工具將圓形完美的居中
- 記得去掉邊框
- 將“Oval”圖層的填充樣式設為“Linear Gradient”，調整角度為對角線。設定左上角、右下角的顏色
- 運用橢圓工具畫旋鈕。畫一個58 * 58的圓，然後將它與大圓居中對齊
- 在該圖層上新增垂直線性漸變。設定頂部、底部的顏色
- 如圖所示，基本完成
這只是過了一遍簡單的流程，具體的創作發揮空間留給你們?。 比如下面這個設計師的創作，我覺得很贊，很大程度上改變了之前我對漸變色的偏見。話不多說，我來放圖
末尾小記
本來想著等到我需要用的時候再學吧，但 當我需要用的時候卻又懶得去學，往往選擇將就，所以為了整治自己的惰性，我選擇了現在就學。