在Photoshop中重構(gòu)一個(gè)產(chǎn)品有很大的挑戰(zhàn),但同時(shí)也樂趣無(wú)窮。今天我們就將重構(gòu)蘋果公司一款最漂亮的革命性產(chǎn)品-ipad。它融合突破性的技術(shù)于雙手間,它簡(jiǎn)潔、干凈、線條流暢。這個(gè)iPad允許你上網(wǎng)、看書、打游戲、看電影、操作電子郵件、聽音樂等,你還可以從程序商店下載超十五萬(wàn)程序擴(kuò)充其功能。我們開始教程吧。
最終效果預(yù)覽
能力等級(jí):高級(jí)
素材:Overdue for iPhone Icons by kediashubham
Aurora by pkarwowski
Reference Photo by Apple
1.在Photoshop中新建文件寬624px、高921px,背景色設(shè)為白色,分辨率72dpi。添加從上到下,藍(lán)到白漸變。選擇“圓角矩形工具”,圓角半徑設(shè)為22px,繪制如下圖所示的形狀,把該圖層重命名為“border”。
在“border”圖層上摳出邊框來(lái)。按住Ctrl鍵單擊“border”圖層縮略圖,取得選區(qū),執(zhí)行“選擇-修改-縮減”,縮減6px,按Delete刪除。使用索討工具單擊“border”內(nèi)部取得選區(qū),新建圖層填充黑色,把該圖層重命名為“Black Glass”。新建圖層,重命名為“screen”,使用矩形工具繪制屏幕,到目前為止我們得到4個(gè)圖層,background、border、black glass、screen。
2.我們回過頭來(lái)處理“border”圖層。選中圖層,添加圖層樣式。斜面/浮雕、顏色疊加和描邊。選中“black blass”圖層,添加線性“漸變疊加”,顏色設(shè)置為:#5b5c60-# 000000。
3.現(xiàn)在我們添加屏幕壁紙。首先我們下載pkarwowski 提供的背景圖,導(dǎo)入到Photoshop中,置于“screen”圖層的上方,然后按住Alt+Ctrl+G創(chuàng)建剪貼蒙版。4.前景色設(shè)為白色,新建圖層,重命名為“Dock”,畫一個(gè)長(zhǎng)方形,然后執(zhí)行“編輯-變形-扭曲”,拖動(dòng)上方的兩個(gè)角點(diǎn)向中間移動(dòng)如下圖:
選中“Dock”圖層,添加圖層樣式“漸變疊加”,顏色設(shè)置為#454637到#fafbfc的漸變。把“dock”圖層不透明度降低為58%。我們繼續(xù)制作屏幕頂部的信息欄并且添加ipad圖標(biāo)。
5.現(xiàn)在我們添加些Icon圖標(biāo)到桌面,下載本文所用圖標(biāo)(當(dāng)然您可以使用谷歌搜索滿意的圖標(biāo))。打開下載好的 Safari 圖標(biāo),把它導(dǎo)入Photoshop并且放置在“dock”層的上方,調(diào)整其大小。 為 Safari 圖標(biāo)創(chuàng)建倒影。復(fù)制圖標(biāo),然后執(zhí)行“編輯-變形-垂直翻轉(zhuǎn)”降低圖層的不透明度為21%,創(chuàng)建黑色到透明的漸變疊加。
選取并刪除溢出屏幕的倒影部分。 重復(fù)相同的過程,為桌面添加其他3個(gè)圖標(biāo)。6.下面來(lái)添加按鈕以完善我們的ipad界面。畫一個(gè)白色的圓作為開始按鈕,然后繼續(xù)在其內(nèi)部畫一個(gè)圓角半徑為2px的圓角矩形。
對(duì)小圓應(yīng)用漸變疊加,顏色設(shè)置如下:#4c4d51-#060606。然后給小的圓角矩形添加描邊和漸變疊加,同時(shí)降低圖層不透明度到19%。 7.選擇圓角矩形工具,圓角半徑設(shè)為2px,然后分別繪制按鈕A和按鈕B。 制作按鈕C時(shí),首先在頂部-圓角矩形工具設(shè)置面板上選擇“形狀圖層”(最左側(cè)的一個(gè)),然后設(shè)置圓角半徑2px 畫出按鈕C。使用鋼筆工具為按鈕C增加錨點(diǎn)如下圖所示,然后使用直接選擇工具選中錨點(diǎn),按左方向鍵向左側(cè)移動(dòng)3個(gè)像素。最后把所有按鈕都置于“border”層的下方。
最終效果:聯(lián)系客服