Hero Metro Tick

SkillWeb & browsing

Lets your agent generate an animated metro-style timeline graphic that visualizes a shipping workflow.

Then ask your AI: use the Hero Metro Tick skill

Details

Instructions available. Your AI can read the instructions. Execution depends on the setup they require.

Account requirements not reviewed. Check the skill instructions before use; Ahel provides instructions and does not run this skill.

No other account needed.

Add it as a step in a pipeline you build on Ahel, or connect Ahel to Claude, ChatGPT, Cursor, Claude Code or Codex and ask your AI to use it.

About this skill

A collection of AI Prompts for generating [cool HTML animated web pages], covering animation effects, 3D visualization, PPT-style presentations, UI beautification, and more.

What this skill tells your AI

The instructions your AI receives, as published by unclecheng-li/ai_animation in skills/ui2v-motions/01_动效库/itelmn/hero-metro-tick/SKILL.md and read by Ahel’s review.

A metro track draws across the frame, station ticks appear, and an orange train marker travels from Init to Ship. It is a timing metaphor for shipping workflows.

Purpose

Devtools and pipeline storytelling
Precise reveal choreography with many tracks
Homepage heroes that feel scheduled, not floaty

Specs

1920x1080 @ 30fps, 4.5 seconds
Separate tracks for ticks, stations, and the train

Usage

ui2v install hero-metro-tick, then scrub the train path in HyperFrames preview.

Notes

Keep station labels short. Longer copy breaks the transit diagram clarity.

Signals

GitHub stars: 1k
Forks: 111
Last commit: Oct 2026

Ahel review

K5info
obfuscation
K5info
obfuscation (in registry-item.json)

Automated review, not a security audit. Ruleset v1+k2.

Advanced

Item type: skill
Key: hero-metro-tick
Source: github.com/unclecheng-li/ai_animation

github.com/unclecheng-li/ai_animation