Hello, popup
StarterBuild a friendly popup: a big heading, one line of text and a button that closes it.
Every challenge shows you a finished popup. Build one that looks and behaves the same in the real editor, press Check, and get a score out of 100. 32 challenges, from your first button to lists and app actions.
Your first popups: text, images, buttons and links.
0 of 7 passedBuild a friendly popup: a big heading, one line of text and a button that closes it.
Recreate the announcement card: a small badge, a heading, a grey sentence and a button, all centred.
Ask a question with two buttons side by side: a main “Yes” that tells your app, and a quiet “No thanks” that closes the popup.
Show a list of perks with a bold word and a link, using one Rich Text block.
Use a coloured Line and a Space block to give a heading, a sentence and a button some air.
Centre an amber star icon above a heading, a sentence and two buttons.
Show a wide banner image above a heading, a sentence and a button that opens a web address.
Columns, rows, colours, fonts and media.
0 of 8 passedRecreate the promotion: an image beside the offer on desktop that stacks on phones, with a badge, heading, rich text and a button.
Centre a heading above three buttons of different sizes and looks that wrap onto a new line when there isn't room.
Three plan cards in a grid that shows 3 across on desktop, 2 on tablet and 1 on phones. The middle plan has a coloured outline.
A product photo, a row with the name on the left and price on the right, a grey caption and a full-width Add to cart button.
Make the whole popup dark with big rounded corners and a soft glow, with an amber button.
Pick one font for headings and another for everything else, for the whole popup at once.
A centred card with a diagonal indigo-to-pink gradient, white text, rounded corners and a badge.
Corners, glass, layers, timers and phones.
0 of 9 passedA small card in the bottom-right corner that slides up, leaves the page usable behind it, and uses its own fonts for the whole popup.
A full-width strip across the top of the page with one line of text and a small link button, sliding down from above.
A translucent card with a blurred backdrop sitting on a gradient, with an outlined badge and a glassy button.
Content floating over a dark, blurred page: big uppercase headings (one with a gradient), a gold gift icon and a gradient button.
Stack things on top of each other: a gradient fills the box, a “New” badge sits top-left and a heading bottom-left.
A sale popup with a 90-minute timer that starts when it opens, a message when it ends and a big button.
An app-install strip that only appears on phones, stuck to the bottom of the screen.
An editorial layout where the heading is 44px on desktop but 30px on phones, with tighter padding on small screens.
A banner image that opens a web address, rich text with links, a 10-minute timer and a button that shows “Bonus added!” when your app says it worked.
Personalise with variables, lists and app actions.
0 of 8 passedGreet each player by name and fill in their discount and favourite category, using variables.
Say hello with a name that falls back to “friend” when your site doesn't know it, and a discount that falls back to 10.
A button that asks your app to claim a gift, then shows “Gift added!” if it worked or “Couldn't claim. Try again.” if it failed.
Show three offer cards from one list. Each card has a tag, title, amount and price, and its own Avail button that sends that card's id to your app.
Packs in a two-column list where each Buy button closes the popup first, then asks your app to open its own checkout for that pack.
A leaderboard from a list: show only the first three rows, number them, and show “No scores yet” when the list is empty.
A live-event popup: badge, a name and prize pool from variables, a 2-hour timer, and a Join button that sends the tournament name and closes the popup when it worked.
Put it all together: a frosted VIP card with the player's name, a list of perks in columns that stack on phones, and a Claim button that closes the popup when your app says it worked.