Still Frame

The still frame is the motionless target that every animation in your logo system is built to hit. It is the exact vector configuration of your mark at perfect rest with no residual scale rotation or easing applied. All four motion modes loader intro loop and transition begin or end on this frame. It is what renders when a user enables prefers reduced motion in their operating system. It is the fallback image when a Lottie file fails to load or when video autoplay is blocked by the browser. The still frame lives in your brand guidelines as the definitive version of the logo that must never be altered. It forces you to solve the design at small sizes and in single color before you add the entertainment of motion. Without it your animations may look impressive in isolation but they fail the moment they enter a real product context. The still frame is not decoration. It is the infrastructure that makes the decoration possible.

A still frame is not the final keyframe you export after falling in love with your particle system. It is not a screenshot taken from a rendered MP4. It is not a version that only looks correct when animated. It is not an approximation or a close enough state that requires a nudge in CSS to line up. Too many designers animate first then hunt for a decent resting pose at the end. That approach produces logos that drift two pixels off center or change weight slightly between static and moving versions. Those differences become obvious at 48 pixels in a browser tab. They destroy the trust built by consistent brand application. The still frame is also not a place to show off. Save the cinematic lighting and depth effects for the intro mode. The still frame must match the same logo you use on business cards and legal documents.

Stripe defined their still frame in 2016 before building the now famous loader. The simple geometric mark was drawn with precise radii that hold at every scale. The 1.2 second loop always collapses back to that exact shape with no offset. Slack did the same for their 2017 reveal where the easing leads directly into the official static hashmark used across their entire ecosystem. Linear updated their system in 2022 with a loop that respects the still wordmark so perfectly that the animation can be paused at any point in the cycle and still read as on brand. Apple Music has used the same principle since their 2019 rebrand. Every stinger animation no matter how dramatic resolves to the clean logo that appears in app icons and marketing assets. These companies treat the still frame as law. The motion is the supporting actor that must obey it.

Mailchimp adjusted their approach in 2018 after early bounce loops produced a still frame that looked flattened. The team went back to the vector drawing board redefined the resting state and rebuilt the animation to land cleanly. The updated loop now feels full of personality without sacrificing the integrity of the static mark. Vercel follows this discipline in every triangle transition. The build sequence assembles the shape then snaps to the exact still frame used in their dark and light modes. Loom applies it to their quick scene changes where the logo moves between product states but always rests on the approved static version. These are not happy accidents. They result from motion briefs that list the still frame description before any mention of easing or tempo.

Lock in the still frame at the beginning of every project. Open your vector tool and perfect the static mark first. Describe it in writing in the motion brief so there is no ambiguity. Deliver the transparent PNG at 2x resolution with every other format. Test it at favicon size loading spinner size and hero size before approving any animation. Update your brand identity guidelines to include the still frame next to your color palette and typography rules. Never greenlight a rig or particle animation if the resulting still frame cannot stand alone as a strong mark. Do not use the still frame from a cinematic intro as the primary logo without checking how it reads in black and white at small sizes. If the animation is the only thing making the mark legible then the static design needs more work first. The still frame reveals the truth about your underlying logo quality.

The still frame is what turns a cool animation into a bulletproof brand system.