Field guide/

What is a breakpoint? The only red dot on your screen that takes orders

Reality ships with a UX you did not write. Your code is the one screen where you set the controls.

A stylised drawing of a code editor with grey bars standing in for lines of code and a red dot in the left margin beside the sixth line.
Line six has been asked to wait its turn.

Count the red dots you obeyed today. A traffic light held you at a line painted on the road. A red lamp outside a studio door told you not to walk in. Your phone showed you a small red circle with a number in it, and you tapped the app to make the number go away. All of them wanted something. Then you opened your editor and clicked in the margin. You set a breakpoint. For the first time all day, the red dot was working for you.

As a programmer, you get to turn the tide on reality's UX. You get to be the one giving the order. In Visual Studio Code, a filled red circle in the margin means an enabled breakpoint. You click the margin to put it there, or you press F9, and the program will stop just before that line runs. That is the whole interface. One click, one dot, and a running program stops where you told it to stop.

Compare that with the rest of the red dots in your life. A steady red traffic light is not a suggestion. The Vienna Convention on Road Signs and Signals is the international agreement from 1968 that determines what road signs mean. Under it, traffic must not pass the stop line. The dot wins. You wait.

A British traffic light on a grey pole, mounted on a black backboard with a white border, shows only its red lamp lit against a cloudy sky, with a street lamp and a small yellow road sign low in the frame.
No click, no F9, no margin to put it in. You just wait. Photograph by Gary, 2017. CC BY-SA 2.0, Geograph.

The red light on a video camera is called a "tally light". When it's filming it is typically red, and it exists to tell the room the camera is live. It says "I'm watching you". The same kind of red lamp sits outside a studio door, where its entire job is to stop you opening it. Nobody has ever negotiated with a tally light.

A white surveillance camera on a bracket under the wooden eaves of a building, with a small red light glowing on its front.
One of you is being watched, and it isn't the camera. Illustration: Binary & Thread.

The red little badges on iPhone or Android apps are the pushiest of the lot. All it is is a number that shows you how many things you have not seen. It nags at you. You can switch them off, sure. Almost nobody does. You'd rather be annoyed than in unknowing bliss.

A breakpoint pauses a running program at the line you marked, so you can see what it is about to do. That includes the values of its variables at that moment. The program is the one standing still while you read it. So, the debugger pauses before the line runs. Not after. Thus, the dot does not catch the program having done something. It lets you stop the program before something wonky happens. Everything else on the machine runs at the machine's speed. A breakpoint is the one place where the code waits at yours.

The vocabulary kinda gives it away. The other dots are named for what they are: a traffic light, a tally light, a badge. The breakpoint is named for what it does to something else. Break is a verb. It is named for the act, not the appearance.

So why make a design of the breakpoint? It looks good on a sweatshirt. But mainly it makes you notice the UX of your own life. Every other red dot you met today was pointed at you: stop, watch, nag. The one you set yourself points the other way. You are in control. The machine is not.

The design from this story

We made a sweatshirt out of the one dot on your screen that you put there yourself, and called it "Breakpoint". Set it wherever you like.

Where this comes from

What is a breakpoint? The only red dot on your screen that takes orders | Binary & Thread