paul shenprojects
natto.dev
a spatial live JavaScript environment
Potluck
an Ink & Switch project on malleable software
React memory leak
debugging and fixing memory leaks
draw battle!
a casual but competitive team drawing and guessing game
Code Explorer
exploring better interfaces to read and understand code
TypeScript AST Explorer
CSS Structure Editor
Rust GUI Experiments
manipulative
devtool for writing React + Emotion styles in the browser
Nook Exchange
an Animal Crossing inventory site built with ReasonML
Code Explorer
-> code explorer 01 -> code explorer 02 -> code explorer 03 -> code explorer 04
Key Ideas
  • spatial organization
    • How can we better use space to read code?
    • What are the pros/cons to a canvas approach?
  • abstract away filesystem
    • The given file and directory layout is one of many ways to organize a codebase. For example, you may care more about the call hierarchy of a function more so than what comes before/after in the same file.
    • We can leverage semantics to provide smarter views. Instead of showing a whole file, we can show just the function or block you care about.
  • path-aware browsing
    • Reading code is an exploratory process. Looking at one function leads to questions about another.