OUTLOOK EMAIL KIT / ONE SATURDAY, 11 PROMPTS, VOICE MODE / BUILT WITH CLAUDE CODE

Emails that move.

Animated charts, vector graphics and scenes that breathe, all inside the Outlook inbox, the strictest canvas in office software.

Get the kit on GitHub Python · MIT licence · drops into Claude Code as a skill
0LINES OF
JAVASCRIPT
Try it

Two emails, one inbox

Pick a message. This is the real HTML the kit generates, shown the way new Outlook and Outlook on the web render it. The charts and the night scene are animated GIFs.

OutlookSearch

Week 42: roasters at 82.4% of capacity

Roast Report <roast@example.com> · to you

Simulated new Outlook. Classic Outlook (the Word engine) gets its own build of each email, with VML charts in place of the GIFs. Outlook 2013 to 2019 shows a GIF's first frame, so the kit makes frame 1 the finished chart. All data is fictional.

How it was built

Watch it get built

The whole kit came out of a single Claude Code conversation. Each building is a prompt and each lit window is a tool call Claude made, coloured by kind. A river marks where the conversation was compacted to free up its context.

11prompts
323tool calls
1 h 43 minClaude working
2compactions
making Edit, Writelooking Read, Grep, Globrunning Bash, PowerShelloutside web, subagents, skillsfailed a call that errored and was retried
01. let's try to find the most creative way to use HTML that is accessible or showable in stan 4 tool calls (1 looking, 3 outside)0102. you can create like simulated MSG environments, right? so you can have like an HTML contai 60 tool calls (30 making, 10 looking, 15 running, 1 outside, 4 failed)0203. wow, these look amazing. I'm interested in this GIF idea. does that actually work? because 60 tool calls (25 making, 7 looking, 21 running, 4 outside, 3 failed)0304. yeah, you can commit and push. 12 tool calls (5 making, 7 running)0405. let's have another shot at it. go blind and try to produce something really creative. 81 tool calls (19 making, 27 looking, 31 running, 4 outside)0506. we can use the pink gold ink. 29 tool calls (8 making, 8 looking, 13 running)0607. can you open it in my browser? 1 tool calls (1 running)0708. right, let's make some changes. let's have the yellow part at the top. and then... kind of 74 tool calls (30 making, 24 looking, 18 running, 1 outside, 1 failed)0809. so I don't think the interactivity actually works, right? it can work only as an animation 0 tool calls0910. which is still very cool, by the way. 0 tool calls1011. right, do you think we have a good version to commit? 2 tool calls (2 running)11
SAT 17 OCTTHE WHOLE SESSION

Press replay and the session rebuilds itself: every prompt types out at the time it was sent, and its building rises as Claude works.

323 tool calls across 11 prompts
What's in the kit

Four tricks that survive Outlook

Outlook has two rendering engines and strips most of what the web takes for granted. These are the tricks that still get through.

Charts that draw themselves

Lines draw on, donuts sweep, bars grow. Frame 1 is the finished chart, so an Outlook that won't animate still shows the numbers. Each GIF plays three times, matching the Microsoft 365 cap.

Click the chart to replay it.
Donut charts and a line chart as rendered by Word

Vector graphics in classic Outlook

Classic Outlook renders HTML with Word, which ignores most CSS. It still draws VML, Microsoft's vector format from 1998, so donuts and line charts stay sharp there too.

Shown: Word's own render of the Roast Report email.
A night city whose windows flicker on and off

Scenes that breathe

A night tower that never quite sits still: one GIF of 24 frames, built so the last frame flows into the first. A window going dark passes through an afterglow frame, so the flicker stays soft.

Frame 1 is the tower at rest, which is what a non-animating Outlook shows.
CLASSIC OUTLOOK · WORD ENGINEREAL
  • Rendered by WINWORD 16.0 via COM, then PDF, then PNG
  • MSO conditional branch active: VML shapes drawn natively by Word
  • 3 GIFs in the classic branch: this render shows frame 1, what Outlook 2013 to 2019 shows

See the real render before you send

The preview lab renders the classic version with Word itself, through COM, next to simulated new Outlook and the card. What you see is what classic Outlook will show, with no testing subscription.

Needs Windows with Word installed.