SynthMock
A shopping interface can use the cover to focus on one item and the inner view to explain the choice. This concept keeps the selected item stable while revealing useful detail, rather than filling the larger screen with more products.
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.
Choose one item with a clear visual identity
Use an original product photograph or an asset you are permitted to use. A fictional studio lamp is a simple example: the cover can show the selected lamp, while the inner layout shows the same item beside its details or an approved comparison view.
Keep the selected color, price and availability state consistent across both sources. If the product is hypothetical, identify it as a concept and avoid invented ratings or customer endorsements. A mockup can make merchandising appear polished without making its claims true, so the source content needs the same review as any published product page.
Explain the choice instead of multiplying cards
Decide which question the wider screen answers. The three directions below should not all compete within the same hero.
| Inner-screen direction | Question it answers | Visual anchor |
|---|---|---|
| Item detail | What is this product? | The same selected item photograph |
| Comparison | How do these options differ? | Clearly labeled, comparable attributes |
| Collection context | Where does this item fit? | The selected item remains prominent |
Keep the presentation consistent with the product
Do not add a comparison feature, a checkout action or a personalization state solely because it fills the open screen nicely. For a real campaign, demonstrate what the app actually supports. A proposed interface exploration can include new ideas, provided the surrounding copy makes that status clear.
Use a quiet background when the product photography already has strong colors. Let the Duo rim and glass provide depth without covering the selected item with a dominant reflection. A useful deliverable pair contains an open detail view and a compact cover image, followed by motion only if the opening explains the browsing relationship. Before final export, compare item identity, labels and claims across every source and companion asset.
Final pass
Before you call it finished
- Use approved product images and truthful merchandising claims.
- Keep variant, price and selected item consistent.
- Choose one question for the expanded view to answer.
Make the next version yours.
Explore Duo templates ↗