Create tasteful circular/orbital HUD and aura animations around a Blender subject using source-derived arcs, dots, dashes, opacity, parallax, and restrained motion. Use when decorative circles, halos, orbit markers, scanner rings, or HUD effects must correlate with a logo/mascot rather than looking like random oversized rings.
Install
npx skills add https://github.com/roble3/cc-blender-skill --skill orbital-hud-motionSKILL.md
Orbital HUD Motion
Decorative circles are design elements, not filler. They must be derived from the reference composition and support the subject.
Design rules
- Keep the avatar/subject dominant; rings should frame, not trap or overpower it.
- Derive radii, arc breaks, marker positions, and dash density from the reference image when possible.
- Separate layers:
- far/background aura: faint, slow, soft;
- mid orbit: thin arcs/dashes;
- markers/dots: sparse and synchronized;
- foreground accents: rare and short-lived.
- Prefer opacity/emission/dash phase over large rotation/scale changes.
- Never animate all rings in the same direction/speed; use subtle counter-motion/parallax.
- Do not include context rings in the base avatar mesh/export unless explicitly requested.
Animation recipe
- Create an
HUD_CONTEXTcollection separate fromAVATAR_BASE. - Build arcs/dots from a manifest of normalized radii and angles.
- Keyframe:
- dash offset or arc reveal;
- emission strength pulse;
- subtle rotation (1–12 degrees per loop, not full spin unless requested);
- marker opacity/scale blips at beats.
- Render a contact sheet with subject-only and with-HUD views.
- Reject if rings obscure the face/silhouette or dominate the frame.
Hard rules
- No random full circles when the reference has broken arcs/dashed guides.
- No oversized markers unless the source has them.
- No HUD animation until static avatar baseline is locked.
- For GLB, use object transforms/material keyframes or document runtime requirements.
Scripts
scripts/orbit_layout_manifest.pycreates a source-independent orbit manifest from simple radii/angle parameters.
Related skills
frontend-designanthropics932KGuidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.prototypemattpocock852KBuild a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.hyperframes-animationheygen-com569KAll animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreographyhyperframes-creativeheygen-com539KNon-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use `hyperframes-animation`.
