-
Origin-aware animation: An element animates out of its trigger, like a popover growing from the button that opened it instead of from its own center which is the default in CSS.
- Related: Transform origin is the anchor point a scale or rotation grows or spins from. It's the CSS property that makes this work.
-
Rubber-banding: Resistance and snap-back when you drag past a boundary (the iOS overscroll feel).
-
Number ticker: Digits rolling or counting up to a value.
- Pair it with Tabular numbers, which are fixed-width digits so numbers don't shift around as they change. They're essential for tickers, timers, and counters.
-
Skeleton / Shimmer: A placeholder with a moving sheen shown while content loads.
-
Parallax: Background and foreground move at different speeds while scrolling, creating depth.
-
Momentum: Motion that carries velocity, especially after a drag or interruption.
- Related: Velocity is how fast and in which direction an element is moving. A spring carries it into the next animation when interrupted, so a flicked element keeps its speed.
- Related: Drag is moving an element by grabbing it, often with momentum when released.
Test run: six loose descriptions of motion effects. Each returned the glossary term, with related terms where they apply. Short run; the glossary is a fixed list, so effects outside it get an approximation.
它做什麼
一個網頁動畫的反查詞表。你描述自己看到或感覺到的（「有彈性」「滑出去」「自己畫出來」），它回傳相符的術語與定義，最貼切的排在最前，再加一兩個相近的備選，並說明差別（例如 Clip-path 與 Mask，或 Pop in 與 Bounce）。它依詞表原文引用，沒有完全對得上時會直說，並且只在自己的清單內作答，不會編造詞彙。詞表涵蓋進場與退場、時序編排、變形、狀態之間的轉場、捲動、回饋、緩動、彈簧、循環動態、細節效果、效能與動畫原則。
輸出
術語、一句話定義，必要時附上最接近的備選。
適合什麼場景
知道想要什麼效果、卻叫不出名字的開發者、設計師與寫作者，想要一個準確的詞去向設計師或 AI 提需求。
低風險：純指令檔，沒有腳本，不連網，不寫檔。它是一份固定的詞表，所以詞表裡沒有的效果，只會給出近似說法，或直說缺少對應術語。已用六段含糊的描述試用一次：每段都回傳了詞表裡的術語，並在適用時附上相關術語。沒有帶問題呼叫時，它只回覆一句問候。作者 Emil Kowalski，MIT 授權。