Kelas Lentera

The challenge

Online courses are sold with a nudge to sign up now. The problem is how easily that nudge turns into an annoyance: popups that keep reappearing, countdowns that visibly restart on every page load, and price lists that leave the visitor doing arithmetic.

This page also carries the most at once: an offer that pops up, a price comparison, and a sign-up form. All three had to sit together calmly instead of competing for attention.

What was built

The brightest palette of the four demos: indigo with a lime accent, chunky rounded corners, and a dense layout that arranges “problem → solution” into blocks of differing sizes, so the eye has places to stop.

The offer is polite about it. It appears when a visitor looks about to close the tab, or after half a minute of reading, and then never again for that visitor. It closes with Esc and doesn’t trap keyboard focus inside itself.

The countdown in the closing section uses a deadline that genuinely recurs on the calendar, not a number that restarts on page load. If the urgency isn’t honest, an attentive visitor will notice.

The prices switch between monthly and yearly without the page jumping around underneath you, and the whole thing works from the keyboard.

What it measures

This page scores a perfect performance result in the simulated phone test despite carrying the most features. The full numbers, including how much code actually reaches a visitor’s browser, are in the panel below.