當(dāng)前位置:首頁>ps入門教程>動圖教程>動畫教程>教程內(nèi)容

ps設(shè)計平板電腦應(yīng)用程序動畫模擬(2)

來源:飛特網(wǎng) 作者:情非得已 學(xué)習(xí):5152人次

 

第五步:應(yīng)用程序的頭部樣式

用矩形工具(U)畫出一個矩形,高度80px,按ctrl+G,設(shè)置編組名為“頭部”,并設(shè)置矩形圖層樣式,

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

第六步:頭部細(xì)節(jié)

1、用橢圓形工具(顏色#1C79B4),在頭部上繪制一個橢圓,接著應(yīng)用高斯模糊,半徑為15px,按住ctrl 鼠標(biāo)點(diǎn)擊圖層“形狀1”,再ctrl+shift+I,反選選區(qū),按“Del”鍵,刪除超出的部分

2、增加圓形藍(lán)色半透明氣泡,用圓形工具,在頭部上添加多個大小不一的半透明圓形,按ctrl+G把氣泡層放入一個編組,命名為“氣泡”

3、在”氣泡“編組上加蒙版,使頭部外的氣泡不顯示,用矩形選區(qū)工具(M)繪制一個矩形,按shift+ctrl+I,反選選區(qū),接著填充黑色

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

第七步:添加程序名

1、這里我們采用原文中的英文字體,并給字體層添加,投影,漸變樣式

2、按ctrl+G把圖層編組,命名為”logo“,這時它應(yīng)該在”頭部“編組中。

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

第八步:制作分割線

1、用橢圓形工具(U)繪制一個黑色細(xì)狀的橢圓,應(yīng)用高斯模糊 半徑為5px,

2、用矩形選區(qū)工具(M)選取半邊的橢圓,按Del鍵,刪除

3、用矩形工具(U),在半橢圓的左邊畫一個1像素的線條,顏色(#2982BE),接著添加蒙版,用漸變工具(G)在蒙版上拉一個漸變 (黑-白-黑)

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

 

第九步:添加搜索框

1、在”頭部“編組中新建一個編組,命名為”搜索“

2、用圓角矩形工具(U),繪制一個白色圓角矩形(圓角半徑為50px),添加內(nèi)陰影,漸變描邊

3、添加灰色放大鏡(顏色#ABABAB),文字,字體選”Helvetica“,顏色 #ABABAB,字體大小16px

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

第十步:添加搜索按鈕

1、用圓角矩形工具(U),繪制搜索按鈕(圓角半徑為5px)

2、添加文字

3、設(shè)置按鈕的圖層樣式,漸變疊加,斜面和浮雕,描邊

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

第十一步:ipad應(yīng)用程序工具欄

1、用矩形工具(U),在ipad屏幕的底部繪制一個黑色長方形,命名為“工具條背景”,高度 50px,然后添加漸變樣式

2、按ctrl+G編組,命名為“底部工具條”

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

第十二步:ipad 頂部狀態(tài)欄

1、把編組“頭部”,向下移動24px

2、在ipad的頂部狀態(tài)欄 默認(rèn)有 信號,時間,電池3個圖標(biāo),打開純色圖標(biāo)ipad_used.psd(本文素材中下載),把編組“頂部狀態(tài)欄”,拖到ipad應(yīng)用程序.psd中并且在圖層“ipad”的上方

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

 

第十三步:纖維背景

1、新建一個編組,名為“App背景”,在編組“底部工具條”下方

2、在編組“App背景”中,用矩形工具(U)繪制一個矩形名為“形狀6”,灰色背景((#797979),大小是ipad的屏幕大小,

3、在圖層“形狀6”上方新建一圖層名為“纖維”,按“D”鍵使前景色為白色背景色為黑色,應(yīng)用濾鏡 - 渲染 - 云彩,接著濾鏡 - 渲染 - 纖維,接著濾鏡 - 模糊 - 動感模糊,把不透明度改為“25%”

4、按住Alt鍵 在圖層“形狀6”和圖層“纖維”之間,點(diǎn)擊一下

Photoshop制作iPad應(yīng)用程序動畫模擬教程,PS教程,16xx8.com教程網(wǎng)

學(xué)習(xí) · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!