Client: Reson8 Agency: Pony Role: Webflow Development, Web Animations (GSAP) Live: reson8.dev

Reson8 builds hyper-customizable speech recognition infrastructure, an ASR engine that adapts to domain-specific language (healthcare, legal, enterprise) in minutes rather than weeks. Working as a development partner to Pony, the agency behind the design, my job was to bring it to life in Webflow with a level of animation craft that matched the sophistication of the product itself.

The site is dark, technical, and precise, and the interactions needed to feel the same way.

Hero with industry-switching text and video playback. The hero section dynamically cycles through industries: healthcare, legal, automotive,etc. with smooth text transitions that communicate the product's adaptability without a single click from the user. Paired with a video asset that plays in sync, the opening sets a tone of controlled motion and technical confidence from the first second.

Custom button hover animations. I built a custom hover animation system for the CTAs that aligns with Reson8's brand character,precise, slightly unconventional, and tactile. The kind of detail most visitors won't consciously notice but would notice if it were missing.

Custom slider with autoplay, progress, and media switching. One of the more technically involved components: a customized slider with autoplay behavior, a visible progress indicator, and per-slide media that switches between video and Lottie assets on each transition. This required coordinating animation timelines, asset preloading, and state logic to keep everything smooth and in sync.

Scroll-triggered reveals and 2D physics in footer. Custom reveal animations run throughout, tuned to each section's layout rather than applied as a blanket style, with timing and easing calibrated individually given how visible they are against the dark, high-contrast design. The page closes with a 2D physics simulation just before the footer: branded playful elements. It's a deliberate tonal shift on an otherwise serious page, the kind of executional detail that makes the site stick.

A technically demanding build where the animation layer is the product. Every interaction was custom-engineered to fit the brand rather than adapted from a template, resulting in a site that feels as precise and capable as the technology it's selling.