01The date buried in the hero
A date set in small grey type under a full-bleed image is technically present and practically invisible. If a visitor has to look for when it is, they will assume it already happened.
Launch / Event Page
An event page has one job and a hard deadline. The visitor either registers now or the page has failed, and there is no second visit because the event will have happened. That makes it the page type where decoration costs the most.
What this page has to do
The standard generated launch page opens with a full-viewport gradient, a headline set in a display face, and the date in 12px grey type at the bottom of the hero. Everything the visitor needs is technically present and functionally invisible.
The rule this recipe enforces is blunt: the four facts sit in the first screen at a readable size, and the register action appears three times — in the hero, after the schedule, and in the footer. A single button at the bottom assumes a visitor who reads to the end, which is a visitor who has already decided.
Section order
The order is the argument. Reordering these is not a layout decision, it is a change to the reasoning.
-
01
Hero with the four facts
Name, date with timezone, city or link, and one sentence of what happens. All four above the fold at 16px or larger. An image may sit behind them only if contrast still passes.
-
02
What it is
Three short paragraphs or three bullets: who it is for, what they will leave with, and what it is not. The third prevents the wrong registration.
-
03
Schedule
Times in the venue's timezone with an explicit label, and a duration for every item. Prose descriptions of a schedule cannot be scanned and are the most common reason people arrive at the wrong hour.
-
04
Speakers or proof
Three to six people with name, role and one line of why they are worth listening to. For a product launch, replace with three concrete things being shown.
-
05
Register
The form or link, repeated. Price and capacity stated next to it, plus what happens after submitting — a calendar file, a confirmation email, or both.
-
06
FAQ
Five questions: cost, refunds, recording, accessibility, and whether it is remote. These are the five emails the organiser would otherwise answer individually.
-
07
Footer
Organiser name, a contact address, and the code of conduct link for anything with an audience.
Build the prompt
6 variables. Change one and the text below rewrites itself — nothing else on this page moves.
The most scannable and the most robust on mobile if allowed to reflow.
Fewest fields that still identify a person.
Build a single-page site for a one-day conference. It runs 09:00 to 17:30, has two tracks, six speakers and a ticket price. The schedule is the centre of gravity and must be scannable in under thirty seconds.. AUDIENCE Someone who saw a link in a newsletter or a message and has about fifteen seconds to decide whether this is worth an evening. They are on a phone, they do not know who is organising it, and they will not scroll to find out when it starts. STRUCTURE (exactly this order) 1. Hero containing exactly four facts, all at 16px or larger: the name of the event; the date and start time with an explicit timezone; the city and venue, or a link if it is online; one sentence describing what happens. Below them, a primary register button and a secondary link to the schedule. 2. What it is: three short items. Who it is for, what they will leave with, and what it is not. 3. Schedule: Render the schedule as a table with time on the left in monospace, item and speaker in the middle, and duration right-aligned. Include breaks and the closing time, which are the two rows people plan around. Every item carries a start time, an end time and a duration. Times labelled with the timezone once, in the section heading. 4. Speakers or proof: Show speakers as a list of four: name, role and company, and one sentence naming something specific they built or argued. No headshots larger than 80px, no social icons. Three to six entries with name, role, and one sentence on why this person is worth listening to. No generic bios. 5. Register: Use a two-field inline form (name, email) plus a submit button, with a visible success state that confirms the date and says a calendar file is on its way. State the price, the capacity, and what happens after submitting. Repeat the register button here, not only in the hero. 6. FAQ: exactly five questions — cost and what it includes, refunds and transfers, whether it is recorded, accessibility and dietary needs, and whether there is a remote option. 7. Footer: organiser name, contact email, and a code of conduct link. STYLE Poster: one saturated background colour across the whole page, the event name set in a condensed display face at 4 to 6rem, all other text in a neutral sans, thick 4px rules between sections, no cards and no shadows. MOTION No animation. The page has a deadline and the visitor has fifteen seconds; nothing should delay the four facts. COPY RULES - The date must appear in the first 25 words of the page and again in the register block. - Never write the schedule as prose. Times only in a table or a list with a time column. - No countdown timer unless it includes the timezone and the target datetime in the markup. - No speaker listed as TBA. If a slot is unconfirmed, omit it rather than placeholder it. - Banned: join us for an unforgettable evening, thought leaders, industry experts, networking opportunities. CONSTRAINTS - All four hero facts visible at 390x844 without scrolling, at a minimum of 16px. - If a background image sits behind the hero, text contrast must remain at least 4.5:1 in the darkest and lightest region it covers. - Register button at least 48px tall and reachable with a thumb. - Times marked up with a machine-readable datetime attribute so calendar links and search results are correct. - Page must work with images blocked; the four facts are text, never part of an image. - No autoplaying video in the hero. OUTPUT One page. No framework. The register action is a single form or a single link, used consistently in all three places.
What to change, and what to leave alone
| Variable | How to edit it |
|---|---|
{{EVENT}} |
This changes the schedule shape, the price treatment and the FAQ answers. Swapping the label without changing the schedule produces a conference with a workshop timetable. |
{{SCHEDULE}} |
Cards read better but compare worse. If the event has parallel tracks or a break people plan around, use the table; if every item needs a description, use cards. |
{{PROOF}} |
For a launch, demos beat speakers. A list of advisors nobody recognises is weaker than three sentences describing what will actually appear on screen. |
{{REGISTRATION}} |
Never mix two mechanisms. A form plus an external link splits the audience and makes the capacity number meaningless. |
{{STYLE}} |
Poster styling needs a real display face and a colour you can hold for a whole page. Half-applied, it looks like a template with one loud section. |
Feeding it to each builder
| Builder | What to do differently |
|---|---|
| v0 | Generate the hero with the four facts first and check it at 390px before anything else. Most of the value of this page is decided in that one screen. |
| Lovable | It will add a countdown. Keep it only if the target datetime and timezone are in the markup; a countdown that disagrees with the stated start time is worse than none. |
| Bolt | Ask for the schedule as semantic table markup with datetime attributes, not divs. This is the difference between a calendar link that works and one that silently contains the wrong hour. |
| Cursor / Claude Code | Put the schedule in a small JSON file and render from it. Event details change constantly in the final week, and editing markup under time pressure is how the wrong time ships. |
Where it usually breaks
02A countdown with no timezone
Counting down to a local time that the reader does not share sends people to the wrong hour. Either state the timezone in the label or omit the timer; there is no acceptable middle.
03The schedule written as prose
We start at ten with a keynote, then break for coffee around eleven is unparseable when someone is deciding between two events on the same day. Times belong in a column.
04One register button at the very bottom
A visitor convinced at the hero has to scroll the entire page to act. Three placements — hero, after the schedule, footer — cost nothing and catch three different moments of decision.