Production Vibes: Reversible Motion Layer

An events production company running WordPress on a purchased Elementor theme. The brief was to lift the brand and add motion without rebuilding the site, and without taking on the risk of editing Elementor's own page data.

What I built

A custom plugin, productionvibes-enhance, containing two deliberately separate layers.

A brand layer. CSS only, touching no Elementor page data, so deactivating the plugin restores the previous appearance exactly. That constraint was the point: the client could undo my work at any moment without a developer, which is what made the change safe to ship on a site that is earning money.

A motion layer. Scoped strictly to motion and transitions, with no colour, type, spacing or layout changes. Every rule stays inert until the script adds a class to the document, so a failed or slow script leaves a working site rather than a half-animated one. Motion includes the homepage services marquee and reveal transitions, with prefers-reduced-motion respected throughout.

Why build it this way

On a live site earning money, the risk is not that an animation looks wrong. It is that a change cannot be undone, or that a slow connection leaves a visitor looking at a broken page. Both layers were designed so the worst case is that the site looks like it did before.

Stack

WordPress, Elementor, CSS, JavaScript.

Live site: https://productionvibes.com