Back to Work
Motion2025Cohesity

CSS Animated Isographics

A set of animated CSS isographics created for Cohesity product and solution pages, testing a faster workflow where designers could create source graphics, animate them, and hand off production-ready assets to developers.

CSS Animated Isographics

Challenge

The team needed to understand whether designers could own more of the production workflow without relying on developers for every animation pass. The goal was to reduce production time while preserving quality, consistency, and implementation readiness for the website.

Approach

Built four animated product graphics around Active Directory, dashboard UI, backup and recovery, and Microsoft 365. I created the source SVGs, animated them with CSS keyframes, stroke drawing, staggered reveals, and scroll-triggered playback, then structured the files so developers could place them into Cohesity product and solution pages with minimal extra production work.

Outcome

A new design-to-dev workflow for corporate website graphics: designers could create, animate, and prepare lightweight browser-rendered assets before handoff, helping reduce production cycles and making motion easier to scale across product and solution pages.

Gallery