JavaScript, HTML, CSS, NodeJS, UX
The Evaluability Gap: Designing for Scalable Human Review of AI Output In the age of AI, output velocity is no longer a limiting factor. AI can generate massive amounts of output in a fraction of the time it would take for a human. Code, designs, documents, analysis, and nearly anything else you can think of. However, as LLMs are integrated in more and more processes, we are left with a new…
Why AI-Assisted Development Is More Exhausting Than It Should Be The promise of AI-assisted development is that it should make developers' lives easier. In some ways it does. Yet I see many developers suffering from post-LLM burnout and exhaustion. In part, it is because of the unrealistic expectations of the organizations they work for, caught up in AI hype and FOMO. However, I am seeing another…
Trace: Declarative Modeling for the AI Age Spec first, then plan, then code. In the age of AI, most developers already understand the value of this when working with an AI agent. What changes when an LLM is generating the code is the weight placed on how the spec is written. It's no longer just communication between people who can ask each other questions, it's the primary input to a system that…
The Future of Self-Paced Online Education A lot of words have been dedicated to how LLMs are changing the landscape of software development. But there's another arena that has been massively impacted by the rise of AI and deserves more discussion: the self-paced online education industry. Thousands upon thousands of developers are self-taught, and that education, for many, included self-paced…
We're Losing Our Voice to LLMs Social media has become a reminder of something precious we are losing in the age of LLMs: unique voices . Over time, it has become obvious just how many posts are being generated by an LLM. The tell is the voice. Every post sounds like it was posted by the same social media manager. If you rely on an LLM to write all your posts, you are making a mistake. Your voice…
I've Started Offering Live Coaching. For over a decade students have asked me if I offer mentoring or live coaching. The answer has always been no. This year, in the age of LLMs, I made a decision: the answer is now yes. I was uncertain if there would be a response to the offer of live one-on-one and team coaching. I was shocked when people immediately grabbed slots. What's more, it's been a…
Not Agile. Not Waterfall. With AI It's Cascades. LLMs have changed software development . They can generate features in minutes that once took days, and large amounts of code that’s subtly wrong. In the age of AI, our software development methodologies need to change along with our tools, taking advantage of the positives of LLMs while guarding against the downsides. Waterfall was about writing…
It's Not Context Engineering, It's Context Authoring When working with LLMs we shouldn't call it "context engineering" , we should call it "context authoring" . Words matter, because they help us set proper mental models and expectations. When it comes to LLM context, engineering sets an incorrect mental model, while authoring puts you in the right frame of mind. The two concepts are distinct:…
Entropy Tolerance: The Essential Software Question for The AI Age " Entropy Tolerance " is the concept we should be using to talk about AI-assisted development, software requirements, and team processes in the age of LLMs and "vibe coding." I've been thinking a lot about how AI is changing the way we build software—not just writing code, but shaping whole workflows. So I've coined a phrase:…
Generative Rapid Prototyping (GRiP) Prototypes save time and money. You can test and present ideas, iterate, and provide specifications to developers. Traditional tools like Figma are great at this. But AI has brought about a new approach that I'm finding to have unique advantages. I think it's useful to name things, so I'm calling it Generative Rapid Prototyping (GRiP) (as in "get a grip" on what…
Understanding React Server Components React Server Components have lifted server-rendering to be a truly first-class citizen of the React ecosystem. They allow developers to render some components on the server, while attempting to abstract away the divide between the client and server. Devs can interleave Client and Server Components in their code as if all the code was running in one place. Yet,…
Normal UI: A Usability Technique For Non-Designers I've been building web apps for 25 years. B2B, SaaS, eCommerce, intranet apps, and more. I've also been a UX designer for much of that time. I've run and watched hundreds, if not thousands, of usability tests. That means I've been watching average users (non-developers) try to use web apps (without helping them) for over two decades. You begin to…
How to Rewrite a Web Application You're about to start rewriting a web application. If your first step is to choose your technology stack and start estimating features: STOP, you're doing it wrong. A screen-for-screen, feature-for-feature rewrite is a massive waste of opportunity and a huge waste of time and money. Let's talk about how to do it properly. The Big Lie The big lie of software…
Smart Jerks Aren't Worth It Myths proliferate in every culture. Some are harmless. Some are not. The myth of the "difficult genius" is perhaps one of the most harmful myths that still exist in software development today. Your software is hurt by toxic personalities on your team. Smart jerks aren't worth it. Let's dispel the myth. The Myth of the Difficult Genius The myth of the "difficult genius"…
Understanding React Compiler React's core architecture calls the functions you give it (i.e. your components) over and over. This fact both contributed to its popularity by simplifying its mental model, and created a point of possible performance issues. In general, if your functions do expensive things, then your app will be slow. Performance tuning, therefore, became a pain point for devs, as…
On The Why Down How To Do Better Than MVP How do we build software that solves real problems? How do both software development teams and the organizations that surround and utilize them come together to make good decisions? How do we acknowledge and work with the human factors built into all aspects of software development? How do we know what to build? The Myth of the MVP The "Minimum Viable…
A wall of wine at a winery in Niagara-on-the-Lake. The undersides of the bottles are curved, which gives the wall of wine a lovely reflective appearance. However the bottoms are curved, not for appearance sake, but to prevent the pressure from bursting the bottles while they sit in the rack. The best UX is both beautiful and serves a functional purpose. Analyze your design and remove the beauty…
How To Write Email People Will Read Email is a part of everyday life. We are inundated. So how do you write an email that clients and co-workers will read? Give them a good user experience. UX and Email People don't just read your email, they experience your email; the flow, the structure, the tone, etc. An email also sits inside of the chrome of the person's email client, webmail, browser chrome,…
The diesel fuel pump in one state is green, while in another is black. Quite confusing for the traveler. One may find oneself confused as to why the pump does not fit into your gas tank…however the prevention of error is extremely important in this case. Consistency and standards are good things. While making something obvious is the best approach to software design, respecting standards prevents…
This gas station pump asks for your zip code when you enter your credit card. Then you have to search around for where to enter it. The keypad is set off to the right and inset. It doesn’t appear to have any relationship to the screen where the message displays, causing a brief moment of confusion as you scan for an interface to obey the screen commands. Pay attention to gestalt principles.…
Boarding a Southwest Airlines plane is a study in frustration. There are always at least several people milling about in confusion, most trying to figure out their line-up process while handling bags and children. The competitive ‘get on the plane first and claim a seat before everyone else’ turns their confused state into potentials for agitation and aggression (getting ahead of others when you…
Mall kiosk with a Windows error. Graceful handling of errors is everyone’s job. A poorly handled error can pull the user down into the lower layers of abstraction, destroying the user experience. Handle errors gracefully, either hiding them, or displaying them as an integrated part of the user experience. Special integrated error pages or messages go a long way to put the user at ease when an…
Simple Is Not the Opposite of Complex My college life was all about education. Mathematics, arts, and sciences were thrown at high speed for high credits. Yet some of the longest lasting lessons didn't come from the classroom - at least not the ones I was paying for. One lesson in particular informed the way I would look at software development and user experience for the rest of my life. It came…
Simple garage door opener. It does one thing well. There is a single button, and an indicator providing feedback. However it is also extremely easy to click the extruded button. Time and again I find myself accidentally opening or closing the garage (sometimes with myself in it). So much so that I periodically check that the garage door is closed. Ease of use is incredibly important in software.…
Heating and Cooling controller in an older model Kia. There are 12 positions. Seven are labelled. Five are not. What in the world is the position between ‘defrost’ and 'feet and defrost’? I have no idea. In fact, I still have no idea. Perhaps the designer ran out of room for icons, but the middle states simply aren’t guessable unless you designed the system. One of the most common mistakes in UX…
Key and Lock In his seminal work The Design of Everyday Things (revised in 2013), Don Norman notes that with every new technology designers repeat the same mistakes of the past. User experience designers should not fall into this trap, because a fundamental key to good UX design is humility. It takes humility to change a design based on user testing; and it takes humility to look back at…
The key and lock is one of the oldest and best examples of a good interface. It’s guessable (there’s only one keyhole in the average door), secure (you have to know and have the right key, but it isn’t hard to use), consistent (know how to use one key, you know how to use almost all), and provides good feedback (key turns or it doesn’t). Above the all the key/lock interface is good abstraction.…
Drink machine at a local Five Guys. I watched as every single person made some form of mistake during use. There is a touch screen selection UI, and a ‘Push’ button below it. However the button always says 'Push’, so most push it not realizing they’ve made a mistake in the selection process and something unexpected pours out. The beauty of old-school drink machines is that they’re hard to get…
A Behringer 802 Mixer. Mixer boards are powerful and useful, but they must be learned. A mixer board is the opposite of a lightswitch, there is nothing obvious or intuitive about it. There are so many options the user’s best guess is likely wrong (though labeling helps), and the designer must rely on memorization and education on the user’s part to use the device well. There is nothing wrong with…
Walmart. Primary sections, sub sections, and sale areas are clearly marked – yet you still have to stumble around to figure out where you are in relation to everything else. If you were suddenly transported to a spot like this in the middle of a Walmart, would you know how to get to Electronics? If you watch people’s user experience at a Walmart, there’s a lot of neck craning, searching for signs…
DOTW: Do One Thing Well The Mantra of the Guessable Interface In the land of coding there is a principle that defines the essence of modern multi-tier software architectures. DRY : Don't Repeat Yourself. DRY has become so widely accepted in software design because the benefits are obvious and immediate. Less code to write, less bugs to fix. It makes for less confusing software from the…
A mechanical pencil follows DOTW (Do One Thing Well). There is only one way to get lead out, and only one option to try. However it breaks down when the lead runs out. How many times have you shaken a pencil to see if lead is still in it? Better: If, once the lead ran out, a bright red warning piece of plastic came out of the tip clearly indicating the error state. A simple interface that ‘Does…
Back of a Black & Decker Air Station. Can be powered from a standard plug (AC) or a car lighter (DC), and you choose which. The design doesn’t assume you know which is AC and which is DC. Actually, it gives various opportunities to figure out which is which, and when all else fails provides the icon of a car to make it absolutely clear. It’s ensuring understanding and educating at the same time.…
A flashlight is designed to be used in the dark. The simple act of picking it up puts your fingers in the position needed to be able to turn it on. You can turn on a flashlight without having to see. Actions should be in the most natural positions for their usage. A large form with a save button icon somewhere off in a corner, or an important screen hidden under a four level navigation menu keep…
The doorknob with lock. People on the outside cannot open the door, however turning the doorknob from the inside automatically unlocks it. Security is important, but that isn’t excuse for software to be laborious. Afford people the ability to both provide their credentials and their intentions. For example, if they go to a secure area of the software and are forced to log in, after they log in you…
An on/off switch on a desk lamp. A single interface controls both on and off. Since it is the only option, it is obvious by process of elimination. There is also strong and immediate user feedback. “Light off! Light on!” is hard to miss. Elements of an interface should only perform one function. You can consider a toggle as only “one” function: ‘Off’ is only available when 'On’ and vice versa.…
Portable charger for a car battery. Cords are made to wrap around the charger and lock in place. This looks very nice, but the cords are far too short and makes it extremely cumbersome to connect. This only worsens the frustration you are almost always already experiencing whenever you use this device. Aesthetics are important, but they are not worth sacrificing ease of use. The best designs are…
Panel on a Keurig coffee brewer. Turn it on, main screen says ‘Ready to Brew’, and you choose one of 3 cup sizes. There are no labels, but the clarity of icons and reduction of options makes it self-evident. Normally labels are needed on icons. However (if the icons are extremely clear, agree with the context, and the interface’s goal is self-evident and highly focused) labels aren’t always…
Back of a vacuum cleaner. How do you turn it on? Once you turn it on, how do you tilt it back? Primary functions should be obvious. Secondary or related functions should be easily accessed alongside the primary action.
Struck by the brilliance of a tissue box. Not so much that you can get a tissue out, but that the next one is left waiting for you. Most software is a series of tasks. Make the next logical tasks readily available upon completing the current one.
My toaster oven. Top dial when in the ‘off’ position means oven is off, but toaster is on. The bottom two individually control toast versus oven. Many a time I have left the toaster thinking it was toasting, when it was in oven position, or vice versa. The toaster ticks, but I return to find no heat, no ready food. In software each interface should DOTW: “Do One Thing Well”. The more functions any…
Dyson bathroom hand dryer. Good: Where do you put your hands? Bad: Hand spaces are too small. You inevitably touch the sides which ruins the whole point. Make it easy. But software has to actually do what it says it will do, otherwise all the other good UX doesn’t matter.
Airplane tray table. How do you open it? Give your user’s best guess the highest probability of being right.
Single light switch on blank wall. A self-evident interface doesn’t need documentation. Scannable, limited options teach without words.
Good Interface, Bad Interface I have been doing a great deal of traveling as of late. Travel is frustrating. Airports, hotels, car rides and more are filled with other people's design choices. Some are good, some are bad, and they all carry lessons in user experience. Airport bathrooms, for example, turn out to be pretty diverse in their design choices - and their influence on the traveler's…