To show keystrokes in a tutorial video, add a keystroke callout: an on-screen key cap that displays the shortcut you pressed. In Zella it is one of the callout types, placed on the timeline where the shortcut happens and styled like a physical key. It is one of twenty callout types on Mac and nineteen on iPhone. Put it near the thing that changed rather than in a corner, and hold it about a second - long enough to read, short enough not to linger.
Every software tutorial has the same silent failure: something happens on screen and the viewer has no idea why, because the cause was a shortcut they could not see you press.
Why saying it out loud is not enough
"Now I press Command Shift 4" works for a viewer who is watching. It fails for everyone else, and everyone else is most of your audience:
- People watching muted, which is the default on every feed.
- People whose first language is not yours, reading captions and missing a spoken key name.
- People following along, who need the shortcut on screen long enough to type it themselves.
- People scrubbing back to find the bit where the panel appeared.
A key on screen answers all four at once, and it costs about five seconds to add.

This sits on Apple's AVFoundation, the framework that composes the timeline and writes the export back out again.
Adding a keystroke callout
- Open the recording in Zella and go to the Arrows tab, which holds the callout types.
- Choose Keystroke.
- Type the shortcut. It draws as a key cap, so it reads as a key rather than as a piece of text that happens to say Command.
- Drag it on the timeline so it lands on the frame where the thing actually changes, not where you started reaching for the keyboard.
- Drag it on the canvas to place it.
It is one of twenty callout types on the Mac, alongside arrows, boxes, labels, spotlights, numbers and the rest - arrows and callouts covers the full set and when each one belongs.
Placement: near the change, not in a corner
The reflex is to park keystrokes in the bottom left and leave them there. It is a reasonable convention and it is worse than the alternative.
Put the key where the effect happened. If the shortcut opened a panel on the right, the key belongs beside that panel. The viewer's eye is already going there, and a cause next to its effect needs no explanation. A key cap in a distant corner asks the viewer to look away from the thing that just changed, which is the opposite of what you want.
The exception is a video with many shortcuts in a row, where a consistent position becomes its own kind of readability. If you are demonstrating ten shortcuts in ninety seconds, pick one spot and keep it.
Timing: about a second
Too short and nobody reads it. Too long and it is still on screen during the next step, which makes the viewer wonder if it applies to that too.
A useful rule: the key should appear on the frame the effect appears, and leave before you finish saying what it did. If the shortcut is genuinely something people will copy - a multi-key chord, an unusual combination - hold it a beat longer and consider a second one later in the video.
Sizing it for the feed
A key cap sized correctly on a 27-inch monitor is unreadable on a phone. If the video is going to a vertical feed, everything you overlay needs to be roughly twice the size that looks right while you edit.
The check that takes two seconds: shrink the preview to about the size of a phone in your hand and see whether you can still read it. If you cannot, nobody can. The same test is the one that catches undersized text and titles, and it fails more often than any other overlay mistake.
When a caption is better than a key cap
Not every keystroke deserves one.
- A shortcut you press constantly - copy, paste, save - is noise on screen. Show it once, early, and trust the viewer.
- A long sequence is a list, not a key. Three keys in a row want a numbered on-screen list they can pause on.
- A shortcut that is the whole point of the video deserves a full title, not a small key cap in the corner. If someone searched for it, put it big.
Combining a key cap with a cursor and click indicator covers the two things a viewer cannot otherwise see, which between them explain nearly every unexplained change in a screen recording.
Frequently asked questions
Where should keystroke callouts go on screen? Next to whatever the shortcut changed. The viewer is already looking there, so a key beside the effect needs no explanation. Use a fixed corner only when you are demonstrating many shortcuts in a row.
How long should a keystroke stay on screen? About a second: appearing on the frame the effect lands, and gone before you finish describing it. Hold longer only for a chord you expect people to copy.
Do I need to record my keyboard separately? No. The callout is added in the editor and displays whatever you type into it, so it works on a recording you have already made.
How big should the key cap be? Big enough to read at phone size, which is larger than it looks correct on a monitor. Shrink your preview to roughly phone size and check before you export.
Should I show every shortcut I press? No. Show the ones that caused something the viewer can see, and skip the ones you press out of habit. A screen full of keys teaches nothing.
Does this work on iPhone too? Yes. The keystroke callout is one of nineteen callout types on Zella for iPhone, under Arrows & Labels.
Make your next video with Zella.
Record, edit and ship on Mac and iPhone - local, private, free to start.
PART OF A SERIES
Arrows, labels and callouts
Pointing at the thing you are talking about, including keys as you press them.
- How to Add Arrows and Callouts to a Video on Mac
- How to Show Keystrokes On Screen in a Videoyou are here
- How to Resize and Shape Callouts in a Video
- Make a Label Follow a Moving Object in Your Video
All of it lives under Captions & Callouts.
RELATED