Coding on Principle: Toolmaking Is the Most Effective Way of Learning | by Bairui Su | Jun, 2026 | MediumSitemapOpen in appSign up<br>Sign in
Medium Logo
Get app<br>Write
Search
Sign up<br>Sign in
Who am I<br>What’s the problem?<br>Introducing Recho<br>The Process<br>What happened in 2026?<br>My Coding Principle<br>Acknowledgment
Coding on Principle: Toolmaking Is the Most Effective Way of Learning
Bairui Su
8 min read·<br>Jun 29, 2026
Listen
Share
This is the script for my ITP 2026 thesis presentation.<br>I begin with Recho, my thesis project that was accepted as a poster at CHI 2026, and end with a question I’ve been thinking about lately: Why do we still need to code in the age of AI?<br>The presentation is about 10 minutes long. Feel free to watch the recording here!
Press enter or click to view image in full size
Who am I<br>Hello everyone. I’m Bairui Su. It’s so great to see all of you here! Today, I’m going to talk about Coding on Principle. Sounds a little abstract? Don’t worry, let’s get started with a simple question:<br>Who am I?
Well, I’m the…<br>early thesis finisher.
For this year, the most common feedback I received was: “Oh, you’ve already done everything. Did you play video games today?” yes I did. But did I finish my thesis, I’m not entirely sure. To explain why, let’s go back a little bit.<br>What’s the problem?<br>I’m a toolmaker, who has always been interested in making coding more accessible and hopefully, more playful. These interests led me to where I am now — pursuing a master’s degree at NYU ITP.<br>Before coming to NYU, I spent 3 years building tools for information visualization. The highlight of this journey was leading the development of AntV G2 5.0, a free, open-source JavaScript library for interactive data visualization.<br>Press enter or click to view image in full size
Through those experiences, I gradually realized one thing:<br>Well designed library doesn’t necessarily make coding more accessible, the environment does.
A good example is p5.js. While p5.js is popular for its beginner-friendly APIs, it’s the p5.js web editor that truly makes p5.js more accessible. This makes me wonder: can we have a similar environment that keeps the accessibility and playfulness of the p5.js web editor, but focuses more on the computational processes?<br>Press enter or click to view image in full size
or perhaps realizing my collaborator Luyu Cheng’s vision?<br>We want to live in editor forever.
Introducing Recho<br>To explore these questions, we’re building Recho: A reactive programming interface for learning algorithms and ASCII art.<br>Press enter or click to view image in full size
Recho’s core is built on a statement by Bret Victor:<br>Programming is blindly manipulating symbols.
By “blindly”, he means we can’t easily see the results of our manipulations. This is why programming is so difficult.<br>For example, this is a piece of code. It’s not easy to tell what this program does at a glance, because we don’t know what each line is doing exactly.
Press enter or click to view image in full size
With Recho, the situation is different. You can see results directly in the editor. The program becomes less “mysterious” as you observe how it works. Clean, split, filter and count. You quickly realize this is a word-counting program.
Press enter or click to view image in full size
Word Counting Example in Recho
As you may have noticed, Recho provides a built-in function called echo . This is the most important part of Recho: it evaluates expressions and displays the output directly in the code editor as comments.
Press enter or click to view image in full size
Here is a simple example showing how Echo works.
Press enter or click to view image in full size
echo in Recho
With the help of Echo, not only does programming becomes less invisible, it also allows you to do something creative:<br>Like a running animation:
Press enter or click to view image in full size
Author Animation in Recho
A fire with Chinese characters:
Press enter or click to view image in full size
火炎焱燚 (Fire!)
A moon dial:
Press enter or click to view image in full size
Moondial: Moon Sundial
A maze solving visualizing:
Press enter or click to view image in full size
Maze
ASCII hands with ml5:
Press enter or click to view image in full size
Inputs for rotating a sphere:
Press enter or click to view image in full size
Number Input in Recho
Of course, sorting algorithms visualization!<br>Press enter or click to view image in full size
If you are hungry, Recho provides a donut for you.
Press enter or click to view image in full size
Donut in Recho, Ported from Alex Nak
Not enough? The code for the donut is also a donut.
Press enter or click to view image in full size
This is Recho. Recho is not trying to replace existing programming interfaces like Jupyter notebooks or the console. It just wants to introduce:<br>A lighter way to code with creativity.
By “lighter,” we mean you can start with a simple idea, write simple code, and get simple results. By...