ui設(shè)計(jì)教程：唱片機(jī)圖標(biāo)(3)

本文將簡(jiǎn)略的陳述這款圖標(biāo)的設(shè)計(jì)思路，如何讓圖標(biāo)顯得栩栩如生，大家在放假的時(shí)候，來(lái)杯咖啡，慢慢的按照作者步驟來(lái)一發(fā)吧，難度有的，主要是掌握思路哦。

先看看效果圖

步驟01

首先用草圖勾勒出大體理念。這里我畫(huà)出了黑膠，然后添加了按鈕、唱針等元素。為了讓草圖看起來(lái)更有立體感(而不使用透視法)，因此，我添加了圓角矩形，讓圖標(biāo)看起來(lái)像是打開(kāi)的盒子一般。

步驟02

掃描草圖，導(dǎo)入到PS中。選擇漸變工具，填充背景從深色到淺色。下一步，花一個(gè)512×512的圓角矩形，半徑90px。按住Alt，選擇形狀，創(chuàng)建新圖層組，命名為“Icon”，現(xiàn)在為該圖層組添加蒙版

步驟03

色彩選擇非常重要。顏色一定要細(xì)膩，黑膠使用了深棕色，按鈕使用了亮棕色。

步驟04

利用圖層樣式，我們可以添加很多有趣的效果。黑膠部分添加了線性漸變疊加，混合模式為色彩簡(jiǎn)單，還加入了一點(diǎn)雜色漸變。復(fù)制圖層后，改變漸變模式為純色漸變，這樣能增添一種光反射效果。

步驟05

現(xiàn)在需要添加一些陰影，可以通過(guò)色彩或者線性加深的混合模式。給旋鈕以及唱針加入光反射以及投影。

步驟06

為了更逼真的陰影效果，在黑膠上方畫(huà)一個(gè)灰色矩形，加入外發(fā)光效果，混合模式為線性加深，然后調(diào)節(jié)不透明度。

步驟07

材質(zhì)也很重要，適度改變材質(zhì)的飽和度。然后為圖層添加蒙版，混合模式為疊加。

步驟08

注意工作圖層有序排布。

步驟09

現(xiàn)在可以對(duì)圖層樣式進(jìn)行詳細(xì)修改，直到滿意為止。

步驟10

創(chuàng)建新圖層，至于頂部，加入內(nèi)發(fā)光和光澤。通過(guò)光澤效果，讓整體圖標(biāo)顯示同一種色調(diào)。