Move through cart, payment and shipping as three clean checkout states, giving a purchase sequence a beginning and an end.
Checkout Steps fits ecommerce explainers, launch ads and product demonstrations. Rename the stages to mirror the actual flow and keep them short enough to read as the active state advances. It is especially helpful between screen recordings, where it tells viewers what just happened without showing another crowded interface.
Keep each stage to one word in caps, CART, PAYMENT, SHIPPED, so the row stays even. The stages should match what your store actually calls them. Three is the fixed count, so if your flow has four, fold two together rather than trying to squeeze a fourth in.
Checkout Steps is built at 640 × 360, a 16:9 landscape frame, the shape of a YouTube video, a stream layout and most editing timelines, and runs 3 seconds at 30 frames per second. Export it as an MP4 for a timeline or a feed, a GIF where video will not embed, or a MOV with an alpha channel to lay it over footage with nothing behind it. Renders go up to 4K, and the free plan exports at 720p with a watermark.
No. Each stage is a labelled node on a line, and the active state moves from left to right. The labels are what change, which is why they need to be short.
Yes. Any three-stage process fits, such as BOOK, CONFIRM, ARRIVE for a service or APPLY, REVIEW, OFFER for hiring. The line does not know what the steps mean.
