AFFILIATE HOMEPAGE BANNER — 方案設計板

位置方案對比 推薦 A

GIF 還是靜態？

1. 首選：靜態 PNG 定稿 + 前端 CSS 動畫 — 這份 HTML 裡的掃光/呼吸/漂浮參數可以直接抄，體積幾乎為零、永不失真
2. 次選：WebP 動圖（<300KB）— 如果前端只吃圖片檔
3. 不建議 GIF — 256色會把金屬漸變弄髒、文件大、加載慢

設計基因（點進去不跳戲）

Banner 完全沿用 Affiliate 任務頁的視覺語言：45°黑金斜紋 + 金屬漸變字 + 金邊膠囊。玩家點 CTA 進入任務頁時，是同一套世界的延續，信任感不斷。

• 金色 #F5D061 → #8A6A1F（同任務頁）
• 里程碑 chips ×10 ×20 ×50 / 500 1K 5K 直接呼應任務卡
• 倒計時組件 RESETS IN 05:43:17 同款樣式

下一步

① 你選定方案（A / B / C）→ ② 我出乾淨的 2x PNG 素材圖 + 可選 WebP 動圖 → ③ 連同這份 HTML 一起交給開發，CSS 動效參數現成。