Photoshop設計金色主題風格的暫停按鈕教程

2021-02-16 PS軟體教程下載

先看看效果圖

首先，打開ps 軟體，新建一個圖層
聲明一下：因為是製作一個界面圖標，所以新建一個400*400像素的圖層，解析度是72

首先我們填充一個黑色的底，用橢圓選框工具，填充一個白色的圓，加一個外發光效果。

然後ctrl+J複製一個圓，填充為棕色，按住alt+shift向中心縮小。
疊到白色圓的上方，並且在圖層樣式填充一個顏色漸變和投影。

按照上一步，製作一個黃色的圓。

之後在黃色面上加一些深色的圓斑，模仿類似奶酪的效果。

圓點加內陰影，注意一下光效來源，圓點也不要畫的太小，也不要太密集。
這裡要給整個底面加一個矩形反光條

直接用矩形選框工具填充純白色的矩形，之後降低圖層透明度。

這裡再加一個圓邊，可以直接用圓形選框工具加描邊，然後在這個圖層上面加一個漸變疊加，或者直接用一個噴槍筆刷去塗抹，這裡要記住，鎖定透明圖層哦~才不會畫出圓圈。
最後一步，畫暫停鍵。

首先用圓角矩形工具

再做一個圖層顏色疊加和內陰影

按照上一個步驟做一個深色的圓角矩形

同樣按住alt+shift等比例縮小。

單個做好之後，給這兩個圖層建一個組，命名為矩形1，然後複製組，水平拖動。

給第二個組也命名，建個組。這樣，圖標就完成了，希望有興趣的小盆友可以自己嘗試做一個

暫停按鈕的製作方法就講解到這裡，大家可以舉一反三，設計出其它樣式的暫停按鈕

免費領取！《AI CS6入門基礎視頻教程221集》

免費領取！《photoshop大師視頻教程》

免費領取！《Photoshop CC 基礎到高級系統化教程》

免費領取！《字作多情-劉兵克的Illustrator字體設計日記》

免費領取！《李濤皮膚精修教程》

免費領取！《Illustrator中文版創意繪圖與典型設計》

PS軟體教程旗下服務號（學UI設計網）：

相關焦點

  • Photoshop製作金色浮雕字效果
    【PConline 教程】本教程製作一個立體感字體,主要運用混合模式和圖層樣式來創建的。希望大家喜歡！！最終效果圖圖01、選擇「文件/新建」菜單，打開「新建」或者Ctrl+N對話框 名稱為：photoshop製作破舊的金色浮雕文字效果，寬度：為640像素， 高度
  • Photoshop CS6 安裝與破解教程【內附安裝包】
    於是就開始想：學院活動海報需要設計；社團活動海報需要設計；想給女票拍的照片修的好看一些，需要設計.那就先學一門PS吧。問題來了，小白入門，如何下載破解版本呢？接下來，就讓小壹教你~1.首先你要有安裝包，在這裡小壹推薦安裝PS CS6，因為後續教程的推薦大部分回和這個版本有關。
  • ps自學視頻教程photoshop教程
    —ps自學視頻教程photoshop教程提高篇同樣也是兩套系列教程，想從事平面設計工作的同學認真學習研究！第一套內容配套素材=ps自學視頻教程photoshop教程1-10章節全方面概括布爾運算和UI圖標繪製消失點工具運用選擇並遮住（摳頭髮絲案例）
  • ps教程入門ps自學教程視頻photoshop下載
    動手操作才有利於水平的精進哦~ps教程入門ps自學教程視頻photoshop下載—ps教程入門ps自學教程視頻photoshop下載提高篇同樣也是兩套系列教程，想從事平面設計工作的同學認真學習研究！第一套內容
  • photoshop濾鏡快速製作漸變彩色豎條紋桌面壁紙教程
    大家好，今天我們來學習一下使用photoshop快速製作彩色漸變風格的豎條紋桌面壁紙，教程非常簡單，只是使用photoshop的濾鏡和浙變工具以及圖層樣式就能得到一個很酷的條紋桌面壁紙，下面教程開始。教程結束，希望大家喜歡！1.閱後如果喜歡，不妨點讚、收藏、評論和關注一下。2.如果喜歡玩軟體設計，請關注本百家號閱讀相關文章。
  • 用photoshop圖層蒙版製作海報 電商美工實例教程 PS設計教學課程
    大家好，我是彭生生，今天呢，我來教大家用蒙版來設計一張海報。你可以一邊看，一邊打開photoshop一步步設計。01設計教程步驟第1步：打開Photoshop設計軟體，新建一個寬3000像素，高4000像素的文檔
  • 用Photoshop製作逼真的印章圖片 PS自學課程 電商美工設計教程
    今天，我來教大家用photoshop設計印章。設計的效果相對簡單，還沒有做具體的大小設置，如果要做的更加逼真，按照實際的尺寸比例去設計，一定會更加的完美。01設計步驟Design01：打開photoshop軟體後新建文檔，文檔命名為印章製作教程，文檔的尺寸我們選擇寬680像素高
  • Photoshop實例教程:17.圖章工具
    應用領域涉及平面設計、VI設計、插畫繪製、產品包裝、網頁設計、效果圖製作等。其強大的功能和無限的創意空間，在平面設計中扮演著不可或缺的角色。新版本中集成了ImageReady，為高級網頁圖像設計提供了所需要的各種功能。 通過「21互聯遠程教育網」推出的《photoshop cs視頻教程》可以使學習者迅速掌握photoshop各項操作登入平面設計的神奇殿堂。
  • 都說是2016年國外最火55套PS實用教程(附教程連結)
    27、字體設計：金色質感字體利用圖層樣式，設計一枚金屬質感，閃閃發光效果的字體。33、字體設計：金屬裹著的霓虹色又是一個模仿80年代霓虹色風格的字體設計，並結合了金屬質感的製作。41、圖像調色：局部彩色風格這種風格呢，其實阿隨君也寫過教程了，比如→一分鐘迅速模仿《罪惡之城》色調風格 。那不妨也來看看這位作者的好方法。
  • PhotoShop詳解融化字體設計
    本教程為的基礎實例，主要對圖層樣式進行詳細講解,在本章的每一個案例中都將應用到圖層樣式的各種效果，可以讓網友在的學習和工作中有所參照。　　本教教程重點、難點就在於如何應用Photoshop圖層樣式，但想利用圖層樣式製作出精美的效果圖，在於靈活應用、靈活調節圖層樣式裡面的各個參數及選項。
  • photoshop教程ps軟體製作一個立體字效果
    立體字效果在設計中是最長用的表現方式之一，這次就來講解下，使用photoshop軟體，來製作立體字效果。
  • Photoshop實例教程:19.橡皮擦工具(1)
    應用領域涉及平面設計、VI設計、插畫繪製、產品包裝、網頁設計、效果圖製作等。其強大的功能和無限的創意空間，在平面設計中扮演著不可或缺的角色。新版本中集成了ImageReady，為高級網頁圖像設計提供了所需要的各種功能。 通過「21互聯遠程教育網」推出的《photoshop cs視頻教程》可以使學習者迅速掌握photoshop各項操作登入平面設計的神奇殿堂。
  • photoshop教程--PS製作超炫的魔法火焰文字特效S教程
    這個教程將向你展示用PS設計出魔法般的火焰文字特效，這個教程適用於初學者，只需要幾個步驟就可以用photoshop輕鬆地製作出一個看上去很棒的文字特效
  • photoshop教程|UI教程|小辣椒圖標
    UI圖標初期教程小辣椒圖標｜photoshop教程｜（以下界面演示以Photoshop CC2017為演示工具）>第二步：選擇鋼筆工具，勾勒小辣椒外形輪廓，填充顏色，如圖第三步：選擇畫筆工具，畫小辣椒的深色部份，如圖第四步：選擇畫筆工具，畫小辣椒的高光部份，如圖第五步：添加投影，如圖<完>好了，本次教程到這裡就結束了
  • Photoshop教程|ps漸變如何使用?如何給圖片製作出漸變效果?
    46　來源: 初心雲 舉報 　　PS是設計者經常使用的一款軟體，學會用ps漸變能夠讓你的設計更加吸引人
  • PS教程:Photoshop實用小技巧!(超多乾貨)
    這類書通常會在1/3的路程處把你的學習興趣通通打消的就算你毅力堅強的堅持學習到最後 學完回頭看看卻還是做不出高質量有創意的作品來看到別人好的作品還是會一頭霧水 原因是沒有重點沒有深刻理解photoshop的精髓3、初學者學習過程中最好是理論和實機操作相結合 不要看太多的理論而不去實踐 也不要盡看教程而不學理論 儘量在實例中理解photoshop的功能。
  • Photoshop初學者教程:逐幀動畫製作基礎(3)
    正在閱讀：Photoshop初學者教程：逐幀動畫製作基礎(3)Photoshop初學者教程：逐幀動畫製作基礎(3)2007-09-19 09:12出處：作者：webkxq2007>更多精彩平面及網站設計圖文教程、視頻教程，盡在PConline創意設計欄目。
  • photoshop教程|UI教程|魔法藥水圖標
    UI圖標初期教程魔法藥水圖標｜photoshop教程｜（以下界面演示以Photoshop CC2017為演示工具）選擇圓角矩形，添加瓶頸與瓶口，如圖第四步：添加魔法藥水，如圖第五步：添加玻璃瓶子的高光質感，如圖第六步：添加軟木塞，如圖第七步：添加泡泡，如圖<完>好了，本次教程到這裡就結束了
  • Photoshop教程:免費視頻教程教你學PS
    正在閱讀：Photoshop教程：免費視頻教程教你學PSPhotoshop教程：免費視頻教程教你學PS2004-05-22 09:54出處：PConline作者：FIF 多媒體製作組針對這種情況，我們將推出一系列的視頻多媒體Photoshop教程，該Photoshop教程由FIF 多媒體製作組(http://FIF.HLW.CN)傾力製作，聲畫並茂，從photoshop入門一直到高級技術應用，系統地教授了photoshop知識。　　該系統視頻教程在線播放需要您的瀏覽器安裝flash插件，如果您不能正常觀看，請點擊這裡(macromedia.com)安裝。
  • PS製作網店產品主圖 photoshop設計店鋪主圖 電商美工自學教程
    大家好，前些教程我教大家如何利用photoshop設計店鋪產品詳情圖，今天我來教大家用ps製作店鋪產品主圖。我們看看效果吧。轉換成選框後填充顏色dbcbbc，這個時候整個立體箱就設計好了。08步驟：把剛才設計的圖層拖到紅色長方形圖層下面。09步驟：導入我們事先準備好的產品素材圖片，調整好大小，讓產品圖片剛剛利於箱子上面。10步驟：倒影的教程我們之前講過，今天不做講述了。