SynthMock
A dark interface is not the same choice as a dark phone. Keep the device and scene steady while comparing themes so the presentation reveals the interface differences rather than a change in art direction.
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.
Separate three kinds of darkness
The app theme affects source colors and contrast. The device finish affects the frame and body. The background affects the setting around both. Changing all three at once produces two campaign directions, not a clean comparison of the interface theme.
For a real product, capture the same task, selection and data in both supported themes. Do not create a fake dark mode by applying a filter to the entire screenshot. That can change images, status indicators and contrast relationships in ways the product never uses. A conceptual theme exploration should be labeled as such.
A proposed comparison matrix
Begin with a controlled pair. Only after that review should you consider a separate art-direction treatment for each theme.
| Comparison | Keep fixed | Change |
|---|---|---|
| Interface theme | Finish, camera, fold, light and background | The actual light/dark source |
| Campaign mood | Product task and source accuracy | An intentionally documented scene treatment |
| Device finish | The chosen interface theme and framing | Night Sky or Star White |
Review reflection against both sources
A light reflection can have a different visual effect over dark and pale areas of an interface. Keep the initial light constant to understand that difference, then decide whether the final campaign needs a carefully documented adjustment. Do not let a specular highlight erase the feature in one theme while leaving the other fully readable.
Present the pair at the same size with simple labels. If the design discussion concerns accessibility or usability, a mockup is only a presentation artifact; evaluate the real interface with appropriate methods separately. The image can reveal an obvious loss of hierarchy, but it should not be described as proving accessible contrast or better task performance. Keep the final theme comparison and any mood-driven campaign alternatives clearly distinguished in the handoff.
Final pass
Before you call it finished
- Use real supported theme captures or label a concept.
- Keep scene variables fixed for the initial comparison.
- Check the same important feature under both reflection treatments.
Make the next version yours.
Explore Duo templates ↗