Demos, Films and Sound

Make faux product UI, plan and review a launch film, and design a sound family.

3 modules · 14 episodes · 2 h0/14

Season 1

Product demos

Make faux product UI (heroes, feature cards, cursor demos) that reads as the real thing.

11. Why fake UI looks fake7 minName the five ways a product illustration fails, and set a word budget so your agent's demo reads as a real product instead of a generated one. Read Watch
22. Framing the shot7 minDecide the size, crop and satellite of a product illustration before anything is built, so it reads as a product shot and not a screenshot in a box. Read Watch
33. Story, cursor and loops8 minScript an animated product demo with three to five beats, a cursor that moves like a hand, a poster frame that works alone, and a loop that resets for a reason. Read Watch
44. Bento grids and rehearsal7 minPlan a grid of feature tiles as one picture, then check an animated demo the way an audience sees it, frame by frame, before you ship it. Read Watch

Season 2

Plan, cut and review a product launch film.

11. Pick the register first7 minName the kind of launch film you are making before anything else, so cut rate, stillness and loudness all have a target. Read Watch
22. Time the beats7 minPlace the hook, the name, the proof and the endcard at the moments real launch films use, and know which of three name modes you are in. Read Watch
33. Words and product on screen8 minBuild on-screen type at a readable cadence, and drive the product UI with a cursor, typed prompts and an honest wait. Read Watch
44. Cuts, seams and motion8 minMake every scene change read as one move, avoid the two cuts that fail in every register, and keep motion inside a shot calm and causal. Read Watch
55. Review, render and ship9 minReview a render against its own register, render it from code without the classic traps, and ship the loop, sting and vertical cuts that go with it. Read Watch

Season 3

Decide which moments earn a sound, then design and wire one family.

11. Silence is the default6 minDecide whether a moment in your interface should make a sound at all, using how often it happens, what it is for and the 100th-use test. Read Watch
22. One family of sounds7 minDesign four to six sounds that share one material, and give each one the right pitch, length, loudness and file format. Read Watch
33. Sound from motion7 minPlace a sound on the exact frame where the motion makes contact, and derive its pitch, length and position from the motion itself. Read Watch
44. Playing and making sounds7 minWire sound into a web app the right way (unlock on a gesture, off by default, a visual twin for every sound) and make the files with code, a model or a free library. Read Watch
55. Sound in launch films8 minPick a sound register for a launch film, place the track's structure on the picture, take sound away before the reveal, and only use recordings you are licensed to. Read Watch