更新日誌

追蹤 Discord 頭像裝飾的所有更新、新功能與改進

v1.2.1

版本 1.2.1

🌍 在地化

  • 新增 10 種語言：簡體中文、繁體中文、印地語、俄語、波蘭語、印尼語、菲律賓語、越南語、泰語、土耳其語
  • 將全部 5 個核心頁面（頭像、頭像裝飾、常見問題、更新日誌）翻譯為每種支援的語言
  • 為每種語言在地化了 SEO 中繼資料、JSON-LD 結構化資料與介面文案
  • 最佳化翻譯文案以契合本地搜尋意圖，提升國際能見度
v1.2.0

版本 1.2.0

🌍 在地化

  • 新增 7 種語言：法語、西班牙語、德語、義大利語、日語、韓語和阿拉伯語
  • 將全部 5 個核心頁面（頭像、頭像裝飾、常見問題、更新日誌）翻譯為每種支援的語言
  • 為每種語言在地化了 SEO 中繼資料、JSON-LD 結構化資料與介面文案
  • 最佳化翻譯文案以契合本地搜尋意圖，提升國際能見度

🧭 RTL 支援

  • 為阿拉伯語新增從右到左（RTL）版面支援，透過 html dir 屬性自動套用
  • 確保阿拉伯語介面正確鏡像，文字對齊與元件流向正常
v1.1.9

版本 1.1.9

⚡ 效能

  • 在桌面端和行動端均達到世界級的 Core Web Vitals（LCP 與 CLS）
  • 透過穩定版面、預加載和字體指標覆寫最佳化 Hero 區域
  • 實現無限捲動以最佳化 DOM 體積並減少樣式計算時間
  • 新增 preconnect 提示並最佳化字體顯示以加快資源載入

✨ 使用者體驗提升

  • 用沉浸式 GeneratingOverlay 改版「儲存頭像」等待體驗
  • 新增動態預覽、微光效果和多重動畫
  • 實現帶上下文狀態更新的智慧進度追蹤
  • 精簡產生期間的冗餘 UI 元素

🔧 基礎設施

  • 整合 Umami 分析以實現隱私優先的使用追蹤
v1.1.8

版本 1.1.8

🌑 主題統一

  • 從導覽列移除淺色/深色模式切換
  • 為整個專案強制啟用深色模式
  • 從導覽列元件中移除所有主題相關狀態邏輯

🎨 UI 一致性

  • 透過 gradientClass 屬性為 SearchBar 元件增強動態漸變支援
  • 最佳化 discord_avatar 頁面的搜尋欄和 Hero 區域一致性（藍紫主題）
  • 最佳化 discord_avatar_decoration 頁面的搜尋欄和 Hero 區域一致性（紫粉主題）
  • 為搜尋欄容器實現玻璃擬態設計模式

🧹 程式碼清理

  • 從 global.css 刪除所有未使用的淺色模式主題變數

🏷️ 分類更新

  • 最佳化分類邏類邏輯，徹底消除頭像和裝飾庫上的「其他」分類
  • 將先前未分類的項目重新分配至細粒度分類（如角色與吉祥物、氛圍與風格）
  • 擴展關鍵字匹配以提升自動分類準確性
  • 確保所有項嚴格單一分類，避免重複

🔗 導覽

  • 最佳化導覽列 logo 區域的 logo 和文字
  • 打磨導覽列整體 UI
v1.1.7

版本 1.1.7

🎯 預覽彈窗操作

  • 將 Discord 頭像庫 和 Discord 裝飾庫 的預覽彈窗操作按鈕移至更清晰的佈局
  • 統一 Discord 頭像庫和 Discord 裝飾庫的操作按鈕寬度為 w-72
  • 在 Discord 頭像庫預覽中新增「用這個頭像 → 挑選裝飾」
  • 在 Discord 裝飾庫預覽中新增「用這個裝飾 → 挑選頭像」
  • 統一 Discord 頭像庫和 Discord 裝飾庫的 CTA 圖示
  • 在 Discord 頭像庫和 Discord 裝飾庫的預覽操作中新增「請我喝杯咖啡」按鈕
  • 移除 Discord 頭像庫的「複製頭像名稱」按鈕及相關程式碼

🎞️ GIF 產生

  • 「儲存動態 GIF」現可在兩個頁面的預覽視窗內使用懶加載的 FFmpeg 直接產生
  • 在 Discord 頭像庫和 Discord 裝飾庫新增產生進度指示和失敗回饋
  • GIF 產生會遵循 Discord 頭像庫和 Discord 裝飾庫目前選中的裝飾疊加層
  • 整合了「擷取靜態圖」工作流並路由至 GIF 影格擷取器

🎨 疊加層與體驗

  • 透過漸變 + 輕微模糊和閃光提示膠囊，增強兩個頁面的懸停疊加層
  • Discord 頭像庫和 Discord 裝飾庫的行動端文案適配：輕觸預覽（行動端）、點擊預覽（桌面端）
  • 對齊兩個頁面的疊加層尺寸和圓角，使其匹配頭像容器
  • 在 Discord 頭像庫預覽中套用預設裝飾（treat_ghost），並支援從 Discord 裝飾庫跨頁傳遞裝飾

🏠 首頁

  • 在 首頁 將「用表情遮臉」更名為「一鍵遮臉」，並切換圖示為 /emojiface-192x192.png
  • 將「Discord 頭像裝飾庫」更名為「Discord 裝飾庫」
v1.1.6

版本 1.1.6

🔗 導覽更新

  • 用指向 /other-tools 的「其他工具」替換導覽列的「討論」項
  • 在行動選單中同步更改以保持導覽一致

📱 行動選單增強

  • 將行動選單改為右對齊的窄浮動面板
  • 為選單面板新增淡入背景和向上滑入動畫
  • 透過半透明遮罩實現點擊外部關閉
  • 在面板中添加滑鼠跟隨高亮以提供視覺回饋
  • 透過微妙的 translate-x 動效增強選單項懸停效果

🛠 其他工具頁面

  • 將「用表情遮臉」更新為「EmojiFace - 一鍵遮臉」
  • 刷新為隱私優先能力的描述
  • 切換為圖示 /emojiface-192x192.png（w-10 h-10，rounded-lg）
  • 新增對 tool.icon 的渲染支援，以 emoji 為回退

🖼 首頁更新

  • 將預設資料預覽裝飾改為 treat_ghost
  • 將「其他工具」連結圖示更新為 lootbox，並置於連結首位
v1.1.5

版本 1.1.5

✨ 功能更新

v1.1.4

版本 1.1.4

📝 內容更新

  • 新增部落格文章：《免費上新！裝飾庫新增 30+ 款免費 Discord 頭像裝飾！》
  • 精選新 Discord 頭像裝飾，包括 The Final Peel、Warframe Clem、Dart Monkey 和 Infinite Swirl
  • 透過詳細的新裝飾特性描述增強部落格內容
  • 為新部落格文章添加全面的 SEO 最佳化

🔧 技術改進

  • 修復新部落格文章 URL 的客戶端路由配置
  • 在 src/index.jsx 中為 /blog/new-free-discord-avatar-decorations 添加正確的路由對應
  • 用新部落格文章條目更新 sitemap.xml
  • 用新部落格文章的精選裝飾圖片增強 sitemap-images.xml

🎨 新裝飾展示

  • 展示 The Final Peel 裝飾及詳細預覽
  • 為遊戲愛好者精選 Warframe Clem 裝飾
  • 突出 Dart Monkey 裝飾的獨特設計元素
  • 呈現具有動態視覺效果的 Infinite Swirl 裝飾
v1.1.3

版本 1.1.3

📱 行動導覽增強

  • 透過在行動裝置顯示「Discord 頭像裝飾」品牌文字，增強行動導覽
  • 在小螢幕上提升品牌可見度和識別度
  • 調整字體大小以最佳化行動端顯示（行動端 text-lg，桌面端 text-xl）
  • 僅在桌面端保留副標題可見，以獲得更簡潔的行動介面
  • 透過更好的品牌識別增強行動使用者體驗

🎯 使用者互動改進

  • 實現選擇頭像時自動捲動到資料預覽區域
  • 為選擇裝飾時添加平滑捲動動畫到資料預覽
  • 透過選擇後自動聚焦預覽，增強使用者工作流
  • 透過無縫導覽到預覽區域提升使用者體驗
  • 添加 100ms 延遲以確保 DOM 更新完成後再捲動
  • 配置平滑捲動行為並居中定位

☕ 請我喝杯咖啡整合

  • 將「請我喝杯咖啡」按鈕字體樣式更新為符合原始設計規範
  • 套用 Cookie 字體族，字號 18px，以保持品牌一致
  • 調整 emoji 尺寸為 16px 以獲得更好的視覺平衡
  • 保持黃色背景（#FFDD00）和黑色文字樣式
  • 確保按鈕樣式符合官方 Buy Me a Coffee 設計指南

🎨 UI/UX 打磨

  • 統一「儲存動態 GIF」、「擷取靜態圖」和「請我喝杯咖啡」按鈕的寬度
  • 最佳化操作按鈕之間的垂直間距，以獲得更好的視覺層次
  • 透過 w-72 寬度標準增強按鈕佈局一致性
  • 將按鈕容器間距從 gap-2 最佳化為 gap-3，以獲得更好的視覺平衡
  • 精簡按鈕樣式，呈現更專業的外觀
v1.1.2

版本 1.1.2

🔍 搜尋欄改進

  • 從搜尋框移除漸變邊框背景效果，呈現更乾淨的外觀
  • 在保持原始配色的同時消除模糊的漸變發光效果
  • 透過實線邊框簡化搜尋框樣式，提升可讀性
  • 在搜尋介面提升視覺清晰度，減少視覺雜訊
  • 增強焦點和懸停狀態，提供更好的互動回饋

🎨 UI/UX 增強

  • 精簡搜尋元件設計，呈現更專業的外觀
  • 在移除模糊效果的同時保持粉、紫、藍配色
  • 透過更清晰的視覺邊界提升搜尋框可存取性
  • 透過統一的視覺一致性增強各搜尋介面

🎞️ GIF 影格擷取器改進

  • 為 GIF 影格擷取器頁面添加導覽列（Navbar）元件，保持站點導覽一致
  • 整合頁尾元件，保持各頁面結構統一
  • 將 SEO meta 關鍵字更新為「免費動態 GIF 影格擷取器、GIF 影格擷取器、將 GIF 圖片分割為影格」
  • 重組頁面結構，確保導覽和頁尾在所有狀態下正確顯示
  • 透過正確的元件整合增強頁面與其他站點的頁一致性

🔗 導覽與首頁更新

  • 為首頁連結區的「GIF 影格擷取器」添加專用 GIF 圖示連結
  • 將 GIF 影格擷取器連結置於連結區首位，提升可見度
  • 實現與其他首頁連結一致的樣式和懸停效果
  • 透過首頁直接存取 GIF 擷取工具增強站點導覽
  • 提升使用者對 GIF 影格擷取器功能的發現度
v1.1.1

版本 1.1.1

📄 新頁面

  • 新增包含公司資訊和使命宣言的「關於我們」頁面
  • 建立包含完整 Cookie 使用資訊的「Cookie 政策」頁面
  • 實現具有多種支援管道和回應時間的「聯絡支援」頁面
  • 所有新頁面均具有一致的設計語言和 SEO 最佳化

🎨 頁尾增強

  • 將頁尾佈局從 3 列重組為 4 列網格，獲得更好的平衡
  • 在現有板塊旁建立新的「關於我們」板塊
  • 將「關於我們」和「聯絡支援」連結從「法律」移至新的「關於我們」板塊
  • 改進頁尾視覺層次和連結組織
  • 增強響應式設計，提升行動端體驗

🔗 導覽與路由

  • 為所有新頁面添加正確的路由配置
  • 更新 prerender 路由以包含新頁面，提升 SEO
  • 修復新建頁面的 404 錯誤
  • 確保所有頁尾連結正常可用

🎯 使用者體驗

  • 透過清晰的法律和支援資訊改進站點導覽
  • 透過詳細的 Cookie 和隱私資訊增強透明度
  • 透過專用聯絡頁面簡化支援流程
  • 更好地組織頁尾板塊，便於資訊發現
v1.1.0

版本 1.1.0

🎨 視覺增強

  • 為評價區域完全重新設計背景漸變系統
  • 添加具有深空美學的多層宇宙漸變
  • 透過冷暖色調過渡實現動態顏色疊加
  • 透過徑向漸變聚光增強中心焦點效果
  • 添加帶有微妙幾何圖案的動畫網格背景
  • 引入閃爍的星光效果以增強視覺深度

✨ 動態效果

  • 透過多個光源重新設計動態光效系統
  • 添加具有平滑過渡的流動光效動畫
  • 實現粒子光效以增強氛圍
  • 建立具有不同強度的新動畫光效元素
  • 在不同區域之間添加平滑的漸變過渡
  • 透過改進的光照分佈增強視覺焦點

🎭 頭像系統

  • 用新的彩色設計更新使用者評價頭像
  • 添加明亮活力主題的黃色頭像
  • 添加經典熱情主題的紅色頭像
  • 添加具有動態彩虹效果的彩色波浪頭像
  • 添加具有驚艷光折射的稜鏡波浪頭像
  • 添加神秘暗黑優雅的午夜稜鏡頭像
  • 添加柔和色調的粉彩頭像

🚀 效能改進

  • 最佳化背景渲染以提升效能
  • 移除冗餘的漸變過渡程式碼
  • 精簡動態光效以獲得更流暢的動畫
  • 改進程式碼結構與可維護性
  • 增強不同元件間的視覺一致性

🎯 使用者體驗

  • 增強評價區域的視覺層次
  • 透過更好的對比度提升可讀性
  • 添加更具吸引力的視覺元素以提升使用者留存
  • 打造更具沉浸感和現代美感的设计
  • 提升整體視覺吸引力和專業外觀

更多更新即將到來

我們持續開發新功能與改進。敬請期待更多精彩更新！