A conversation is a document.
Every Textmock scene describes who says what, how it looks, and when it happens. Use the studio’s controls, or open Scene in the editor footer to download and edit the complete JSON. No account is needed.
Keep a scene you can change.
A validated scene has a SHA-256 content ID derived from canonical JSON. A share link carries the compressed document in its fragment and a short preview of its first two messages in the query. Anyone with the complete link can open and edit a copy; local media requires the scene backup too. The content ID alone does not retrieve a scene from a server.
Your draft stays in this browser. For a lasting backup, download the scene file. A photo selected from your device is included in that file; an external media link continues to depend on its host.
Move a scene to another browser.
- In the studio, choose Export, then Download scene. The
.textmock.jsonfile holds the scene and every photo and clip you chose from your device, up to 64 MiB of media. - In the other browser, open the studio and choose Export, then Import scene. Import replaces the scene that is open, so download that one first if you want to keep it.
- Wait for Scene imported. Check the messages and media before you export or share.
A share link alone opens the same scene, but photos and clips from your device show as missing files. Choose Import backup on that notice, or choose the files again. The link’s query string holds the contact name, the messaging style and theme, and up to 220 characters from each of the first two messages, marked as sent or received. Textmock and any app that previews the link receive that part. The complete scene travels in the fragment after #, which browsers don’t send with the request.
Start with the words.
{
"version": 1,
"rendererVersion": "2026.1",
"platform": "imessage",
"theme": "light",
"messages": [{
"id": "hello", "senderId": "friend",
"at": 0.5, "kind": "text",
"text": "A little idea…", "status": "read"
}]
}This is an excerpt. Download a complete scene from the studio for its participants, contact, device, and timeline. Stable IDs connect replies, reactions, and conversation states to their messages.
Download the JSON Schema for completion in your code editor. Textmock also checks references, animation value types, event timing, and document limits when it opens a scene.
Give the details a moment.
In Motion, choose an object and a detail, set its next value, and add a beat. Tap an existing beat to change it. Number values can change evenly or gently; text can appear letter by letter. Turn on an optional detail in Story or Look before animating it.
In JSON, each track names a field with a JSON pointer. Times are seconds, and a transition finishes at its keyframe. The same clock drives preview and export.
{
"id": "draft-typing",
"path": "/composer/text",
"keyframes": [
{ "at": 0, "value": "", "easing": "step" },
{ "at": 3, "value": "On my way ✨",
"easing": "typewriter" }
]
}Animate receipts with /messages/0/status, a reaction with /messages/0/reactions/0/emoji, or phone zoom with /device/scale. Message IDs and structural references stay stable. The editor keeps tracks attached to their messages when you reorder them.
A familiar conversation, down to the details.
- Messages
- Text, photos, video clips and cards, voice notes, links, files, locations, shared contacts, stickers, polls, payments, and system messages. Add replies, receipts, scheduling, edited versions, and unsent states.
- Words and reactions
- Format a selection with bold, italic, underline, or strikethrough. Individual text runs can have effects such as ripple, bloom, and shake. Reactions name their author and appearance time. Stickers have image or emoji content, position, size, rotation, layer, and author.
- The text box
- A draft, typing bubbles, letter or emoji keyboards, reply and edit modes, scheduled sending, and locked or paused recording. Text selection has explicit start and end positions, handles, caret, and visibility.
- Conversation state
- iMessage, SMS, or RCS transport; call and video controls; a back badge; muted or Focus status; unread boundaries; pinned messages; attachment trays; reaction pickers; and edit history. Trays and history carry the content you author.
- The phone
- Dimensions, frame, zoom, clock, battery, charging, signal, names, photos, participants, light or dark appearance, background, bubble shape, text size, and screen effects.
Small objects, room to grow.
Optional objects keep related states together. For example, a recording is a composer context; its duration and paused state can both have their own tracks.
"context": {
"mode": "recording",
"recording": {
"duration": 4.2,
"locked": true,
"paused": false,
"waveform": [0.2, 0.7, 0.4, 0.9, 0.3]
}
}Rich text lives in message.textRuns. Previous wording lives in message.editHistory.versions. Named extensions use keys such as example.notes; the renderer preserves these values without interpreting them. Future core changes must keep existing versions meaningful.
Photos and clips stay in your browser.
Photos and clips are stored in this browser. The scene references each file by its content hash, without putting the file itself into a link. Photos are resized locally. No upload service is involved; download a scene backup to keep the files before clearing browser data.
For a video message, choose a local MP4 or WebM file, or add an HTTPS clip URL in Messages. Local clips can be up to 32 MiB and five minutes. An external host must allow cross-origin access, and your browser must support the codec. Playback position, speed, and playing state follow the scene clock. A poster can stand in for a clip when you only need a video card.
PNG, GIF, and MP4 export freeze external images and wait for the correct video frame. A blocked resource produces an error so you can replace it. Exports are silent. MP4 needs WebCodecs with H.264 encoding. GIFs support up to 15 seconds, 12 fps, and 640 pixels on the longest side.
When an export fails.
Exports render in your browser, so what works depends on the browser and the device. The message under the export buttons names the problem.
- Video export needs a browser with WebCodecs. This browser has no video encoder for web pages. Export PNG or GIF here, or open the scene in another browser.
- MP4 encoding is unavailable in this browser. The browser declined H.264 at the scene’s size and frame rate. Try Chrome or Edge with hardware acceleration turned on, or export a GIF.
- An image could not be included in this export. The image’s link doesn’t load, its host doesn’t allow cross-origin downloads, or the file isn’t PNG, JPEG, WebP, GIF, or AVIF. During MP4 export, a blocked image can also appear as An external image blocked export. Choose the photo from your device instead, or remove it.
- This video could not be captured. Use a direct MP4 or WebM link whose host allows cross-origin access, or choose the clip from your device.
- GIF export supports scenes up to 15 seconds. Shorten the scene or export MP4. A long, large GIF can also stop with This GIF needs too many pixels.
To check MP4 support before you export, open your browser’s developer console on this page and run the check Textmock runs for the default phone. MP4 export won’t work if the result shows supported: false or the console reports that VideoEncoder is not defined.
await VideoEncoder.isConfigSupported({
codec: "avc1.420034",
width: 418, height: 876,
bitrate: 5000000, framerate: 30,
latencyMode: "quality"
})Portable, with practical limits.
Version 1 allows 160 messages, 32 participants, 256 animation tracks, 1,024 keyframes, and a timeline of up to five minutes. The complete document is limited to 256 KiB. Local media is stored separately, and a portable backup bundles it with the scene. Links do not transfer these files.
Free exports include the moving Textmock signature. Pro costs $5 per month, removes the signature, and adds Instagram, WhatsApp, Telegram, and Google Messages styles, including changes to those styles within an animation.
Render scenes in your own app.
The phone you see in the studio is Textmockups, an open-source React library for iMessage, WhatsApp, Telegram, Instagram, and Google Messages chat mockups. It reads the same version 1 scenes, so a file downloaded here draws the same conversation in your own pages. The library is MIT licensed; local media, export, and Pro styles stay in Textmock.
Make a conversation