patrickz
Before you start
A chat or coding assistant; a fictional event brief is provided below.
Why this lesson exists
The original is a landing page for hosted social events, written to make arriving alone less awkward. Its build path starts from a first-timer’s questions and sends every strong action to the real booking page, and this lab keeps that order.
Practice material
Fictional. Use it for every step below, or swap in your own later.
Lantern Walk Social (fictional event; every detail is a sample) What: a 90-minute evening walk and board-game hour for people new to the city. Most people come alone. When: Thursday 12 November 2026, 6:30–8:00 pm (sample). Where: meet at the Riverside Park north gate (sample), finish at Corner Table Café. Arrival: a host in an orange scarf waits from 6:15; name tags at the start. Cost: $12 including one drink (sample). Booking: https://example.com/book (placeholder). Not yet confirmed: step-free route, rain plan.
Do the exercise
Set your boundary
Answer what happens, who the format is for, where to go and how to book. Use sample content clearly labeled as fictional.
List first-timer questions
List the questions a first-timer arriving alone would ask. If you can, ask two or three friends what they would want to know first. Pick the three questions that matter most before arriving.
Turn them into sections
Turn those questions into visible sections.
Show one sample format
Show one sample event format, labeled as fictional, with location, audience and timeline.
Add one useful tool
Add one useful interactive tool, not a decorative animation.
Point every action at booking
Send every strong action toward the actual booking surface, and click it yourself.
Next sessions, not today
- First-timer interviews Interview three people who attended alone and compare their questions with your list.
- The first ten minutes If visitors still wonder what arrival feels like, describe the first ten minutes before adding another animation.
A prompt to adapt
Replace the bracketed parts with your own details.
Help me build a mobile-friendly page for [fictional event] in a new practice folder. First version only: answer what happens, who the format is for, where to go and how to book, with sample content labeled as fictional. Leave out testimonials, attendance claims, a first-ten-minutes walkthrough and decorative animation. List any setup commands before changing files. If you can’t create files, give me one self-contained index.html instead, and tell me how to save it, open it in my browser and preview it at phone width. Then work in five checkpoints and, after each, tell me how to check it on a phone: 1. The questions a first-timer arriving alone would ask, and the three that matter most before arriving. 2. Those questions turned into visible sections. 3. One sample event format, labeled as fictional, with location, audience and timeline. 4. One useful interactive tool, not a decorative animation. 5. Every strong action pointing at one booking destination: [booking URL or a labeled placeholder]. Use this brief: [paste the practice material or your own fictional event brief].
When your first version is done, paste it and ask:
If the interactive tool from checkpoint 4 is a conversation-starter picker, generate 30 starters for a [your event theme] meetup to fill it. Each should invite a story, avoid intrusive personal questions, and be easy to answer in under one minute.
Run this experiment
Ask a new reader to find date, location, arrival instructions and booking in thirty seconds on a phone. Click the booking destination yourself.
Check your result
Use evidence from your output. A confident explanation from the AI is not enough.
If it isn’t working
If a tester can’t find the date, location and booking link within thirty seconds on a phone, move those details into the first screen before adding anything else.
Optional. Progress stays in this browser.
Where this came from
Public project repository ↗. The practice lesson is an adaptation, not a verbatim transcript. About the sources.
Prepared September 2026. Tools and interfaces change; use current official setup instructions. Session lengths are estimates.