Everything a designer needs to create the popup background and landing for Popconvert campaigns: sizes, where text and the game sit, what can be cropped, and templates to download.
The templates use graphic design conventions, with values measured on real Popconvert campaigns (not generic print values).
This terminology follows design practice: bleed is the part of the artwork that extends past the final area to avoid empty gaps if it is cropped; the safe zone is the area where text and logos stay protected. (Adobe, Canva)
The popup goes through three screens and the elements change position on each one. The template shows all three at once, with different line styles:
1. Opt-in
Title, subtitle, game, email field, button and legal text appear together. It is the busiest step and the most critical for the artwork.
2. Game
The form disappears. Title and subtitle move and the game (wheel, machine, icons or card) takes center stage.
3. Coupon
Only the title, the large coupon and the buttons to copy the code or close appear.
On the coupon step there is a campaign option to show or hide the popup background image. When it is off, only the background color appears.
The popup background image applies to on-site campaigns and QR Code campaigns. It fills the popup and, if the image proportion differs from the popup’s, it is scaled up until it covers it and the excess is cropped. So always use the exact proportion of the template.
| Game | Desktop · Popup | Desktop · Export at | Mobile · Popup | Mobile · Export at |
|---|---|---|---|---|
| Spin the Wheel | 85% of the screen height, 18:17 ratio (972×918 on a 1080 px tall screen) | 1944×1836 | 90% of the screen width and 80% of its height (351×675 at 390×844) | 702×1350 |
| Slot Machine | 800×512 px | 1600×1024 | 320×720 px | 640×1440 |
| TNT | 480×672 px | 960×1344 | 320×592 px | 640×1184 |
| Scratch Card | 480×720 px | 960×1440 | 320×592 px | 640×1184 |
| Mystery Gift (Pick a Gift) | 480×672 px | 960×1344 | 320×592 px | 640×1184 |
| Treasure Hunt (Treasure Hunt) | 480×672 px | 960×1344 | 320×592 px | 640×1184 |
On desktop the wheel takes the left half of the popup and the text sits on the right; the popup is 85% of the screen height. If the wheel is set to the right, the zone layout is mirrored (there is a template for that case). On mobile the popup takes 90% of the width and 80% of the height of the screen and the wheel sits at the bottom.
Machine on the left and text on the right on desktop; on mobile the machine is on top and the form below. Fixed size.
The icons (balloons or bombs) float around the game area and, after the email step, move across a larger area: the template shows both. Fixed size.
The card sits in the middle with the form below it. Fixed size.
Same proportions, dimensions and zones as TNT; only the icon (a gift) changes and the elements stay still instead of floating. Information from the Popconvert team.
Same proportions, dimensions and zones as TNT; only the icon (a treasure chest) changes and the elements stay still instead of floating. Information from the Popconvert team.
The landing background exists only in QR Code campaigns, which Popconvert hosts. Campaigns on the customer’s website have no landing background, because they run on the customer’s own page.
If no image is uploaded, the landing shows a gray background.
| Game | Position on desktop | Popup (desktop) |
|---|---|---|
| Spin the Wheel | Left (default) or right | 972×918 px |
| Slot Machine | Centered | 800×512 px |
| TNT · Pick a Gift · Treasure Hunt | Centered (also Pick a Gift and Treasure Hunt) | 480×672 px |
| Scratch Card | Centered | 480×720 px |
The landing templates show the area covered by the popup and crop lines calculated for screens of other proportions. On mobile the popup’s vertical position varies with the screen height: the top sits at 18 px on 360×640, 41 px on 390×844 and 51 px on 430×932.
The phone sizes used for the measurements were 360×640, 390×844 and 430×932 (popular iPhone and Samsung models). The mobile templates start from 390×844.
The Scratch Card popup is 480×720 on desktop and 320×592 on mobile. Export the background at 960×1440 (desktop) and 640×1184 (mobile).
The Slot Machine popup is 800×512 on desktop and 320×720 on mobile. Export at 1600×1024 (desktop) and 640×1440 (mobile).
The TNT popup is 480×672 on desktop and 320×592 on mobile. Export at 960×1344 (desktop) and 640×1184 (mobile).
On desktop the Spin the Wheel popup takes 85% of the screen height at an 18:17 ratio (972×918 on a 1080 px tall screen); export at 1944×1836. On mobile it takes 90% of the width and 80% of the height of the screen (351×675 at 390×844); export at 702×1350.
Yes. According to the Popconvert team, the proportions, dimensions and zones are the same as TNT: a 480×672 popup on desktop and 320×592 on mobile. The difference is the game icon, and the elements stay still instead of floating.
The QR Code campaign landing shows a gray background.
No. The landing background exists only in QR Code campaigns. Campaigns on a website run on the customer’s page and only have the popup background image.
On desktop, no: the wheel sits against the left edge (default) or the right edge, and choosing the right mirrors the zone layout. The other games are centered.
The image is scaled up until it covers the popup and the excess is cropped at the edges. In a vertical popup, a horizontal image loses its sides. Use the exact proportion of the template.
No. The sizes and templates cover desktop and mobile.
Not a Popconvert customer yet?
