This section shows some of the system and process diagrams I’ve made to document concepts and workflow. I find them useful to contemplate when I’m getting stuck somewhere by having EVERYTHING on a single page. Sometimes that page has to be printed VERY LARGE, but it’s the thought that counts!
These diagrams are representative of the way I name and relate concepts with structured care. It’s time-consuming work, but the resulting clarity makes execution much easier.
Business as a Spaceship Diagram
This is my freelance business reimagined as a spaceship that runs on human interaction as its primary fuel source. It’s a fanciful piece of work grounded in my own reality, after a very lengthy research period.
Details: Appendix: Ship Diagram Process
Activity Bingo Board
In 2025 I distilled my most outwardly-useful projects into this tight reference poster. If I was lost and wanted to remember what to focus on, this board provided a host of options.
It also takes into account the ADHD need for novelty and stimulation as necessary overhead, not distraction. That’s just the way my brain works.
Details: A Bingo Board for Task Focusing
Agenceum System Processes
Some years ago I was tired of working by myself, so I made an imaginary agency and blogged about what “we” were all doing.
This diagram was created to highlight all of the agency’s critical operating processes and outcomes, so “staff” could be “assigned” to handle specific ones. It’s based on my own experience working in small digital agencies.
Working Revenue and Operations Diagram
This is precursor to the Activity Bingo Board above, outlining the processes that I deemed most important at the time.
Unfortunately I can’t find the original article that went with this.
Visual Hierarchy Primer
I am sometimes asked how I design information graphics, so I made this quick diagram that captured some of the essentials. It draws from Herbert Zettl’s Sound Sound Motion: Applied Media Aesthetics textbook among others that influenced me.
Details: Visual Hierarch Basics
System Module Hierarchy for GEM-STEP
GEM-STEP is a complicated webapp that connects multiple classroom tablets to a realtime user-scriptable simulation engine. To communicate how its many subsystems connected together, I created this reference (one of many) to help team members remember where stuff was.
Details: Sim Modules DR04 on Whimsical
User Interface State for GEM-STEP
When working on GEM-STEP, handling user interaction in a complicated web app is very difficult to visualize. This diagram is a reference for this codebase.
Details: Data Round Trip Architecture
