vidtheque.

read-only demo

Videos JRTAtZ5iBkU

HTML is All You Need (for Agents to Make Graphics) - Amol Kapoor, Nori

index_state ready data_status ok

AI Engineer· published 2026-06-28· 0:07:00· en-US· indexed 2026-08-10 19:56

Open on YouTube

Scene timeline

  1. Shot 0, 0:00 to 0:26, 1 of 1 keyframes kept
  2. Shot 1, 0:26 to 0:53, 1 of 1 keyframes kept
  3. Shot 2, 0:53 to 1:19, 1 of 1 keyframes kept
  4. Shot 3, 1:19 to 1:46, 1 of 1 keyframes kept
  5. Shot 4, 1:46 to 2:14, 1 of 1 keyframes kept
  6. Shot 5, 2:14 to 2:43, 1 of 1 keyframes kept
  7. Shot 6, 2:43 to 3:11, 1 of 1 keyframes kept
  8. Shot 7, 3:11 to 3:50, 1 of 1 keyframes kept
  9. Shot 8, 3:50 to 3:56, 1 of 1 keyframes kept
  10. Shot 9, 3:56 to 4:18, 1 of 1 keyframes kept
  11. Shot 10, 4:18 to 4:49, 1 of 1 keyframes kept
  12. Shot 11, 4:49 to 5:19, 1 of 1 keyframes kept
  13. Shot 12, 5:19 to 5:52, 1 of 1 keyframes kept
  14. Shot 13, 5:52 to 5:53, 1 of 1 keyframes kept
  15. Shot 14, 5:53 to 6:00, 1 of 1 keyframes kept
  16. Shot 15, 6:00 to 6:29, 1 of 1 keyframes kept
  17. Shot 16, 6:29 to 6:59, 1 of 1 keyframes kept

17 shot(s).

keyframes kept every frame deduplicated

What was stored

cues
99
whisperx 99
chunks
12
from 99 cues
keyframes
17
kept of 17 captured
frames with text
17
130 lines read
chapters
0
from the source metadata
keyframe bytes
1.1 MB
word timings on 99 cues

Provenance

Each pipeline stage, its state and the model that produced it
stage state model started took
fetch done — 2026-08-10 18:53 2m 00s
stt done — 2026-08-10 18:55 10s
chunk done — 2026-08-10 18:55 0s
text_embed done — 2026-08-10 19:56 0s
keyframe done — 2026-08-10 18:55 20s
ocr done — 2026-08-10 18:56 7s
frame_embed done — 2026-08-10 19:56 3s

Frames, and what the machine read

  • 0:23 #0 done7 line(s)

    shot 0·sharpness 886.0

    1. AMOL· CEO, NORI AGENTIC0.97
    2. docs1.00
    3. code1.00
    4. data1.00
    5. slack1.00
    6. Hi -I'm Amol.0.90
    7. We spend a lot of time thinking about how coding agents really work.0.99

  • 0:42 #1 done12 line(s)

    shot 1·sharpness 1157.8

    1. agents can ONLY write code0.99
    2. slides1.00
    3. docs1.00
    4. charts1.00
    5. • email0.84
    6. CODING AGENT0.99
    7. video1.00
    8. sheets1.00
    9. websites0.95
    10. diagrams1.00
    11. dashboards1.00
    12. You have to be able to think like an agent to get it to do what you want it to do.0.99

  • 1:04 #2 done5 line(s)

    shot 2·sharpness 1218.3

    1. THE REAL COST0.98
    2. 34,0001.00
    3. hüman-years0.96
    4. ...spenton slides. every single day.0.98
    5. the world pours something like 34,000 human years into making slide decks.0.99

  • 1:38 #3 done4 line(s)

    shot 3·sharpness 792.7

    1. TITLE1.00
    2. K0.94
    3. snap1.00
    4. All motions and patterns that make sense for our geospatial view of the world.1.00

  • 2:08 #4 done8 line(s)

    shot 4·sharpness 1229.0

    1. THE SKEPTIC'S CASE1.00
    2. “Sure — but agents can't actually reason0.98
    3. about space.”0.97
    4. ARC-AGI1.00
    5. INPUT1.00
    6. OUTPUT0.98
    7. and there are whole benchmarks like ARC-AGl that are built exactly around that0.99
    8. premise.1.00

  • 2:31 #5 done5 line(s)

    shot 5·sharpness 1723.0

    1. > Draw a pelican riding a bicycle. I0.97
    2. gpt-40-mini0.97
    3. gemini-1.5-flash1.00
    4. claude-3-opus1.00
    5. Here's some examples of what the models actually give you on this test.0.99

  • 2:54 #6 done16 line(s)

    shot 6·sharpness 1106.1

    1. BUT WHY, THOUGH?0.97
    2. L 190.0 48.0 q 18 14 30 2 Z0.98
    3. C -3.2 12.6 8.1 19.4 22.0 170.95
    4. M 56 128 a 30 30 0 1 0 60 00.98
    5. L 105 80 150 1280.97
    6. 102600.99
    7. 1681.00
    8. C 0.882 0.41 0.130.94
    9. 0.770.99
    10. 0.550.96
    11. .211.00
    12. M 134 35 1 0.001 0.0010.95
    13. q 88.7 312.4 71.2 290.1 144 560.98
    14. M 100 84 104 122 z0.97
    15. If I asked you, someone who is presumably human, to hand-write an SVG of a0.99
    16. pelican,1.00

  • 3:45 #7 done5 line(s)

    shot 7·sharpness 1530.8

    1. Imagine a language that...0.98
    2. describes visual layout0.99
    3. has mountains of training data0.99
    4. Imagine a language that's incredible at describing layout, that models have seen1.00
    5. and trained on billions of examples of,1.00

  • 3:50 #8 done7 line(s)

    shot 8·sharpness 2151.7

    1. Imagine a language that...0.99
    2. describes visual layout1.00
    3. has mountains of training data0.99
    4. models understand it intuitively1.00
    5. renders straight to pixels0.99
    6. runs basically everywhere0.98
    7. that they understand intuitively, that renders to pixels and can run everywhere.0.99

  • 4:14 #9 done10 line(s)

    shot 9·sharpness 1141.9

    1. model writes meaning1.00
    2. Q3 Results0.99
    3. <h1>Q3 Results</h1>0.99
    4. <div class="grid"> .… </div0.96
    5. browser1.00
    6. <canvas id="chart"></canvas>0.99
    7. →0.59
    8. charts1.00
    9. the model never places a coordinate.0.99
    10. And you can get all sorts of visual effects, charts and layouts,0.99

  • 4:31 #10 done5 line(s)

    shot 10·sharpness 1184.0

    1. SAME PROMPT· DIFFERENT MEDIUM0.98
    2. in HTML0.98
    3. gemini-1.5-flash, as SVG1.00
    4. as HTML - structure you can read0.99
    5. And you can read and theme and edit every single line of it.1.00

  • 5:04 #11 done8 line(s)

    shot 11·sharpness 1018.9

    1. THE REFRAME0.98
    2. PRESENTING MODE0.99
    3. Q3 Results0.99
    4. EDITING MODE0.98
    5. HTML1.00
    6. same result0.99
    7. So you can just pick the editing format that the agents are already good at,0.99
    8. HTML,1.00

  • 5:36 #12 done12 line(s)

    shot 12·sharpness 1174.2

    1. VIDEOS → HTML0.96
    2. norisessions.com/talk/index.html1.00
    3. Elements1.00
    4. <div class="stage">0.99
    5. <div class="scene">1.00
    6. <div class="nori-logo">...</div>0.98
    7. <div class="caption-bar">.…</div>0.98
    8. <√div>0.98
    9. <√div>0.94
    10. a talk, rendered in a browser0.99
    11. (yes - you're watching one right now)0.98
    12. It's literally just divs all the way down.1.00

  • 5:52 #13 done2 line(s)

    shot 13·sharpness 753.5

    1. but it's usually the wrong one if you're actually trying to create something of0.99
    2. use.1.00

  • 5:59 #14 done7 line(s)

    shot 14·sharpness 1275.2

    1. Board Deck0.99
    2. ??1.00
    3. 20.98
    4. HTMLノ0.86
    5. context?0.99
    6. I do want to take a quick beat here and point out that a beautiful deck on its own1.00
    7. is generally not worth anything.0.99

  • 6:26 #15 done13 line(s)

    shot 15·sharpness 1220.6

    1. NORI SESSIONS0.99
    2. on the commute1.00
    3. transcripts1.00
    4. Board Deck0.99
    5. emails1.00
    6. Workspace1.00
    7. session1.00
    8. Slack0.99
    9. format1.00
    10. layout1.00
    11. charts1.00
    12. you → vision & story0.98
    13. I've built entire board decks from my phone on the subway during my commute.0.99

  • 6:53 #16 done4 line(s)

    shot 16·sharpness 966.4

    1. HTML is All You Need0.97
    2. (for Agents to Make Graphics)1.00
    3. norisessions.com1.00
    4. Given the right language and for graphics, all you need is HTML.0.99

Transcript

99 cues· 1,116 words· 5,904 chars

  1. 0:10 Hi, I'm Amol, CEO of Nori Agentic.
  2. 0:14 We deploy an AI employee that understands your company, your code, docs, Slack, and other kinds of data.
  3. 0:23 We spend a lot of time thinking about how coding agents really work.
  4. 0:28 Most people think coding agents only write code.
  5. 0:31 But if you ask me, that's just bad marketing.
  6. 0:33 Forget the name for a second.
  7. 0:35 Coding agents can do almost anything.
  8. 0:38 There's just one trick.
  9. 0:39 You have to be able to think like an agent to get it to do what you want it to do.
  10. 0:44 Today, we're going to talk about how we use coding agents to do something most people think agents are terrible at.
  11. 0:50 Make visual artifacts, like slides, docs, and yeah, even video.
  12. 0:59 Every day, the world pours something like 34,000 human years into making slide decks.
  13. 1:05 Most of that time isn't the thinking, it's the fiddling.
  14. 1:09 A deck that takes 10 hours should really take about 25 minutes once you remove all the formatting and the branding and the moving things around.
  15. 1:18 Say you need to make a slide.
  16. 1:20 What do you do?
  17. 1:22 You open a tool, PowerPoint, slides, Figma, Canva, and then you start manipulating a canvas.
  18. 1:29 Every one of these tools is built for human hands and human eyes.
  19. 1:32 Click, drag, drop, resize, snap to grid, all motions and patterns that make sense for our geospatial view of the world.
  20. 1:41 There is a data structure underneath, but it's in a format that only the application can read.
  21. 1:47 What happens when you hand these tools to an agent?
  22. 1:49 Well, the output comes out all wrong.
  23. 1:52 Things overlap in weird ways.
  24. 1:54 You can't see the text.
  25. 1:55 There's no alignment.
  26. 1:56 It's just garbage.
  27. 1:58 AI skeptics say that it's not just the tools.
  28. 2:01 Agents fundamentally can't reason about space.
  29. 2:04 And there are whole benchmarks like Arc AGI that are built exactly around that premise.
  30. 2:10 There's a famous little test for this from developer Simon Willison.
  31. 2:14 He asks every new model the same thing.
  32. 2:17 Can you draw a pelican riding a bicycle?
  33. 2:20 But there's a trick.
  34. 2:21 The agent is only allowed to use SVG.
  35. 2:25 It's a quick gut check for whether a model can reason about space at all.
  36. 2:29 Here's some examples of what the models actually give you on this test.
  37. 2:32 And yeah, these are pretty bad.
  38. 2:35 Like genuinely, deeply, really bad.
  39. 2:39 So does that mean it's hopeless?
  40. 2:41 Agents are just doomed to be bad at graphics?
  41. 2:43 No, I don't think so.
  42. 2:46 If you ask me, it's not the model, it's the medium.
  43. 2:49 If I asked you, someone who is presumably human, to handwrite an SVG of a pelican, you wouldn't be able to do that either.
  44. 2:58 SVGs are just a wall of numbers.
  45. 3:00 You can't go from a wall of numbers to a pelican.
  46. 3:03 You just can't see that way.
  47. 3:05 That's just not how people think.
  48. 3:07 We think graphically, so we build tools that let us draw on a canvas.
  49. 3:12 Figma MCPs, PowerPoint CLIs, screenshot and replace loops, what do all of these agent tools have in common?
  50. 3:19 They all approach the problem like a human.

Open at this second