Skip to content
Contact me

Motion and 3D that explains the product

Motion and 3D that explains the product is animation, 3D and imagery inside a web page that shows how the product works. Pavlo Zhydkykh makes Lottie and Rive animation, scroll motion, WebGL scenes and AI visuals for AI, fintech and B2B startups. Lottie or Rive starts at $1,000; the rest gets a fixed quote after a first call.

Does ChatGPT recommend your website?

Free report in 48 hours · 5 AI engines

Lottie or Rive
From $1,000
Web motion, 3D
Fixed quote
Price
Fixed in writing
Feedback
2 rounds
Runs on
Framer and Astro
After delivery
$30 / hour

Key takeawaysUpdated By

Key takeaways

  • Pavlo Zhydkykh offers five kinds of motion work: Lottie, Rive, web animation, 3D for the web and AI visuals.
  • A Lottie or Rive animation starts at $1,000; web animation, 3D scenes and AI visuals get a fixed quote after a first call.
  • Lottie animations are much smaller than the same motion as GIF or MP4, at the same quality.[2]
  • Browsers can animate transform and opacity on the compositor alone, so motion built on those two properties stays smooth on phones.[4]
  • WCAG 2.2 asks that motion triggered by interaction can be turned off, so every animation Pavlo ships has a reduced-motion version.[5]

What is motion design for the web?

Motion design for the web is animation, 3D and imagery built to run inside a web page rather than as a separate video. Web motion shows how a product works, guides the eye through a page and gives feedback when people click. Motion matters because good motion explains faster than text, while heavy or careless motion slows pages and makes some people feel sick.

Wikipedia: Motion graphics

Pavlo Zhydkykh

“Motion should explain the product or give feedback. Motion that does neither, I leave out, and the page loads faster.”

Pavlo Zhydkykh · Web designer and developer since 2016

Motion and 3D

Motion and 3D:
five services

Each service has its own page with prices, timeline and examples.

Fit check

Is Motion and 3D
right for you?

A good fit if

  • Your product is hard to explain with a still image or a paragraph.
  • The site runs on Framer or Astro, or Pavlo is building the site there.
  • You want motion light enough for a phone that respects reduced-motion settings.
  • You need a set of visuals in your brand colours without a photo or video shoot.

Not the right fit if

  • You need live footage, filmed interviews or a cinematic 3D render: a video studio suits that better.
  • You want every element on the page to move: Pavlo keeps motion to the parts that explain something.
  • You need photos of your real team or customers: a photographer is the honest choice.

Compared

Motion built into the page vs a video file

A video suits footage. Motion built into the page suits UI, product explainers and scenes the visitor drives.

Motion built into the page vs a video file
CriterionMotion in the pageA video file
TextKey text stays in HTMLBurned into the pixels
SharpnessVector or drawn at screen sizeFixed resolution
InteractionReacts to scroll, hover and clicksPlays the same every time
Reduced motionSwapped for a still or a fadeNeeds a separate still
EditsColour and timing changed in the fileRe-export for every change
Best forUI, explainers, interactive scenesFootage and cinematic shots

Checklist

6 checks before motion goes on a page

The same checks apply to every animation and 3D scene Pavlo ships, from a Lottie loop to a WebGL product model.

  1. 1. A job to do

    The motion explains the product, guides the eye or gives feedback on a click. Motion with none of those jobs is cut.

  2. 2. The right format

    Lottie for flat vector loops, Rive for motion that reacts, CSS or GSAP for scroll and hover, WebGL for products the visitor turns.

  3. 3. A weight budget

    Every file and script is measured before launch, and players load only on pages with motion.

  4. 4. Loaded in view

    Animations and 3D scenes start on scroll into view and pause out of view, which saves battery.

  5. 5. Reduced motion respected

    Visitors who turn motion off in system settings get a still frame or a simple fade.

  6. 6. Words stay in HTML

    Headlines, prices and buttons stay in the page, not inside a canvas or an animation file, so search engines and screen readers can read the text.

Included

What every
project includes

Motion that explains your product and stays light on the page.

  • Fixed price in writingAgreed after the first call, before work starts

  • Two feedback roundsIncluded in every project

  • One person, no handoffsPavlo designs and builds every piece himself

  • Your brandColours, type and style from your brand guide

  • Weight checkedEvery file measured before launch

  • AccessibilityReduced motion for animation, alt text for images

  • Final filesJSON, .riv, code or images, handed over

  • Help after delivery$30 an hour, no retainer

In their words

Motion on the web, from
the standards and clients

Word for word, with the source linked: research, official documentation and the people Pavlo Zhydkykh has worked for.

“Some users experience distraction or nausea from animated content.”

W3CUnderstanding WCAG 2.2: Animation from InteractionsSource ↗

“Non-composited animations require more work and can appear janky (not smooth) on low-end phones or when performance-heavy tasks are running on the main thread.”

web.devStick to compositor-only properties and manage layer countSource ↗

“Lottie animations are much smaller while retaining the same quality compared to other formats like GIF or MP4.”

LottieFilesWhat is a Lottie animation?Source ↗

“It was an absolute pleasure working with Pavlo. The quality of work he delivered was AMAZING.”

Ed ClarkeFounder, Inturai · Website design and SEOSource ↗

“He is amazing in what he contributes, both design-wise and also from the ideas.”

Oliver BockOwner, The B2B Answer · Website design, 2025Source ↗

“One of the best contractors I have worked with. Really thoughtful about communication. Would 100% hire again.”

Remi LabelleCOO, Accolade Pro · Web app designSource ↗

FAQ

Questions about
Motion and 3D

Still unsure? Ask your AI about Pavlo Zhydkykh:

ChatGPTPerplexityClaudeGeminiGrok

Q.01

How much does motion work cost?

A Lottie or Rive animation starts at $1,000, scoped per project. Web animation, 3D scenes and AI visuals get a fixed quote after a first call, and Pavlo fixes every price in writing before work starts.

Q.02

How long does a motion project take?

Pavlo fixes the date together with the price after the first call, because a single icon loop and a 3D product scene are different jobs. Two feedback rounds are planned into every date.

Q.03

Who owns the files?

You do. The final JSON, .riv, code or image files are handed over for your site and apps, and AI visuals are used within the terms of the tools, which Pavlo checks first.

Q.04

What do I need to provide?

Your brand guide, logo files and the message the motion has to carry. Figma files, product screenshots or a 3D model help when the work shows the product.

Q.05

Will motion slow down my site?

Not when Pavlo builds the motion with a budget. Files are checked for weight, players and scenes load only when in view, and visitors who turn motion off get a still version.

Q.06

What happens after delivery?

The work is yours to use as delivered. Changes later cost $30 an hour with Pavlo, with no retainer and no monthly fee.

Sources and further reading

  1. [1] WikipediaMotion graphics
  2. [2] LottieFilesWhat is a Lottie animation?
  3. [3] Rive Docsrive.app/docs
  4. [4] web.devStick to compositor-only properties and manage layer count
  5. [5] W3CUnderstanding WCAG 2.2, Animation from Interactions
  6. [6] three.js Docsthreejs.org/docs/
Pavlo Zhydkykh

About the author

Pavlo Zhydkykh

Pavlo Zhydkykh is a web designer and developer in Eastern Europe who has built websites for AI, fintech and B2B startups since 2016, designing and building each project himself on Framer or Astro + Sanity. Clients include MStudio Asia, Silicon Data, Inturai, Accolade Pro, NimbleStax and Sancts.

  • Top Rated on Upwork
  • 100% Job Success
  • 10 years since 2016
  • 50+ sites shipped
  • 90+ PageSpeed at launch
Kulparkivska St. 200, Lviv 79021, Ukraine +380 93 610 62 68 [email protected]

LinkedInUpworkContra Privacy policy

Page reviewed by Pavlo Zhydkykh · Updated

AI visibility check

  1. 1Website
  2. 2Business
  3. 3Contact
  4. 4Check

Does ChatGPT recommend your website?

Pavlo Zhydkykh asks ChatGPT, Perplexity, Gemini, Claude and Grok 20 questions your buyers ask, and shows where you show up.

Free · report in 48 hours