Skill 多語言閱讀指南
emil-design-eng用途、用法與原始來源
這項技能體現了 Emil Kowalski 關於 UI 潤色、元件設計、動畫決策以及讓軟體感覺出色的無形細節的理念。
原文擷取時間:
- SKILL.md
.agents/skills/emil-design-eng/SKILL.md- 儲存庫 Star
- 5,871
- 儲存庫最近更新
- 2026-08-29
- 能力分類
- Agent 工作流程
- 最近採集時間
授權：MIT
流程片段用來協助閱讀上游說明。本頁沒有執行第三方 Skill，不屬於實測評測。
下面的用途與操作片段來自上游文件，由本站整理並翻譯，和另行標示的 Codez 編輯分析分開呈現。
這個 Skill 能做什麼
這項技能體現了 Emil Kowalski 關於 UI 潤色、元件設計、動畫決策以及讓軟體感覺出色的無形細節的理念。
如何使用：上游操作流程
味覺是後天培養的，而非天生的。
好的品味並非個人喜好，而是一種後天培養的直覺：一種超越表象、洞見本質的能力。這種能力需要你不斷接觸優秀的作品，深入思考事物為何能帶來愉悅的感受，並且堅持不懈地練習。在設計使用者介面時，不要只滿足於讓它能用。要研究優秀介面的設計理念，探究背後的原因。反向工程動畫，仔細研究互動過程，保持好奇。
原文片段 · L12 ↗原文片段 · ↗
Before: transition: all 300ms
After: transition: transform 200ms ease-out
────────────────────────────
Before: scale(0)
After: scale(0.95)環境與相依需求
本次未從該檔案選出獨立的環境需求片段，不代表無須相依套件。請繼續核對儲存庫的安裝說明和引用檔案。
限制與結果檢查
永遠不要按比例製作動畫（0）
現實世界中沒有任何東西會完全消失然後重新出現。動畫元素來自scale(0)看起來像是從天而降。從…開始scale(0.9)或者更高，再加上一定的透明度。即使是幾乎看不見的初始比例，也能讓入口感覺更自然，就像一個即使癟了也依然能看出形狀的氣球。
開始使用前
- 先核對支援的 Agent 宿主和儲存庫安裝說明。保留完整 Skill 目錄及其引用的腳本、資源和文件，只複製 SKILL.md 可能遺漏相依需求。
- 向 Agent 提供實際輸入、預期輸出和驗收標準。呼叫方式與可用工具取決於宿主環境，本站不假定存在通用的安裝指令。
- 先在暫存專案或輸入副本上試用。涉及修改檔案、遠端服務或計費資源的操作，應逐項核對後再授權。
- 依照原文檢查項目和自己的需求驗證輸出。成功觸發或儲存庫 Star 較高，都不能證明結果正確。
繼續閱讀原始文件
- 設計工程
- 味覺是後天培養的，而非天生的。
- 未見的細節複合
- 美麗是一種槓桿
- 審閱格式（必填）
- 動畫決策框架
- 1這個動畫需要製作嗎？
- 2其目的是什麼？
- 3它應該使用哪種鬆弛方法？
- 4它應該有多快？
- 感知表現
- 春季動畫
- 何時使用彈簧
- 基於彈簧的滑鼠交互
- Spring 配置
- 可中斷性優勢
- 按鈕必須反應靈敏。
- 永遠不要按比例製作動畫（0）
- 讓彈出視窗感知來源
- 工具提示：跳過後續懸停延遲
- 使用 CSS 過渡效果而非關鍵影格來實現可中斷的 UI
- 使用模糊效果掩蓋不完美的過渡效果
- 使用 @starting-style 為進入狀態加入動畫效果
- 用百分比翻譯Y
- scale() 函數也會縮放子項。
- 3深度D變換
- 變換原點
- 動畫的剪下路徑
- 內嵌形狀
- 標籤頁具有完美的顏色過渡
相關 Skill
翻譯與介紹範圍
本頁從固定版本的上游 SKILL.md 整理用途與操作片段，譯文使用輔助翻譯。它不是完整手冊，也不代表經過相容性實測；使用前請核對原文及其引用檔案。
介紹依據下方列出的固定版本；目前儲存庫動態和目錄擷取時間分開呈現。
- 固定版本來源
- 閱讀原文 ↗
- 原文擷取時間
- 來源提交版本
cf865e94de7729751c747171785b6ce57e7b178c- 原文 SHA-256
9d261c73de2c2c4dc5662ab20117b8e045c7b71958f8042acf037325444ebe6b