DEV Community

Cover image for Why I Built ASOShot: A Free App Store Screenshot Editor
Cihan Koç
Cihan Koç

Posted on Originally published at asoshot.com

Why I Built ASOShot: A Free App Store Screenshot Editor

Preparing store screenshots should be a short release task. In practice, it often turns into a small design project: find the current export sizes, place several captures in consistent frames, keep text readable, repeat the work for every locale, and discover a dimension error only after uploading.

I built ASOShot to make that workflow less fragile. It is a free browser-based editor for App Store and Google Play screenshot graphics. You can start from a template, add real app captures, edit captions, switch between flat and perspective device frames, and export full-resolution images without creating an account.

This is not an independent review. I am the maker, and this is the reasoning behind the product.

The problem was repetition, not a lack of design tools

General-purpose design software can produce excellent store assets. The difficulty is maintaining a matrix of screens, store sizes, and languages without introducing drift.

A screenshot set has two kinds of decisions:

  • Shared decisions: background, typography, device model, frame color, and the overall composition.
  • Exceptions: a longer German headline, a different crop on one screen, or a frame shifted to reveal an important control.

Copying artboards handles the first version. It becomes harder when a later change should reach every screen except the few intentional overrides.

ASOShot models that split directly. The Global Studio controls shared settings. A per-screen panel stores only the properties changed for that screen. If one frame has a custom rotation, it can still inherit a later global color or shadow change.

The editor is local-first

Imported screenshots and canvas rendering stay in the browser. Projects can be saved in browser storage or downloaded as a portable JSON backup. Translation is the exception: when used, only caption text and the selected languages are sent to the configured translation endpoint. Images are not sent for translation.

That boundary matters for unreleased apps. It also keeps the basic workflow simple: open the editor, choose a template, and start working.

Export fidelity became the main engineering constraint

The first renderer used a DOM-to-image approach. It worked for ordinary layout but failed on realistic perspective frames. Browsers composite CSS 3D layers for the current display size; enlarging that result for a store-resolution export can expose blurred edges and a mismatch between the preview and the downloaded file.

The current export path draws directly to a 2D canvas. Backgrounds, captions, badges, shadows, device edges, and screen images use the same geometry as the preview. Perspective devices are projected and drawn in slices instead of capturing the editor DOM.

The preview remains fluid, while export runs at the target's native pixel dimensions. That separation lets a small editor preview stay responsive without making it the source bitmap for the final image.

What is included today

The current project includes:

  • 15 category templates
  • iPhone, iPad, and Android export targets
  • Flat and perspective device frames
  • Multiple frames per screen, including cross-screen layouts
  • Captions for more than 20 locale presets
  • Full-resolution PNG and JPEG export
  • Batch ZIP export across selected screens, sizes, and locales
  • JSON project backup and restore

There is no public screenshot-generation API or MCP server. ASOShot is currently an interactive browser editor. I prefer stating that plainly rather than advertising a roadmap item as a finished feature.

The workflow I wanted

  1. Pick a template close to the app's visual category.
  2. Select the store sizes that will actually be submitted.
  3. Upload real product captures.
  4. Write one clear benefit per screen.
  5. Review frame placement and text at every selected size.
  6. Add locales, then review automatic translations before publishing.
  7. Export the final matrix as a ZIP.

Apple and Google change asset requirements, so the editor is not a substitute for checking their current documentation before a release. It is meant to remove the repetitive composition and export work after those targets are known.

ASOShot is available at asoshot.com. If you try it on a real release, the most useful feedback is specific: which screen size, frame arrangement, or localization step slowed you down?

Top comments (0)