電子請帖是展現設計師「版式佈局、素材整合、色彩統籌、交互體驗」綜合能力的最佳載體。本教程以「新婚請帖」為例,演示「文檔規範 → 紅色主視覺構建 → 素材疊加混合 → 裝飾元素提取 → 文字排版樣式 → 最終輸出」的標準化商業流程,所有圖層結構、混合模式、色值參數可直接復用於其他慶典請帖設計。
文檔規範與紅色主視覺建立
- 新建文件:1024×768px (或 1920×1080px 適配手機全螢幕)、72dpi、RGB、白色背景。
- 新建圖層,建立參考線劃分版面區塊。矩形選框工具 (M) 建立選區,填充紅色
R:222 G:0 B:0 作為主視覺色塊。
- 複製紅色色塊圖層,鋼筆工具 (P) 勾勒不規則邊緣路徑,添加「矢量蒙版」獲得造型化紅色區塊。添加「斜面浮雕」圖層樣式:風格「外斜面」、深度 100%、大小 10px、柔化 3px,增加質感厚度。
素材疊加與混合模式應用
- 導入紋理素材圖 (素材 1-4),Ctrl+T 縮放至合適大小。
- 圖層混合模式設為「顏色加深」/「正片疊底」,不透明度 50% / 90% 分層疊加,豐富紅色主視覺肌理層次。
- 素材中的玫瑰花元素:魔棒工具 (W) 選取紅色區域 → Shift+Ctrl+I 反選花朵 → 移動工具 (V) 重新排列佈局。
- 玫瑰圖層添加「斜面浮雕」(內斜面、平滑) + 「外發光」(暖黃色、柔和邊緣),營造立體質感與光暈氛圍。
文字排版與裝飾性版式設計
- 文字工具 (T) 輸入邀請函文案,字體選擇書法/襯線字體 (如漢儀行書、方正舒體)。
- 文字圖層添加樣式:「投影」(距離 3px、大小 5px、不透明度 50%) + 「描邊」(黃/金黃色漸變描邊,寬度 3px),打造烫金質感標題。
- 橢圓選框工具 (M) 繪製裝飾性橢圓色塊,填充土黃色
#c49a2a。載入選區 (Ctrl+點擊圖層縮略圖),複製背景紋理圖層疊加,混合模式「濾色」,不透明度 40%,形成「紋理填充裝飾框」。
響應式電子請帖輸出規範
| 輸出格式 | 尺寸規範 | 適用場景 | 關鍵設置 |
| JPG/PNG | 1080×1920px (9:16) | 微信/朋友圈/小程序分享 | 品質 90、sRGB |
| MP4/GIF | 1080×1920px、5-10秒 | 動態請帖、短視頻平台 | 關鍵幀動畫、檔案<10MB |
| HTML5 | 響應式斷點 320/375/414/768 | H5 頁面、官網嵌入 | CSS 動畫、音樂自動播放策略 |
| PDF | A4/A5、300dpi、CMYK | 列印實體請帖備份 | 出血 3mm、字體外框化 |
設計系統化延伸:請帖組件庫建設
- 色彩系統: 定義「主紅
#de0000、輔金 #c49a2a、中性灰 #333/666/999、背景白 #fafafa」為設計令牌。
- 版式模組: 封面模組、內頁模組 (新人介紹/流程/地圖/致謝)、RSVP 表單模組、音樂控制模組。
- 動效規範: 進場動畫 (淡入/上滑/縮放)、頁面轉場 (推拉/翻轉/疊加)、微交互 (按鈕反饋/載入狀態)。
- 數據埋點: 瀏覽 PV/UV、停留時長、RSVP 轉化率、分享傳播鏈路追蹤。
電子請帖設計的終局,不是畫出一張圖,而是建立一套「可配置、可追蹤、可迭代」的數字化慶典視覺系統。