Preview image. Unlock full-res
A four-slide product demo for Directory Plus, a mockup-generation web app, showing a rendered phone mockup, the dark editor UI, and export/resolution controls.
Summary
A product-demo carousel for "Directory Plus," a browser-based mockup generator: an example output (a phone mockup held in-hand), then the dark editor UI that produced it, then its export controls.
Visual description
Slide 1 is a rendered example: a hand holds a phone whose screen shows a "Gentle Systems" weather app with a 3D isobar surface chart in yellow-green gradient over a light UI. Slide 2 is a screenshot of the Directory Plus web editor itself (dark browser chrome, "plus.directory" URL): a dark canvas holds the same phone mockup on a light gray backdrop, labeled "BL49 Standard License," with a lime-green "Download" pill button below and a top toast reading "Instantly render with similar mockups using the sidebar or browse." Slide 3 is a tight crop on a resolution/format picker: pill-shaped toggle group reading "Full / Medium / Small / 3000 x 2000 px" with JPG/PNG format toggle, white text on near-black, cursor mid-click. Slide 4 is a cropped video frame showing a "Copy to clipboard" tooltip over a grid of laptop/device mockups in progress.
Key takeaway
The dark, low-chrome editor UI keeps focus entirely on the mockup preview; controls (license tier, download, resolution/format) are minimal pill-shaped elements that don't compete with the product shot itself.
Reuse notes
Useful reference for a tool/SaaS product page selling a generator or export utility: pairing a finished-output hero shot with a screenshot of the tool that made it builds credibility fast. The pill-toggle resolution/format picker is a clean pattern for compact export settings.
