Motion Designer

Motion Designer provides direct service and this page lists 22 real tasks that outline the role’s concrete actions. Tasks make clear what gets done first, what’s urgent, and what gets recorded. Each one shows where we found it, and comes with an AI prompt you can copy and use straight away.

22evidenced tasks
22ready prompts
11tools of the trade
15-1255.00O*NET-SOC code
113,330hold this job (US, BLS 2025)
$104,000median pay/yr (US)
Open Motion Designer in the interactive atlas →

What it pays

Government survey numbers — not estimates, not ads.

Half of all Web and Digital Interface Designers in the U.S. earn more than $104,000 a year — the middle 80% land between $53,750 and $201,550. About 113,330 people in the U.S. do this work. Figures are for the U.S. occupation group “Web and Digital Interface Designers”. (U.S. Bureau of Labor Statistics survey, published 2025.) In India, Professionals earn about ₹38,298 a month on average — around ₹4.6 lakh a year (government PLFS survey via ILOSTAT, occupation-family figure).
$104,000typical pay / year
113,330people in this work
$201,550+top 10% earn
₹4.6 lakha year in India (family avg)
Think you get this job?Six quick questions on how it really works — with a hint and the reason behind every answer.
Test yourself →

The work, task by task

These are the real jobs-to-be-done, not a wish list. Each task shows where we found it, and the prompt underneath is written for that exact task.

Keeping the record2

Design layout and visual elements

+
Lay out the visual system for the new product motion page: specify grid, type scale, key color usage, and…
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.
The tools that do the workAdobe IllustratorAdobe PhotoshopESCOjob descriptionsWikipedia

Maintain and update website content

+
Update product landing content by replacing outdated asset files, refreshing hero captions and meta…
Update product landing content by replacing outdated asset files, refreshing hero captions and meta descriptions, and uploading revised image and copy files to the content folder while noting any broken links for the web ops lead to fix before Friday deployment.
The tools that do the workAdobe InDesignjob descriptionsO*NETWikipedia
Fixing2

Troubleshoot website issues

+
Diagnose the intermittent layout break on the product gallery: reproduce the issue, capture failing…
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.
The tools that do the workAJAXESCOjob descriptionsO*NET

Optimize website graphics for performance

+
Compress and simplify the site animations, convert large layered graphics to optimized SVGs and sprite…
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.
The tools that do the workAdobe IllustratorAdobe Photoshopjob descriptionsWikipedia
Get approval1

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…
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.
The tools that do the workAdobe After EffectsAdobe IllustratorESCOjob descriptionsO*NET
Analysing1

Conduct user research to inform design decisions

+
Recruit eight target users, run three task-based remote sessions to watch navigation around the landing and…
Recruit eight target users, run three task-based remote sessions to watch navigation around the landing and pricing pages, record pain points and micro-interactions, then summarise findings with three prioritized design changes for the creative director by Friday.
The tools that do the workAdobe AcrobatO*NETWikipedia
The daily work16

Stay updated with web design trends and technologies

+
Scan the latest portfolio sites from Awwwards, CSS-Tricks, and Smashing Magazine this morning, note three…
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.
The tools that do the workAmazon Web Services AWSO*NETWikipedia

Integrate multimedia elements into websites

+
Combine the hero motion clip, SVG micro‑interactions, and a responsive video poster into a web demo page,…
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.
The tools that do the workAJAXjob descriptionsWikipedia

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…
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.
The tools that do the workAmazon RedshiftO*NET

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…
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.
The tools that do the workAmazon Elastic Compute Cloud EC2O*NET

Develop system interaction or sequence diagrams.

+
Draft system interaction sequences for the sign‑up and content playback flows, step through edge cases and…
Draft system interaction sequences for the sign‑up and content playback flows, step through edge cases and network failures, then export the diagrams and send them to engineering and QA with a Friday deadline for comments.
The tools that do the workAmazon DynamoDBO*NET

Perform Web site tests according to planned schedules, or after any Web site or product revision.

+
Run the full regression checklist after the latest deploy: playback across desktop and mobile, animation…
Run the full regression checklist after the latest deploy: playback across desktop and mobile, animation timing, accessibility labels, and low‑bandwidth fallbacks; log failures in the tracker and assign fixes to Lucas and Maria with a 48‑hour SLA.
The tools that do the workAmazon Web Services AWS CloudFormationO*NET

Direct and execute pre-production activities, such as creating moodboards or storyboards and establishing a project timeline.

+
Prepare moodboards and a three-act storyboard for the product launch video, list required shoots and assets,…
Prepare moodboards and a three-act storyboard for the product launch video, list required shoots and assets, and produce a week-by-week pre-production timeline that flags approvals from Sam in Marketing and Vikas the director by name.
The tools that do the workAdobe PhotoshopAdobe InDesignO*NET

Document technical factors such as server load, bandwidth, database performance, and browser and device types.

+
Inventory current server and client constraints: record peak server CPU and memory, average bandwidth used…
Inventory current server and client constraints: record peak server CPU and memory, average bandwidth used during playback, database query times, and most common browser and device types seen in the analytics for the last 30 days.
The tools that do the workAmazon Web Services AWSAmazon DynamoDBO*NET

Research, document, rate, or select alternatives for Web architecture or technologies.

+
Research three web-architecture options for the interactive microsite, evaluate each for scalability,…
Research three web-architecture options for the interactive microsite, evaluate each for scalability, implementation time, and motion-friendly rendering, and recommend one with pros, cons, and estimated engineering hours.
The tools that do the workAmazon Web Services AWS CloudFormationAmazon Elastic Compute Cloud EC2O*NET

Respond to user email inquiries, or set up automated systems to send responses.

+
Draft standard email replies for common user questions about playback, file formats, and browser issues, and…
Draft standard email replies for common user questions about playback, file formats, and browser issues, and set up an automated responder that sends the correct reply and routes technical issues to Priya in support.
The tools that do the workAmazon Web Services AWSO*NET

Select programming languages, design tools, or applications.

+
Compare candidate languages and tools for the interactive experience—list pros and cons for JavaScript…
Compare candidate languages and tools for the interactive experience—list pros and cons for JavaScript frameworks, vector animation tools, and any required back-end languages, then recommend a primary stack and backup with estimated developer days.
The tools that do the workAJAXAmazon Elastic Compute Cloud EC2O*NET

Write and edit technical documentation for digital interface products and designs, such as user manuals, testing protocols, and reports.

+
Produce the technical documentation for the interactive player: include API calls, asset naming conventions,…
Produce the technical documentation for the interactive player: include API calls, asset naming conventions, testing protocol with pass/fail criteria, and a one-page troubleshooting guide for QA and release engineers.
The tools that do the workAdobe AcrobatO*NET

Write code for websites using HTML, XML, JavaScript, or SQL

+
Implement the interaction on the landing page: add semantic markup for the hero and sections, build the…
Implement the interaction on the landing page: add semantic markup for the hero and sections, build the navigation and content templates, write the JavaScript that loads JSON data, validates user input, and logs errors to the console so the prototype runs in Chrome.
The tools that do the workAJAXjob descriptions

Monitor website traffic and performance

+
Set up daily monitoring for the site this week: add performance timers to key page loads, record resource…
Set up daily monitoring for the site this week: add performance timers to key page loads, record resource timings to a JSON endpoint, and create a simple script that alerts me by email when First Contentful Paint or requests per second drop below our SLA.
The tools that do the workAJAXjob descriptions

Develop web-accessible software based on designs

+
Turn the motion comps into a working web demo: export animated assets, create responsive HTML templates, wire…
Turn the motion comps into a working web demo: export animated assets, create responsive HTML templates, wire the playback controls in JavaScript, and package the files so the designer can open the prototype at preview.example.com.
The tools that do the workAJAXESCO

Look for ways to improve the application

+
Audit the app for quick wins this sprint: run the profiler on the slow pages, list the top three…
Audit the app for quick wins this sprint: run the profiler on the slow pages, list the top three render-blocking assets, propose fixes with estimated hours, and flag any UI animations causing dropped frames for cleanup.
The tools that do the workAJAXESCO

Says who?

These are the pages we read to build this. Open any of them and check us.

Related careers

Same family of work — each with its own tasks and prompts.

The LLOS Work Atlas is the world's largest evidenced task library — a map of human work, with a ready prompt behind every task. 1,774 careers · every task named by the sources that witnessed it — O*NET, ESCO, real job descriptions, Wikipedia — and the deepest tasks by several at once. And it is honest about limits: where AI cannot help, the map says so.

The rest of the map

Same library, five ways in.

Copyright © LLOS.ai · 2026 — original pedagogy, voice, and design — all rights reserved.
Built on public evidence: O*NET®, ESCO, Wikipedia, U.S. Bureau of Labor Statistics, ILOSTAT. All sources & licenses