logo

GSUnit.com

Welcome to GSUnit.com - The Groove Satisfactory Unit™ — where web dev meets design, UX/UI flows like rhythm, and every pixel hits on and off, but never out of beat.


Caterpillar Image Rotator

The theme was time as a fluid, not rigid - drifting like a current instead of ticking like a clock. The animation concept was about smooth motion with subtle unpredictability (like snowflakes or particles that never quite repeat).

We tied it to the idea of shifting perspectives - time doesn't just move forward, it drifts, bends, and sometimes feels stretched or compressed. We talked about possibly combining CSS transitions with JavaScript interval updates to give that "drifting through time" effect.


Caterpillar Image Rotator © Zee Raux


Loading images: 0%

"Crawl through visuals. One segment at a time."

Tech Summary:

The Caterpillar Image Rotator is a segmented image presentation system inspired by the organic, rhythmic motion of a caterpillar. It presents multiple rows of images, often in a 9:6 viewport, where:

  • Images move row-by-row or in opposing wave motion
  • Rotation is continuous, timed, or interaction-triggered
  • Responsive to screen resizes with dynamic reload
  • Built using vanilla JS, CSS animations, and PHP (if server-side customization is needed)

Features:

  • Custom image count per row
  • Auto or manual rotation
  • Support for image caching and lazy loading
  • Can be skinned to match different aesthetics

Optional UI Themes (Later)

Theme Name Description

  • Caterpillar Classic Smooth, calm slide in both rows - a steady crawl
  • Inchworm Pop Bounce animation per image segment like an inchworm hop
  • ZigZag Drift One row scrolls left while the other scrolls right
  • GlowLarva Neon-glow effect on hover with slow-motion crawl
  • CamoMorph Caterpillar-style transformation morphs images in place




BauGlide © Zee Raux - Flow your content sideways.


Tech Summary:

A horizontally scrollable interface component with:

  • Touch swipe support
  • Button-based smooth scrolling
  • Press-and-hold glide
  • Responsive design

Optional UI themes later:

  • BauGlide Neo (glassmorphism)
  • BauGlide Minimal (just essentials)
  • BauGlide Sonic (scrolls with sound effects)