Recreating Wang Hong’s Hand‑Written PPT Style with AI: Prompts and Open‑Source Skills

The article details how the author reproduced Wang Hong’s hand‑written PPT from ICM 2026 using AI‑generated images and a pure HTML/CSS approach with the neat‑annotations library, providing prompt examples, design guidelines, a 19‑page slide deck, and a ready‑to‑install Skill package.

Old Zhang's AI Learning
Old Zhang's AI Learning
Old Zhang's AI Learning
Recreating Wang Hong’s Hand‑Written PPT Style with AI: Prompts and Open‑Source Skills

Why Recreate a Hand‑Written PPT?

After seeing Wang Hong’s 45‑minute hand‑written presentation at ICM 2026, the author was impressed by its clean typography, high information density, and minimalist design, and decided to replicate the style using AI and web technologies.

Characteristics of the Original Slides

The original deck uses pure white digital paper, hand‑drawn fonts with natural pressure variation, and a consistent color scheme: deep blue for text and formulas, cobalt blue for titles and axes, magenta for conclusions, fluorescent yellow for brief highlights, and green for confirmed definitions. No headers, footers, logos, or page numbers appear, keeping the audience’s focus on the content.

Tool Behind the Original Look

Although the exact tool is not confirmed, visual cues suggest the slides were created with a hand‑writing app such as Notability, which provides a near‑white canvas, realistic ink strokes, semi‑transparent highlighters, and slightly jittery lines.

First Attempt: GPT Image Generation

The author tried generating the first four pages with a text‑to‑image model (GPT Image) using the following prompt:

创建一张手写的中文技术演示幻灯片,呈现在一张平整、温暖的米白色 Notability 风格数字笔记页面上。整张幻灯片应当给人一种精心准备的学术报告讲义的感觉:沉稳、精确、信息密度高、逻辑清晰,并且是真正的手写风格。

While the results were satisfactory, the method has two drawbacks: it is slow and the output is an image that cannot be easily edited.

HTML + CSS Solution

To overcome these issues, the author switched to a pure HTML/CSS implementation, leveraging the neat-annotations library for hand‑drawn arrows and labels. The library provides classes such as ann-n, ann-ne, ann-w to control arrow direction, built‑in colors, and a rainbow animation. Custom colors can be set with --ann-color, and the default background highlight can be removed with ann-no-mark.

For Chinese support, the author replaced the default Latin‑only font stack with --ann-font set to HanziPen SC, Hannotate SC, or LXGW WenKai. Because annotations are absolutely positioned, the maximum label width was increased to 180‑240 px to accommodate longer Chinese phrases.

Full 19‑Page HTML Deck

The author prepared a complete 16:9, 1920×1080 slide deck following a strict visual system:

Background: warm off‑white, no headers/footers/page numbers.

Fonts: hand‑written Chinese stacks for both Chinese and Latin characters.

Colors: deep blue for body text, cobalt blue for derivation lines, magenta for conclusion boxes, green for confirmed structures, fluorescent yellow for brief emphasis, coral pink for exceptions.

Elements: hand‑drawn boxes, arrows, axes with slight jitter, SVG lines with rounded caps.

Interaction supports left/right arrow keys, space bar, and fullscreen mode. Each slide contains a hidden speaker note, and a script can export all slides as 1920×1080 PNG images.

Result Screenshots

Cover page (minimalist), coordinate page with a “kill‑line” annotation, architecture diagram of an H200 machine with four pre‑fill and four decode cards, a hand‑drawn data table, a command page showing platform differences, and a summary page that condenses ability, cost, locality, and transparency.

HTML cover page
HTML cover page
Coordinate page
Coordinate page
Architecture diagram
Architecture diagram
Data table
Data table
Command page
Command page
Summary page
Summary page

Packaging as a Skill

The entire workflow—including visual guidelines, both GPT Image and HTML prompts, a base template, Chinese handling for neat-annotations, the 19‑page example, and scripts for validation and PNG export—has been packaged as a Skill. It can be installed with:

npx -y skills@latest add tjxj/z-skills --skill z-wanghong-handwritten-ppt

For users who prefer not to run the command, the Skill is also uploaded to WorkBuddy and can be searched by “Wang Hong Hand‑Written PPT”.

Final Thoughts

The real challenge of Wang Hong’s PPT lies not in the paper, ink, or highlighter, but in the deliberate use of whitespace and the confidence to let the content speak. Replicating the style teaches both visual discipline and the importance of thoughtful problem framing.

Original Source

Signed-in readers can open the original source through BestHub's protected redirect.

Sign in to view source
Republication Notice

This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactadmin@besthub.devand we will review it promptly.

Prompt EngineeringAI image generationHTML CSShandwritten PPTneat-annotationsNotability
Old Zhang's AI Learning
Written by

Old Zhang's AI Learning

AI practitioner specializing in large-model evaluation and on-premise deployment, agents, AI programming, Vibe Coding, general AI, and broader tech trends, with daily original technical articles.

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.