這篇教程是向腳本之家的朋友分享PS結(jié)合AI制作超級跑鞋APP界面教程，教程真的很不錯，值得大家學習，喜歡的朋友可以參考本文，來看看吧！

最終效果圖：

先上最終效果圖，我們這邊的超跑不是超級跑車，是超級跑鞋的意思~··

設計師除了要設計，還要多運動啊！

1、首先你需要上網(wǎng)找一張NIKE鞋圖片，素材的顏色將被用作界面的主配色。

2、接下來，你需要用磁力套索工具，或者選區(qū)工具，把圖片周圍的白色扣干凈。

PS：如果你是個懶人的話，可以在花瓣直接搜NIKE PNG，

可以得到已扣完的耐克鞋(｡・`ω´･)，這么懶真的好嗎？

3、你需要建一個750*1334像素，分辨率為72的畫布，背景色值為：#1e1e1e

4、你需要找到正方形形狀工具，畫出狀態(tài)欄40像素和標題欄88像素的長方形,色值為#1a1a1a,然后畫出粉紅色的長方形裝飾

5、畫一個內(nèi)容區(qū)域的正方形，尺寸如圖，色值還是為#1a1a1a，再給它添加黑色外發(fā)光，透明度30%，正片疊底

6、很多人說狀態(tài)欄那類找，一般我們都是用模板里面的素材，你沒有的話，請下載本教程里的源文件里面直接拿，(｡☉౪ ⊙｡)吶尼，你說你要自己畫？有懶不偷……那只好隨便你了~··

圖標呢！可以去阿里矢量圖標庫下載，記得下載矢量格式就是那個SVG或者AI格式，當然你要自己畫也可以，至于如何畫圖標可以參閱雪姐姐的其它教程~··本處不展開~··

6、接下來再百度圖片里搜一張NIKE的logo圖片，高清一些的，拖進AI里，小黑箭頭點中后，會出現(xiàn)圖像描摹工具欄，下來箭頭后選黑白徽標

7、描摹好后，點頂部菜單對象-擴展，對象-取消編組，要重復取消編組到無編組可取消后，用小黑箭頭點一下畫板空白處，再點擊白色部分，delete掉所有的白色背景

接下去就可以拷貝到PS里去用了，粘貼的時候要選4個菜單中的最后『形狀圖層』

8、接下來用圓角矩形工具畫一個按鈕唄，尺寸如圖，給加個漸變的圖層樣式

9、復制按鈕圖層，錯開一些位置，把窗口-屬性-蒙版面板打開，設置羽化值為8，透明度加一些，做個彌散投影，再給按鈕添加文字

10、我們把扣完的NIKE鞋放上圖調(diào)整下角度，然后用加深工具，在顏色部分，使用陰影模式擦2下，這樣鞋子顏色會更加妖艷一些，也是我們需要的效果

11、接下來我們打上價格，去阿里矢量圖標庫找一些小星星或者小愛心，當然你自己畫也很快，然后把5顆小星星CTRL+G成組后，在圖層文件夾上方新建一層，右鍵-剪切圖層，把最后1顆半星星涂白

12、最后我們來做COLOR和SIZE區(qū)域的分割線，其實也很簡單，建一個高2個像素，寬和中心方形區(qū)域一樣寬的像線一樣的黑色長方形路徑，再給這個線加一個淺灰色投影

13、關(guān)于此運動鞋的介紹文字，你去官網(wǎng)或者各種專賣店產(chǎn)品介紹里拷貝來即可，記得把品名加粗，MORE加粗，其它的就細細的好了，我用的冬青體，你愛用蘋方還是微軟雅黑隨你~··那個SIZE的尺寸小方塊也只是正方形加了一個粉紅描邊~··

耶~··這些你都做完了，你就得到了一張看起來比較概念的流行時尚的購物車APP界面就做完了，接下來把它塞進Iphone7的MOCK UP手機殼里就大功告成了！

沒有好看的手機殼的話，在本教程的源文件里我給你準備了一個~··快去下載吧！(●'◡'●)ﾉ♥ 大家也可以試著做一些其它配色的NIKE鞋APP界面出來，期待大家的作品~··

學UI就到UEgood，好、省、快！即教軟件技術(shù)，又教設計思維！更多教程請點右邊頭像查看！UEgood必修班第六期4月16日開課，要集中式學習的抓緊時間上車！

教程結(jié)束，以上就是PS結(jié)合AI制作超級跑鞋APP界面教程，希望這篇教程能對大家有一定的幫助，喜歡的朋友不妨來嘗試一下吧！