SynthMock
A photo editor already has a natural visual anchor: the selected image. Let that image connect the cover to the open workspace, then use the extra space to explain controls without hiding the work they affect.
Try it in SynthMock
Start with a Duo scene.
Use a reusable template as your starting point, then apply the choices in this article.
A paid plan is required to use templates and export.
Preserve the image through the transition
Use an original or approved photograph with one clear subject. The cover can show that image in a focused view. The inner layout can keep it selected while revealing an adjustment area or filmstrip supported by the actual product. If the interface is hypothetical, label the campaign as a concept.
Avoid changing the image, crop and edit result simultaneously during the fold. The viewer may no longer know which change the product is demonstrating. A useful first rough uses the same image and edit state on both sources, so the physical opening explains additional workspace before any software action begins.
Give the tools enough room, but not the lead
Balance the editing surface and controls around one demonstration task. A crowded array of sliders is less informative than a recognizable selected image with a clearly relevant tool.
| Area | Proposed role | Review check |
|---|---|---|
| Image canvas | Main subject of the presentation | The important subject survives the crop |
| Adjustment area | Explain the selected editing task | Labels remain plausible and not decorative |
| Filmstrip | Provide context for the selected image | The selected thumbnail matches the canvas |
Separate the camera action from the edit
If using an actual recording on the inner screen, let the camera reach a useful view before the important edit occurs. A dramatic orbit can make a small adjustment difficult to see. The native outer source accepts a still, so plan it as a stable selected-image state.
A proposed deliverable set contains an open workspace hero, a tighter image-and-tool detail, and a short fold reveal. Keep the source photograph and selected state identical across them. Do not label a visually attractive before-and-after as improved image quality unless that is what the real tool and chosen example demonstrate. The mockup's role is to present a coherent workflow; the source recording or live product must substantiate what the editor can actually do.
See a Duo sequence in motion
Final pass
Before you call it finished
- Keep the same selected photo across both displays.
- Use an approved image and truthful tool state.
- Let the camera settle before a subtle recorded edit.
Make the next version yours.
Explore Duo templates ↗