Working with Media Assets
Goal — Handle images and video with FFmpeg — a core skill for a designer who now ships.
By the end — Hands-on with the core media jobs — resize, optimize, extract a frame, make a GIF — and a sense of the skill that wraps them.
1Understand FFmpeg
FFmpeg is a powerful command-line tool for working with media — converting formats, resizing, optimizing, and extracting frames. It is the engine behind most media work.
Explain what FFmpeg is and the kinds of media jobs it handles.2Optimize an image
Put an image in the project, then have Claude shrink it for the web and explain the change.
Resize and optimize this image for the web, and explain what changed and why it is smaller.3Extract a frame from a video
With a short video handy, pull one still out of it.
Pull a single frame from this video as an image, and explain the command.4Turn a video into a GIF
A GIF trades file size against quality — a good prompt makes Claude name that trade-off as it converts.
Convert this short video into an optimized GIF and explain the trade-offs in size and quality.5Understand what wraps this
You do not need to memorize FFmpeg's commands. In Phase 8 you install a skill called media-processing that packages exactly these jobs, so you ask in plain English and it runs the right command.
Summarize the media jobs I just did and how a skill would make them repeatable.As a designer who ships, you own the assets as well as the layout. Media is just another thing code can process — resize, optimize, convert — and that keeps the work in your control.
Recap — You ran the core media jobs with FFmpeg — resize, optimize, extract, convert — and saw how a skill turns them into plain-English requests.