The Pegboard Model for AI Prompting
A visual mental model for understanding how context and prompts influence AI agent outputs, using the humble pegboard as an analogy.
Articles
Migrating Away from VitePress Default Theme
A practical guide to replacing VitePress's default theme with custom components for better design control and smaller bundles.
Using Bundle Analyzers to Find Performance Issues
A quick guide to identifying heavy dependencies and optimizing page load times with bundle visualization tools.
Knife Through Mountains: A Procedural Shape Technique
Generating organic blob shapes by slicing through procedural terrain - a simple but effective approach to creating natural-looking silhouettes.
Procedural Ink Splotches with SVG
A deep dive into generating organic ink splotch shapes using procedural algorithms, Hermite interpolation, and SVG paths.
Cubic Bezier and Easing Functions in CSS
Understanding the mathematics behind CSS timing functions and how to create custom easing curves.
Maintainability Means Deletability
UX Designers can adopt the science-fiction writers’ technique of world-building to create unconventional interfaces.
The hidden benefits of living in Dongle World
Tackling the challenge of an intuitive form editor, complex permissions system, all in a responsive and friendly interface.
UX Design is Like Writing Science Fiction
UX Designers can adopt the science-fiction writers’ technique of world-building to create unconventional interfaces.
Vizualizing Your Changing Mood
Case study detailing the progression of a mood tracker data visualization as part of a redesign for myStrength.
Feedback App UX
Tackling the challenge of an intuitive form editor, complex permissions system, all in a responsive and friendly interface.
Ridgeline
This is a quick introduction to the local development system I've been working on. My goal is to create a build system that is flexible enough to fit into any client's technology stack, and can easily pushed to a development server on its own.
Sass with Bourbon on Node
Reader beware! This is basically a run through of some headache inducing bugs I ran into when trying to get the CSS preprocessor into my NodeJS build system. Since first publishing this, all the packages involved have been updated, and there seems to be a little more coherence between them.
My Frontend Toolbox
Just a few lists of some of the tools and services I use in my work. Some design stuff, some development stuff, all golden.
Information-dense Signup Process
An example of a signup process that requires the user input lots of information.