前端審美提升
前端審美提升
展示內容
描述
獨特的字體個性 深色賽博朋克美學 非對稱動態佈局 精心編排的載入動畫 沉浸式的氛圍營造
推薦自
nene@YouMind
為什麼我們推薦這個技能
厭倦了千篇一律的「AI slop」設計？此技能將助您擺脫平庸，透過獨特的排版、大膽的色彩、精妙的動效、創新的空間佈局和富有深度的背景，打造令人驚豔的前端介面。它提供了一套實用的美學指南，讓您的作品在眾多網站中脫穎而出，真正實現視覺上的突破。
指令
避免平庸的"AI slop"美學，創造令人驚喜的獨特前端。
## 五大核心維度
**1. 排版Typography**
- ❌ 禁止：Inter、Roboto、Arial、系統字體
- ✅ 選擇：獨特、有個性的字體
- ✅ 搭配：展示字體+ 正文字體，高對比
- ✅ 技巧：字重極端對比（100 vs 900），字號大跨距（3x+）
**2. 色彩Color & Theme**
- ✅ 統一美學，用CSS 變數維護
- ✅ 主導色+ 鮮明點綴色
- ❌ 避免：紫色漸層+ 白色背景
- ✅ 靈感：IDE 主題、文化美學
**3. 動效Motion**
- ✅ CSS 動畫優先（HTML）
- ✅ Motion 庫
- ✅ 聚焦高影響力：一次精心編排的頁面載入> 散亂的微交互
- ✅ 滾動觸發、懸停驚喜
**4. 空間佈局Spatial**
- ✅ 非對稱、重疊、對角線流動
- ✅ 打破網格、大膽留白OR 受控密集
**5. 背景細節Backgrounds**
- ✅ 創造氛圍與深度
- ✅ 漸層網格、雜訊、幾何圖案
- ✅ 分層透明、戲劇陰影、裝飾邊框
## 關鍵原則
- 每個設計都應不同，避免重複收斂
- 實現複雜度匹配美學願景
- 極繁需精心設計，極簡需克制精確
- 跳出思維定式，做出真正獨特的選擇
⚡ 一行精華版
獨特字體+ 大膽配色+ 精心動畫+ 突破版面配置+ 氛圍背景= 令人難忘的前端
拒絕：Inter/Roboto、紫色漸層白底、千篇一律佈局
📋 快速檢查清單
維度 檢查項
字體 是否避開Inter/Roboto？是否有特色搭配？
色彩 是否有統一主題？是否避免紫色漸層？
動畫 是否有精心編排的載入效果？
佈局 是否突破常規網格？
背景 是否創造深度和氛圍？
相關技能
查看全部
圖片賽博龐克
將使用者場景編譯為《賽博龐克：邊緣行者美學》式、酸性霓虹硬邊風格的原生中文 ImageGen 與英文 Midjourney 靜幀提示詞。適用於角狀輪廓、銳利影塊、非自然高純色照明，二維圖形衝擊優先於零件密度；
寫作公眾號排版美化與視覺建議助手
專為個人號主、企業號營運者及不擅長設計的新手打造的排版美化助手。輸入文章類型和內容後，會自動推薦標題層級、段落長度、重點標註方式及分隔線位置，提供基於品牌色的配色方案、字體大小建議和配圖風格關鍵詞。支援生成適用於主流編輯器的排版範本程式碼或 Markdown 樣式，讓不懂設計的營運者也能輕鬆打造專業、美觀且具良好閱讀體驗的公眾號文章。
PPT開發者新粗獷主義編輯風格
將您的主題內容、文章、知識點、項目復盤、課程文案或工具介紹，轉化為一組具有「開發者新粗獷主義編輯風格」的橫版投影片。整體風格融合新粗獷主義設計、獨立雜誌排版和開發者終端美學：米白背景、粗黑邊框、硬陰影、高對比色塊、超粗標題、等寬字體、網頁/終端/卡片模組化佈局，形成強烈的技術內容表達感。 本技能會先提煉內容結構，再為每頁確定一個核心觀點，自動生成標題、解釋句、知識點模組、結論語和合適的視覺元件。它特別適合 AI 工具介紹、Agent 實踐、開源專案拆解、課程內容整理、方法論總結、產品功能說明與技術復盤等內容場景。 最終輸出為 16:9 橫版投影片，整體視覺統一、閱讀清晰、留白充足、風格鮮明，呈現出一種「像開源專案作者在做技術分享，又像獨立設計雜誌在說故事」的高級表達效果。
資訊
- 版本
- v1
- 更新時間
- 執行點數
- 依實際用量
- 模型
- 自動選擇
