{"id":"f3d14705-a23a-462d-95ea-2345cda8481e","shortId":"aQGnzN","kind":"skill","title":"reduced-motion-first-terminal-animation","tagline":"Pause terminal animations when the user requests reduced motion, then resume cleanly without tearing the rest of the UI.","description":"# SKILL: Reduced-Motion First Terminal Animation\n**Domain:** terminal-ui\n**Trigger:** Build any animation that should stay dormant until the user explicitly opts into motion.\n**Source Pattern:** Distilled from reviewed terminal rendering, layout, animation, and accessibility implementations.\n\n## Core Method\nRead the local reduced-motion preference before spawning timers and treat `null` as “paused.” Hook animations into a single clock that can unregister itself whenever the animation is hidden, so the loop never races multiple independent timers while respecting accessibility.\n\n## Key Rules\n- Evaluate get initial settings prefers reduced motion (or equivalent) on mount and refuse to start motion if true.\n- Share one clock (e.g., use animation frame) so every animation breathes in sync and can be paused by passing `null`.\n- Never queue set timeout when reduced motion or pause is active; return the last drawn frame instead.\n- Resume from the current global time when motion becomes allowed again so there is no jump.\n\n## Example Application\nWhen animating a loading spinner in a toolbar, wire the spinner to the shared clock and keep it frozen until the user unsets prefers reduced motion; the rest of the layout retains its state, and the spinner returns to the proper frame without rewinding.\n\n## Anti-Patterns (What NOT to do)\n- Starting independent timers before checking reduced-motion and then canceling them later.\n- Letting each animated component manage its own clock, which prevents pausing all motion with a single flag.\n- Resetting animation timelines when motion resumes, which causes jarring jumps.","tags":["reduced","motion","first","terminal","animation","cskill","agents","ychampion","agent-skills","ai-agents","cli","coding-agents"],"capabilities":["skill","source-ychampion","skill-reduced-motion-first-terminal-animation","topic-agent-skills","topic-ai-agents","topic-cli","topic-coding-agents","topic-context-engineering","topic-developer-tools","topic-mcp","topic-multi-agent","topic-terminal-ui"],"categories":["cskill-agents"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/ychampion/cskill-agents/reduced-motion-first-terminal-animation","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add ychampion/cskill-agents","source_repo":"https://github.com/ychampion/cskill-agents","install_from":"skills.sh"}},"qualityScore":"0.467","qualityRationale":"deterministic score 0.47 from registry signals: · indexed on github topic:agent-skills · 34 github stars · SKILL.md body (1,624 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-04-22T00:56:55.052Z","embedding":null,"createdAt":"2026-04-18T22:21:06.386Z","updatedAt":"2026-04-22T00:56:55.052Z","lastSeenAt":"2026-04-22T00:56:55.052Z","tsv":"'access':62,106 'activ':157 'allow':173 'anim':6,9,32,40,60,82,93,132,136,183,248,264 'anti':227 'anti-pattern':226 'applic':181 'becom':172 'breath':137 'build':38 'cancel':243 'caus':270 'check':237 'clean':18 'clock':86,129,196,253 'compon':249 'core':64 'current':167 'distil':54 'domain':33 'dormant':44 'drawn':161 'e.g':130 'equival':117 'evalu':109 'everi':135 'exampl':180 'explicit':48 'first':4,30 'flag':262 'frame':133,162,223 'frozen':200 'get':110 'global':168 'hidden':95 'hook':81 'implement':63 'independ':102,234 'initi':111 'instead':163 'jar':271 'jump':179,272 'keep':198 'key':107 'last':160 'later':245 'layout':59,212 'let':246 'load':185 'local':68 'loop':98 'manag':250 'method':65 'motion':3,15,29,51,71,115,124,153,171,207,240,258,267 'mount':119 'multipl':101 'never':99,147 'null':78,146 'one':128 'opt':49 'pass':145 'pattern':53,228 'paus':7,80,143,155,256 'prefer':72,113,205 'prevent':255 'proper':222 'queue':148 'race':100 'read':66 'reduc':2,14,28,70,114,152,206,239 'reduced-mot':27,69,238 'reduced-motion-first-terminal-anim':1 'refus':121 'render':58 'request':13 'reset':263 'respect':105 'rest':22,209 'resum':17,164,268 'retain':213 'return':158,219 'review':56 'rewind':225 'rule':108 'set':112,149 'share':127,195 'singl':85,261 'skill':26 'skill-reduced-motion-first-terminal-animation' 'sourc':52 'source-ychampion' 'spawn':74 'spinner':186,192,218 'start':123,233 'state':215 'stay':43 'sync':139 'tear':20 'termin':5,8,31,35,57 'terminal-ui':34 'time':169 'timelin':265 'timeout':150 'timer':75,103,235 'toolbar':189 'topic-agent-skills' 'topic-ai-agents' 'topic-cli' 'topic-coding-agents' 'topic-context-engineering' 'topic-developer-tools' 'topic-mcp' 'topic-multi-agent' 'topic-terminal-ui' 'treat':77 'trigger':37 'true':126 'ui':25,36 'unregist':89 'unset':204 'use':131 'user':12,47,203 'whenev':91 'wire':190 'without':19,224","prices":[{"id":"04acaa66-bca5-44dd-aec4-1363d29790fc","listingId":"f3d14705-a23a-462d-95ea-2345cda8481e","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"ychampion","category":"cskill-agents","install_from":"skills.sh"},"createdAt":"2026-04-18T22:21:06.386Z"}],"sources":[{"listingId":"f3d14705-a23a-462d-95ea-2345cda8481e","source":"github","sourceId":"ychampion/cskill-agents/reduced-motion-first-terminal-animation","sourceUrl":"https://github.com/ychampion/cskill-agents/tree/main/skills/reduced-motion-first-terminal-animation","isPrimary":false,"firstSeenAt":"2026-04-18T22:21:06.386Z","lastSeenAt":"2026-04-22T00:56:55.052Z"}],"details":{"listingId":"f3d14705-a23a-462d-95ea-2345cda8481e","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"ychampion","slug":"reduced-motion-first-terminal-animation","github":{"repo":"ychampion/cskill-agents","stars":34,"topics":["agent-skills","ai-agents","cli","coding-agents","context-engineering","developer-tools","mcp","multi-agent","terminal-ui"],"license":"mit","html_url":"https://github.com/ychampion/cskill-agents","pushed_at":"2026-04-04T14:13:23Z","description":"Agent skills for coding CLIs, multi-agent runtimes, context engines, MCP extensions, and terminal tooling. Instead of using claude code's source code, give your agent skills to create your own!","skill_md_sha":"47441ff36d732c3c6e0b8bb39ee34af384f47708","skill_md_path":"skills/reduced-motion-first-terminal-animation/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/ychampion/cskill-agents/tree/main/skills/reduced-motion-first-terminal-animation"},"layout":"multi","source":"github","category":"cskill-agents","frontmatter":{"name":"reduced-motion-first-terminal-animation","description":"Pause terminal animations when the user requests reduced motion, then resume cleanly without tearing the rest of the UI."},"skills_sh_url":"https://skills.sh/ychampion/cskill-agents/reduced-motion-first-terminal-animation"},"updatedAt":"2026-04-22T00:56:55.052Z"}}