●上課時間：2025年04月22日
●上課地點：揚京網銷二部多功能教室
●主講人：碧茹
●感謝boss的早餐加持，讓大家在溫暖與飽足中開啟一天的學習模式。這堂課從設計基礎理論到實務技巧，全面分享了網站美感提升的多個關鍵面向，內容豐富而實用。以下是當日精彩重點整理：
●使用者視覺判斷的重要性：
現代網路節奏快速，使用者平均只花0.05秒便直覺判斷一個網站的好壞；若第一眼感覺不好，有高達88%的使用者選擇不再回訪。碧茹使用這段話來當開場，告知大家網站設計絕不只是裝飾，更是品牌與使用者溝通的第一座橋樑，良好的設計不只帶來美感，更能迅速建立信任感，延長停留時間，最終提升轉換率，因此，設計師必須有「一瞬間打動人心」的思維，從第一畫面就精準傳達專業與吸引力。
●大圖與開場動畫運用：
大尺寸高質感圖片，能直接傳遞品牌氛圍與專業感，比小型圖文區塊更具視覺衝擊力。
而開場動畫則像是為使用者鋪陳進場儀式，使網站不只是靜態的呈現，而是有節奏感的體驗，好的開場動畫能柔和地引導視線，增加期待感，也為後續的內容展開鋪陳情緒。課堂中展示了幾間網站案例，具體說明如何藉由大圖與動畫結合，創造層次豐富、吸睛且具有故事性的網站開場。
●文字與排版設計建議？
主標題字體選擇必須夠「搶眼」且「有個性」，才能在資訊爆炸的網路世界中脫穎而出。
而內文的字體則應以閱讀流暢性為主，推薦使用無襯線字體如 Noto Sans 或 Inter，這樣的搭配不僅讓資訊清楚傳達，也能避免使用者因排版凌亂而感到疲憊或困惑。同時，在設計中使用統一風格且質感良好的圖像與icon，能使整體視覺更加一致，形成一種「品牌專屬語言」。
此外，微動畫（如hover、載入時的小特效）則在細節中拉高整體精緻度，這些看似不經意的小互動，實際上能大幅提升使用者對網站專業度與用心程度的感知。
●套版應用與案例介紹：
網站建置利用套版模板來提升效率，但設計師的價值就在於，如何讓套版不只是套版。
透過色彩調整、版面微調、互動效果優化，設計師可以讓原本制式化的模板產生個性化變化，真正符合每一個品牌的需求與精神，課堂中針對多個實際案件進行了分析，說明如何根據產業特性與客戶需求，細緻調整風格，使每個網站看似相似但又各具靈魂，避免「千篇一律」的感覺。
●常用CSS技巧分享及工具與靈感資源推薦：
在技術應用層面，碧茹分享了多種實用的CSS技巧，例如使用 background-attachment: fixed 讓背景固定，能為網站增添空間感與視覺延伸效果；利用 mix-blend-mode 技術，則可以像Photoshop的圖層混合一樣，創造畫面層次感。
針對形狀控制，運用 clip-path 剪裁圖形，打破傳統矩形版型的束縛；而 -webkit-background-clip: text 則能實現漸層文字效果，增加視覺吸引力。此外，animation動畫的靈活運用（如跑馬燈、元素旋轉、3D位移）也是現代網站中不可或缺的吸睛元素，既能提升互動趣味性，也能強化網站整體節奏感。
●這堂課不僅帶來了豐富的實用技巧，更深入解析了每個設計選擇背後的邏輯與目的。透過對視覺基礎、細節互動、技術應用與設計思考的全面探討，讓大家理解到：設計不只是美化，更是策略、是溝通、是體驗管理。期望每位設計師能將這次的收穫，靈活運用到未來的每一個專案中，讓網站作品不僅具備吸引力與層次感，更能真正打動人心，展現出屬於自己的設計能量。
