What the GIFvideo → gif, the way creatives need it
gif for design review

Stop describing a quarter of a second in words

Motion breaks in specific places, and a comment box has no way to name them. A three-second loop with a timed callout does.

Drop a video, get a GIF drop it here or choose a file · free · nothing leaves your browser Open the converter →

Make a GIF for a design review

What the GIF does the whole thing locally, right in your browser: nothing here ever leaves your machine.

  1. Start with the reference clip. Drag the prototype or spec recording in first so it lands as clip one and the loop opens on the intended motion.
  2. Capture the build second. Press Record a Tab and pick the staging tab in the browser's share picker, or drag in a recording you already have. Run the interaction once, cleanly, then stop. It arrives as clip two.
  3. Match the two frames. Give the FRAME toggle to whichever of the two clips is correctly proportioned, then set Mismatched Clips to Fit with bars so the other one stays whole.
  4. Trim both sides to the same beat. Set in and out points so each clip starts at the trigger and ends when the motion settles. Use Split to cut dead footage out of the middle of a long take.
  5. Time the callout. Add captions and give each one a start and end time, then drag the bars on the sequence timeline until they snap to the cut or to the moment they describe.
  6. Check it, then export. Play edit runs the real assembly, cuts and captions and bars included, so you see what the reviewer will see. Then export: 10 to 15 fps and 64 to 128 colors is plenty for interface footage, or switch to MP4 or APNG if the clip is about color rather than behavior.

Prose is a bad instrument for describing timing

A reviewer writes that the sheet "feels late" or the toast "stacks weird," and you lose a morning working out which frame they were looking at. The timing information stayed in their head. What arrived in the thread was an adjective. Round two runs the same way in reverse, two people describing a quarter of a second to each other in English.

A loop closes that gap by moving the evidence instead of the description. Send the three seconds where the behavior actually happens, with the callout burned into the frames it belongs to, and the reviewer answers the question you asked. Record a Tab in the editor captures the staging tab through the browser's own share picker and drops it in as a clip; a recording you already took works the same way.

Spec first, build second, in one loop

The review artifact worth making is a comparison, and a sequence can carry one because it runs in time. Clip one is the reference motion, from the prototype or a motion render. Clip two is what shipped to staging. Trim both to the same beat and the loop plays intent straight into reality, which ends the part of the review where two people compare memories.

Two settings decide whether that comparison is fair. The FRAME toggle picks which clip sets the output size and aspect, so hand it to whichever recording is correctly proportioned. Then set Mismatched Clips to Fit with bars, which keeps the other clip whole inside real letterbox bars. Crop to fill looks tidier and quietly deletes whatever sat near the frame edge, which during a design review is regularly the thing under review.

Cuts between clips are hard, with no transition available, and here that is correct: a dissolve would smear the exact frames you want compared. If a take has twenty dead seconds in the middle, the Split button (or the S key) cuts the selected clip at the playhead so you can drop the middle and keep both ends. Ten clips fit in one output, which is more than any review question needs.

Callouts that arrive when the problem does

Captions here take optional timing, shown from 1.2s to 2.4s of the output, or blank for the whole loop. That turns a label into a cue. "Spec" sits over the first clip, "Build" takes over at the cut, and "overshoots" appears for the eight frames where it overshoots and then leaves the frame alone. Three overlays is the cap, which is two more than most review clips want.

The sequence timeline under the preview is what makes this fast. Clips are proportional blocks and captions are draggable bars on the same strip of output time, snapping to clip cuts and to each other, so aligning a label with the moment it names is a drag rather than arithmetic. The caption controls offer two styles: clean, with a color picker, reads as annotation; the Impact-style meme preset reads as a joke, which is the wrong register for somebody else's work.

A caption being placed on the preview and given a start and end time so it appears during part of the loop.
Give the callout a start and an end, and it stops competing with the rest of the clip.

There are no arrows. Shape overlays give you solid rectangles, circles, and triangles in any color, each movable and rotatable, so a triangle works as a passable pointer and a rectangle works as a censor bar. The second one earns its keep more often, because staging environments are full of real names and a review thread is read by more people than you counted.

Do not ask for color or type sign-off from a GIF

A GIF carries at most 256 colors per frame. Everything outside that set is approximated by the palette and smoothed over with dithering, which is a noise pattern doing an impression of a gradient. Put a shadow ramp, a glass blur, or a brand gradient through it and your reviewer is critiquing quantization error. Antialiased text goes the same way: the gray edges that make 13px type legible are the first thing a reduced palette spends.

So split the request by medium. Behavior, ordering, and timing survive a GIF intact, which is why it suits "does this interaction read?" For anything chromatic, flip the Output Format switch to APNG for full 24-bit color at a heavier file, or to MP4 for a smaller H.264 clip, or paste a still from the design file, since a PNG is a better color reference than any animation. The rest of the limits are worth saying out loud:

The least cleared footage in the building

A design review clip is a strange asset to own. It is the most interesting footage in the company and the least approved for release: pricing nobody has announced, a flow still with legal, a customer's real dashboard in the staging seed data. Feeding that to a web converter puts a copy of it on somebody else's disk under a retention policy you have not read.

This one runs in the page. Decode, frames, palette, and encode all happen on your own processor, and once the tab has loaded you can disconnect and still export. That is not a stronger promise than the other sites make, it is a converter with nowhere to send your file. Save the edit as a project file and round two is reopening it, swapping the staging clip for the fixed one, callouts still where you left them.

Turn the adjective into three seconds

Record the staging tab, cut it against the spec, time the callout to the frame that earns it, and send a loop nobody has to interpret.

Open the converter

Questions, answered

Why send a GIF instead of a Loom for design feedback?
Because a GIF plays where the conversation already is. A link means opening a tab, waiting for a player, and finding the moment; a looping attachment in the thread means the reviewer sees the behavior while reading the sentence about it. Use a recorded walkthrough when the feedback needs narration, and a GIF when it needs a specific moment.
Can I drop the review GIF into the Figma file?
Yes, as an image fill, but Figma shows animated GIFs as static frames in the editor and only animates them in presentation view, so a reviewer scanning the canvas gets a still. You choose which frame that still is, so pick the one carrying the problem. The Figma guide covers the placement and the file-weight cost.
How big can the GIF be for a pull request or ticket?
It depends on where it lands, and the numbers move, so check the current docs for your tool. At the time of writing GitHub caps attached images and GIFs at 10MB on issues and pull requests; the README guide has the rest of GitHub's numbers. Either way a review loop that cracks 3MB is usually too long, not too detailed.
What frame rate should a UI review clip use?
10 to 15 fps reads fine for pointers, menus, and page changes. Push to 24 or 30 only when the thing being reviewed is the easing itself, and expect the file to grow with it. Neither number can exceed the recording itself, so a capture taken at 15 fps exports at 15 fps whatever the dial says.
Does the staging recording get uploaded anywhere?
Not by the converter. The capture is recorded inside the page and encoded by your own machine, so the raw recording of unreleased work never goes to a conversion service. The export is a separate decision: attaching it to a thread or a ticket uploads it to that platform, so check the frames for staging data that should not travel, and cover what should not with a shape overlay before you post it.