A WhatsApp screenshot is the universal prop of internet storytelling. It shows up in YouTube skits, TikTok voiceover series, product demos, classroom exercises and UX presentations — anywhere a conversation needs to be shown rather than described. And because the audience sees the real interface every day, the bar for looking real is high: a wrong green, a missing tick or a bubble at the wrong width gets noticed within seconds.
This guide walks through making one properly, using the free WhatsApp chat generator — no signup, no watermark, everything rendered in your own browser. The same principles apply whichever tool you use, so it is worth reading even if you end up building the mockup by hand in Figma. If you would rather start from a finished scene, the chat screenshot examples gallery shows complete conversations you can borrow structure from.
Step 1: Start from the scene, not the screen
The most common mistake is opening the generator first and improvising. Work out the scene before touching any tool: who is talking, what do they want, and what does the viewer need to understand from this screenshot in five seconds? A staged conversation that exists to deliver one clear beat — the reveal, the excuse, the awkward double-text — needs four to eight messages, not twenty. Short conversations are also easier to make look natural, because real chats are full of abbreviations, typos and uneven reply times.
Step 2: Set the contact the way the app would
In the real app, the header shows the saved contact name, a status line, and a profile photo. The details matter: an online subtitle implies the person is in the app right now; last seen today at 20:14 implies they went quiet — which can be the entire point of your scene. If you leave the avatar empty, a neutral grey initial circle appears, which is what the real app shows for contacts without photos. That is usually more believable than a too-perfect stock photo.
Step 3: Write messages that read like typing, not writing
Real conversations have texture. Reply lengths are uneven. Punctuation is inconsistent. Someone sends three short messages where a formal writer would send one paragraph. A few concrete habits:
- Match register: close friends compress (“u up?”), colleagues expand.
- Let one side dominate. Most real chats have a texter and a replier.
- Group consecutive messages: three bubbles in a row from one person is the single most natural rhythm in WhatsApp.
- Put the beat in the last message of the exchange — that is where the eye lands.
Step 4: Sweat the receipts
Read receipts are where fake screenshots go to die. WhatsApp has exactly three states: one grey tick (sent), two grey ticks (delivered), two blue ticks (read). A conversation where every outgoing message is blue-read looks staged, because in real life most messages sit at two grey ticks for hours. Set the last one or two to blue, leave the rest grey, and the screenshot instantly feels lived-in.
Step 5: Export at the right resolution
Export at 2x for thumbnails and presentations (780px wide), 3x for print or when the image will be zoomed. Exports skip the phone frame by default — a real screenshot never contains the phone body. Keep it off when compositing into a video frame or a design: an entire phone inside a scene that already has a phone looks redundant.
What makes viewers smell a fake
Three tells cover almost every bad mockup. Wrong colours — the outgoing bubble is #d9fdd3, not the green of the header. Bubbles too wide — real ones cap around three-quarters of the screen. And timestamps — they belong inside the bubble next to the ticks, never floating outside. The generator handles all three by default, which is the point: the tool should make the correct thing the easy thing.
Three scenes, line by line
Abstract advice about “natural rhythm” is hard to act on, so here are three everyday scenes laid out line by line, with the reason the pacing is arranged that way. All three are the kind of benign logistics and small-talk threads the examples gallery uses.
The plans thread. One side opens with a question, the other confirms, then a small practical detail, then a one-word close:
- “still on for sat?”
- “yeah — 7 at the usual place”
- “i'll bring the speakers”
- “perfect”
The rhythm here is fast and even, because plans get settled quickly. Note that the longest bubble is not the opener but the practical detail, and that the thread ends on a single word — real logistics rarely sign off with a paragraph. This is the shape to use when you need a screenshot that simply reads as normal.
The left-on-read thread. Someone raises something mildly awkward, sends a fuller message, then resolves it themselves before anyone answers:
- “quick q about the invoice”
- “no rush but could you check the total when you get a sec?”
- “actually never mind, sorted it 🙂”
The pacing is deliberately lopsided: three messages from one side, nothing from the other. The third message walking back the second is the whole point, and it is why the double text exists in the first place. Ending on a friendly self-resolution is what keeps the scene light rather than pointed.
The check-in thread. A short hello, a gap, then an answer much later:
- “you around this week?”
- “free thurs if that works”
- “thurs is good”
What makes this one work is the uneven timing rather than the words. In the editor, set the first message to two grey ticks and the last to blue so the screenshot carries the silence visually instead of stating it. Three lines is enough; adding more turns a check-in into a plan.
Using the three tick states as a storytelling tool
WhatsApp is unusual in having three distinct receipt states, and each one says something different. A single grey tick means the message left your phone but has not reached theirs — their phone is off or offline. Two grey ticks mean it arrived but has not been opened. Two blue ticks mean it was read. That is a small grammar, and it lets a screenshot say things that the words do not.
The most-used beat is the blue tick with no reply: a message that is read and then ignored. To stage it, give the last outgoing bubble blue ticks and end the thread there. The second beat is the opposite — a message stuck at one grey tick, which reads as a phone that is switched off or out of signal, useful when the story is about someone being unreachable rather than unwilling. Two grey ticks is the neutral, unremarkable state, and most of a believable thread should sit there.
The trap is uniformity. A conversation where every outgoing message is blue-read looks staged, because in real life most messages linger at two grey ticks for hours. Pick the one or two messages whose state carries meaning, set those deliberately, and leave the rest grey. If you want a second opinion on which states a real thread shows, the WhatsApp generator exposes all three so you can compare them side by side before exporting.
Pairing a group thread with a one-to-one
Plenty of stories need two screens: a group where something is announced or argued out in public, and a private thread where it is actually discussed. Building both is straightforward, but the pair only works if the viewer believes they belong to the same phone.
The mechanics matter. Build the group scene with the group chat generator and the private scene with the WhatsApp generator, then hold the two consistent: reuse the same participant names, the same light or dark mode, and the same wallpaper, so the two images look like two screens from one account rather than two unrelated mockups. If the group has five members, the private thread should be with one of those five, not a new name.
Remember that ticks mean something heavier in a group. Two blue ticks in a one-to-one means one person read it; in a group they mean everyone did, which is rare, so most group messages should sit at two grey ticks. Keeping the group a little unreliable and the private thread precise mirrors how these things actually happen, and it is the detail that makes a two-image scene hold together. The group chat guide goes deeper on multi-person staging.
The boundary the tool will not cross
A fabricated conversation used to illustrate, parody or teach is a creative device as old as fiction. The same image used to deceive someone — fake evidence, impersonation, harassment — is something else entirely, and it is the reason ChatMock publishes an Acceptable Use Policy and refuses to build templates for fake bank, government or legal notices. Make things people will recognise as staged; do not make things designed to be mistaken for evidence.