Examples
Tax Days
The Tax Days example: App Store and Google Play screenshot collections sharing one 38-locale strings file, with phone and tablet sizes written through outFile.
Tax Days tracks days spent in each country for tax residency. Its asset project shows one strings file feeding both stores.
| Collection | Source size | Templates | Locales | Exports |
|---|---|---|---|---|
App Icon icon | 1024×1024 | 1 | - | 1024px (1024×1024), 512px (512×512) |
App Store Screenshots screenshots | 440×956 | 8 | en, ar, de, ja | iPhone 6.9" (1320×2868), iPhone 6.7" (1290×2796), iPhone 6.5" (1284×2778), iPhone 6.1" (1179×2556) |
Play Store Screenshots screenshots-android | 440×978 | 8 | en, de | Phone (1080x2400) (1080×2400), 7" Tablet (1200×1920), 10" Tablet (1600×2560) |
Source: examples/tax-days on GitHub.
Techniques
- Two stores, one strings file. The
screenshotscollection (440x956 source, four iPhone sizes) and thescreenshots-androidcollection (440x978 source, phone plus 7 and 10 inch tablets) both point at the samelocalizations.json. The file defines 38 locales. Each collection picks its own subset withlocales:en,ar,de,jafor iOS anden,defor Android. - Separate templates per platform. Android templates live in
assets/screenshots-android/with their own captures inpublic/screenshots-android/, because the aspect ratio and the device chrome differ. - Per-locale captures. Like Skimmer, device images use
data-locale-imgand swap topublic/screenshots/<lang>/when the locale changes. - Tailwind v4 theme. Gradients, glow orbs and pill badges come from classes defined in
src/styles.css(bg-td-gradient,glow-orb,pill). - outFile layout. Renders land in
exports/screenshots/{locale}/<size>/{template}.pngandexports/screenshots-android/{locale}/<size>/{template}.png.
Run it
cd examples/tax-days
npm install
npm run dev
npm run renderRender one platform or one language while iterating:
npx open-assets render --collection screenshots-android --locale deWhat to copy
- The two-collection layout if you ship on both App Store and Google Play. See Google Play.
- A single
localizations.jsonwith per-collectionlocales, so translations are written once.
Last updated on
Skimmer
The Skimmer pool care example: eight localized App Store screenshots in four languages with Tailwind v4, photo backgrounds and per-locale device captures.
Only Recipes
The Only Recipes example: eight iOS and eight Android screenshots built with CDN Tailwind, oversized headlines, highlighted keywords and real app captures.