萬盛學電腦網

您现在的位置: 萬盛學電腦網 >> 軟體知識 >  >> 影像處理 >> Photoshop 教學 >> Photoshop 手繪教學

PS 繪制粽子圖標設計:從線稿到質感的六步快速建模流程

本教程以端午主題粽子圖標為例,展示如何用極簡圖層結構(僅 6 個關鍵圖層)完成從扁平線稿到具備材質感、光影關係的立體圖標,適合節日運營圖標快速產出。

一、最終效果預覽

圖標呈現綠葉包裹的糯米粽,繩紋清晰,葉脈與米粒質感細膩,頂部高光與底部投影構建微立體空間,風格統一,適合小尺寸顯示。

二、六步核心流程

  1. 線稿構圖:鋼筆工具勾勒粽子外輪廓、葉片分層、繩紋路徑,路徑面板保存備用。
  2. 基礎色塊:按「葉綠 #3A7D2A、米白 #F5F0E8、繩褐 #8B6B42」三組建立填色圖層,圖層順序:葉底 → 米體 → 繩紋。
  3. 體積光影:為每組色塊添加「倒角與浮雕」(內部倒角、大小 3~5 px)+「漸變疊加」(線性、90°、同色相明度變化),快速建立厚度。
  4. 材質細節:
    • 葉片:新建剪切蒙版層,柔邊畫筆以深綠 #1A4D10 繪製葉脈,不透明度 30%。
    • 米體:雜色濾鏡(2%,高斯、單色)+ 動感模糊(角度 0°、距離 3 px)模擬米粒顆粒感。
    • 繩紋:描邊路徑(2 px、硬邊畫筆、#5D4037),再疊加內發光(#D7B89E、大小 2 px)表現繩鬆結構。
  5. 高光與環境光:新建圖層混合模式「疊加」,白色柔邊畫筆點繪頂部/棱角高光;新建圖層模式「正片疊底」,冷灰 #A0A0B0 掃出底部環境反光。
  6. 投影與導出:複製合併組 → 填黑 → 高斯模糊 4 px → 不透明度 40% → 位移 3 px → 導出 PNG-24(含透明背景)。

三、複用與擴展建議

  • 將「葉/米/繩」三組圖層結構存為 PSD 模板,更換色相即可生成鹹蛋黃、紅棗、八寶等多口味變體。
  • 圖標尺寸基準建議 64×64 px @2x,矢量形狀層可無損縮放至 512×512 px 用於 App Store 宣傳圖。
  • 配合「圖層合成」功能,一鍵切換「白天/夜間/高對比度」三套配色方案。
copyright © 萬盛學電腦網 all rights reserved