Motion Design
05 / Storyboard & Production
Key question
How does an idea become a finished clip?
Animation takes time. Jumping straight into the software often leads to getting lost in the details. A clear process—from script and storyboard through to export—saves hours and makes feedback much easier.
Learning objective: You can plan an animation from concept to export, create a storyboard with duration and frame rate, and choose the appropriate format.
Plan first, animate later.
5.1 / From concept to animatic
Plan first, animate later.
An animation is created across three planning steps before the first movement is built.
01
Script
What is being told, in what order, with what text and sound?
02
Storyboard
Sketches of the key frames with duration and description of movement.
03
Animatic
The storyboard played back in real time, often with sound. This shows whether the timing works.
Feedback on the animatic is cheap. Feedback on the finished animation is expensive. Get it early.
Get feedback early.
5.2 / Plan storyboard
Scenes, seconds, frames.
A storyboard lists each scene, along with its content and duration. This determines the overall length and the number of individual frames. For social media, 6 to 15 seconds is typical, whereas 60 to 90 seconds is standard for an explainer video.
Plan for accessibility right from the start: no flashing content, enough display time for text, subtitles for speech, and an option to pause long animations on websites.
Accessibility right from the start.
5.3 / Tools and Export
The right format for every location.
For film and social media, After Effects or programmes such as Jitter are widely used, while Figma, Rive or code are popular for interfaces. Exports are typically done as MP4 with H.264 for video, WebM for the web, or Lottie and Rive for animations that need to remain small and sharp.
GIF is old and large, but sometimes the only option, such as in emails. After exporting, always check the file size, how it looks on mobile, and whether the clip makes sense without sound.
Every place has its format.
Exercise
A clip for Museum Klang
Task: Produce a social media clip of no more than 15 seconds for the new exhibition at Klang Museum.
STEP 1
Write a script with a message, lyrics and tone.
STEP 2
Plan a storyboard with five to seven scenes in the tool.
STEP 3
Build an animatic and gather feedback.
STEP 4
Animate, export as an MP4 in 9:16, and check accessibility.
Evaluation: How much has the clip changed between the animatic and the final version, and why?