◆ Design

What a motion designer
really does.

22 tasks, each one witnessed by the sources that watched the job — and behind every one, a prompt you can use tonight.

22evidenced tasks
113,330in the US (2025)
$104,000median pay / year
11systems it runs on
See the 22 tasks ↓Open in the atlasThe full career map →
This is what one task looks like here
Design layout and visual elements
Lay out the visual system for the new product motion page: specify gri…3 sources agree

The shape of the day

tap a movement to see its tasks

Which one is you, right now?

Pick the moment · no score, no sign-up
Which moment is you right now?
Whichever you pick, the task behind it opens below.

The work, task by task

22 tasks
Hands on the work14
Design layout and visual elements+
Lay out the visual system for the new product motion page: specify grid, type scale, key color usage, and hero animation frames, then deliver three annotated visual mockups and an assets pack to the animation and front-end teams by Monday.
escojdwiki3 agree
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Troubleshoot website issues+
Diagnose the intermittent layout break on the product gallery: reproduce the issue, capture failing screenshots and console notes, swap in simplified assets to isolate the cause, and hand a bug report with repro steps to the engineering lead by end of day.
escojdonet3 agree
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Align the client's web presence with its business strategy+
Update the hero animation, product explainer loops, and footer motion so they reflect the new three-year growth plan, then export web-ready assets and send a short change brief to Priya in marketing and James the CEO by Thursday lunchtime.
escojdonet3 agree
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Optimize website graphics for performance+
Compress and simplify the site animations, convert large layered graphics to optimized SVGs and sprite sheets, run a load-time check on the product pages, and hand the results and new assets to Devops by end of day Wednesday.
jdwiki2 agree
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Stay updated with web design trends and technologies+
Scan the latest portfolio sites from Awwwards, CSS-Tricks, and Smashing Magazine this morning, note three animation patterns and two emerging codecs or frameworks that affect delivery and file size, then draft a one‑page memo for the design team by Friday.
onetwiki2 agree
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Integrate multimedia elements into websites+
Combine the hero motion clip, SVG micro‑interactions, and a responsive video poster into a web demo page, confirm fallbacks for low bandwidth and touch devices, then upload the working prototype to the shared review link for engineering by Wednesday.
jdwiki2 agree
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Create searchable indices for Web page content.+
Crawl the public site, extract headings and captions into a CSV, tag each entry with page path and media timestamps, and publish a searchable JSON index the content team can query by Monday morning.
onet
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Create Web models or prototypes that include physical, interface, logical, or data models.+
Build an interactive prototype showing the physical layout, interface screens, data flows and component relationships for the upcoming landing page, link animations to state changes, and hand the prototype and annotated diagram to the product manager for review on Thursday.
onet
when the reply comes backPush once: ask it to sharpen the weakest part, and to say what it assumed. Helpful?
Keep the record3
Grow the practice3
Watch and assess2

What the work runs on

named inside the evidenced tasks
7 tasksAJAXreplicates and inspects asynchronous requests and dynamic content loading that often cause layout and timing issues
3 tasksAdobe Illustratorcreates precise layout artwork, vector components, and style guides that feed motion compositions
3 tasksAdobe Photoshopprepares bitmap textures and image-based hero frames for the mockups
3 tasksAmazon Web Services AWSstore and share collected resources, host the memo and examples for team access
3 tasksAmazon Elastic Compute Cloud EC2host the interactive prototype and serve linked assets during stakeholder review
2 tasksAdobe InDesignprepares finalized content spreads and exportable proofs of copy and imagery for review before site upload
2 tasksAdobe Acrobatcompile interview consent forms and the final illustrated findings report into a shareable PDF
2 tasksAmazon DynamoDBrecord event sequences and state transitions for quick lookups during diagram authoring and testing
Browse every evidenced software task →

The same task, four heights

this page is height one
ExecuteDo today's task, with fewer mistakesyou are here → ImproveMake it easy for the next person to acceptin the atlas → DecideWork out the right move when it is unclearin the atlas → BecomeLearn the pattern so it stops coming backin the atlas →

Can AI actually do this job?

the honest answer

It can

where it genuinely helps
  • Explain the theory behind the work
  • Draft, tidy and structure your writing
  • Rehearse a hard conversation before you have it
  • Build a study plan that fits your gaps

It cannot

where it stops, completely
  • Be in the room where a motion designer actually works
  • Carry the responsibility when the call is wrong — that weight stays yours
  • Notice what no one wrote down: the hesitation, the thing left unsaid
  • Live with the outcome

What the work pays

two countries, two different measures

United States

this exact occupation · BLS 2025
  • $104,000 a year — the middle: half earn more, half earn less
  • The lowest tenth earn near $53,750; the top tenth near $201,550
  • 113,330 people employed in this occupation

India

the occupation GROUP, not this job · PLFS via ILOSTAT 2025
  • ₹38,298 a month — the median for Professionals, the group this work sits in
  • India publishes pay by broad occupation group, so this covers many jobs besides this one. It is a shape, not a salary.
read this carefullyThese two numbers are not comparable and must not be converted into each other. One is a yearly figure for this job alone; the other is a monthly figure for a whole family of jobs. What travels between them is the pattern, not the amount: experience lifts pay almost everywhere.

Where the evidence lives

open any of it yourself
O*NETThe US Department of Labor's own record of this job15 of these tasks ESCOThe European skills and occupations register5 of these tasks Job descriptionsReal postings, in the wild8 of these tasks WikipediaHow the world describes this work6 of these tasks US Bureau of Labor StatisticsPay and employment, by occupation2025 figures UK NOS TECIS100141Design and develop digital user interfaces for web and mobile app platnational standard UK NOS SSR.MCR11Work collaboratively to produce page layouts for a trading website Legnational standard

Close to this work

12 nearby
DesignUx Designer22 evidenced tasks DesignUi Designer22 evidenced tasks DesignVisual Designer22 evidenced tasks DesignInteraction Designer22 evidenced tasks DesignService Designer22 evidenced tasks DesignPackaging Designer22 evidenced tasks DesignInformation Designer22 evidenced tasks DesignFurniture Designer22 evidenced tasks

Questions people actually ask

You’ll split time between design and web work. Mornings might be critique meetings, updating a storyboard or moodboard, and building an After Effects animation. Afternoons often go to integrating that animation into a site, optimizing graphics in Photoshop/Illustrator, and testing performance on different browsers and devices.

You also do web tasks: update content, run scheduled site tests, monitor traffic, and fix small bugs in HTML/JavaScript. If a problem is bigger, you document server load, bandwidth, or database performance for the dev team (AWS EC2, Redshift, DynamoDB show up here).

Start with Adobe After Effects for motion, plus Photoshop and Illustrator for assets; InDesign helps with print or comps. Learn HTML, CSS, and JavaScript so you can embed animations and troubleshoot integration.

For websites and backend awareness, learn basics of AWS (EC2 for servers, S3 for assets, maybe DynamoDB or Redshift for data). Also learn how to test performance and optimize graphics for faster load times.

Use AI to speed repetitive tasks: generate moodboard ideas, draft copy, or make rough animation concepts. Always check AI output for accuracy, copyright, and style—don't copy an image or animation without permission.

When AI writes code (HTML/JS) or config for AWS, test in a development environment. Document changes and keep human review for accessibility, performance, and security before pushing to production.

The U.S. Bureau of Labor Statistics (BLS) reports 113,330 employed motion designers; the 2025 median wage was $104,000 per year. The lowest tenth earned $53,750 and the top tenth $201,550. These numbers cover people doing animation and motion work generally; web-integrated roles might land near the median or higher depending on web skills and AWS experience.

Freelance rates vary by market and project. Specialized skills—interactive prototypes, JavaScript-driven animations, or AWS backend knowledge—usually push pay upward.

Compared with a web developer, you focus more on motion, visual storytelling, and animated assets. Developers focus on backend code, databases, and server architecture (though you’ll write HTML/JS and do small web development tasks).

Compared with a UI designer, you add motion and temporal design (storyboards, After Effects work). UI designers may focus more on interface patterns, user flows, and static prototypes; you combine that with animated prototypes and media optimization for the web.

Take classes or tutorials in After Effects, Photoshop, and Illustrator—focus on creating short demo reels (10–30 seconds) that show motion and compositing. Learn HTML, CSS, and basic JavaScript so you can export and embed animations into web pages.

Build small projects: a personal site hosting your reels (optimize assets for performance), a storyboard to guide an animation, and one prototype that uses JavaScript to trigger animations. Put these on GitHub and host on AWS S3 or EC2 to show you understand deployment.

You must optimize graphics (right formats, compression) and ensure animations don’t block the main thread; that means exporting efficient After Effects renders and using sprites or vectorized SVGs when possible. Test across browsers/devices and monitor site performance metrics regularly.

You should know basic HTML/JavaScript to troubleshoot interactions, and how to read server metrics (bandwidth, load) and deployment basics on AWS (EC2, S3). Document tests and fixes so problems can’t reappear.