Skip to content
← Back to experiment
[ EXP-021 / PLAYGROUND MODE ]

Orbit Loader / Playground

Send a small satellite around a central signal.

LoaderReactWeb APIsCSSclick
EXP-021 / LIVE PREVIEW
STATIC / REDUCED MOTION
REDUCED MOTION / STATIC RESULT

Reduced motion is enabled. This preview displays the stable result without zoom, displacement or scrambling.

01 / Overview

Send a small satellite around a central signal. An independent interaction study built for the Resources archive.

02 / How it works

Rotate a ring with an offset dot for a continuous orbital loop.

03 / Implementation

Actual React demo source. Import this component with the archive stylesheet and pass variant (orbitLoader), values, playing, replay and reduced props. The image demos use /images/resources-bg.png.

Loading implementation…

04 / Parameters

ParameterTypeRangeDefault
DurationNumber0.4–3s1.2s

05 / Usage & accessibility

Start manually with Play. Pause freezes the timeline; Replay restarts it. Reduced motion shows the finished composition. Loaders demonstrate indeterminate waiting.

Requires a current browser with Web Animations, requestAnimationFrame and Pointer Events. Background imagery is decorative; essential labels remain in the document. The magnetic target supports tap and keyboard activation.

Related experiments.