Graphics editor without toolbar

On breaking a 50-year-old UX tradition and a surprising effect

daniel@squaresight.io July 2026

Beginnings of human–computer interaction

Early computers were seen as pure calculating machines, filled entire rooms, and direct interaction with the user was not possible. Instead, it was often the case that input had to be carefully planned and punched onto cards. A technician collected cards from multiple users and fed them into the computer's reader in batches. After a waiting period, which could last hours or sometimes even days, the output was produced in printed form.

Sketchpad, in the early 1960s, was downright revolutionary. It enabled direct, real-time interaction with graphical objects on the screen, allowing vector drawings to be created iteratively.

Sketchpad was operated with both hands. With the light pen in one hand, a position on the screen could be marked. With the other hand, command keys could be pressed.

Although the command keyboard appears in front of the screen on the table in many photos of Sketchpad, in a video from the Computer History Museum [1] it is arranged to the left of the screen. This resembles later toolbars. However, the keys in Sketchpad were only used for commands, and the operating concept did not include switching between tools.

Augmentation Research Center

Sketchpad showed that a computer can be far more than a calculating machine. Also in the early 1960s, and independently of Sketchpad, Doug Engelbart founded the Augmentation Research Center to find new ways for computers to support people and expand their capacity for thought.

In 1968, Doug Engelbart presented NLS (oN-Line System) as the result of this work. NLS enabled the editing of structured documents made up of text and graphics.

As with Sketchpad, both hands were used to operate NLS, with the light pen replaced by a three-button mouse. In addition to the regular keyboard, there was a second keyboard with five keys for the other hand, also known as a chord keyset.

Xerox PARC

As impressive as NLS's capabilities were, the learning effort required to use it was just as steep. However, Doug Engelbart considered this necessary in order to unlock its full potential. There were also researchers, though, who saw ease of use as the foundation for the future success of personal computers.

Starting in the early 1970s, Xerox PARC (Palo Alto Research Center) offered researchers a lab for this purpose, where they could develop new interaction concepts. Some employees of the Augmentation Research Center subsequently moved to PARC.

Starting in 1973, the Xerox Alto, an in-house computer, was available. Similar to Engelbart's NLS, it relied on a three-button mouse and a chord keyset alongside a regular keyboard for input. The Xerox Star followed in 1981 as another computer, where the trend toward simplification was also visible in the input devices: the mouse now had only two buttons, and the chord keyset was dropped.

Several graphics editors were developed at PARC. In SuperPaint, users could switch from the drawing canvas to a full-screen tool palette [3]. In Markup, a palette could instead be displayed at the mouse pointer [4a]. Shortly after Markup, Draw emerged starting around 1975 [5], featuring a toolbar next to the drawing canvas. However, the video from the Computer History Museum [4b] shows a later version from 1980, so it is unclear whether the toolbar was included from the very beginning.

Smalltalk-76's BitRect toolbar can be dated somewhat more precisely. Smalltalk was one of the most important projects at PARC and is an object-oriented, interactive programming environment. BitRect is an interactive object within it.

“This was something a drawing program that anticipated MacPaint by quite a few years. I guess this was done right about 1976. … Here we have a menu of tools that you can use.”

In addition to graphics editors, text editors were also developed at PARC. Particularly notable is Gypsy from 1975. It was the first to use a modeless interface, in which Larry Tesler played a major role. He saw the reduction of modes as an important criterion for ease of use and strongly advocated for software to become modeless.

Fun fact: Larry Tesler was considered one of the strongest advocates of modeless interfaces. He had a license plate made for his car reading NOMODES and used the web address www.nomodes.com.

Apple

Some Apple employees received a tour of Xerox PARC in 1979 and were impressed by the possibilities of graphical user interfaces. With Xerox's permission, they were able to draw inspiration from what they saw and further developed many of the ideas.

But it wasn't just ideas that made their way to Apple. Just as researchers had once moved from the Augmentation Research Center to PARC, some now moved from PARC to Apple to work on the Lisa and Macintosh projects. Among them was Larry Tesler, who joined in 1980 and, in a leading position, advocated for a modeless design across all applications.

“The Lisa software engineers internalized modeless editing principles and found clever ways to make their applications modeless. My job was to manage them and make evidence-based decisions about the design of the interface.”

A modeless interaction concept that had already been successfully implemented for a text editor at Xerox PARC was now to be introduced for a graphics editor as well. The same approach as with the text editor was followed: the user first makes a selection and then executes a command.

“The Lisa editor was modeless in that you would stretch out a rectangle of marching ants [animated dashed selection outline], and then say ‘Put an oval in it’ …. You'd get no feedback that you were making an oval. And when you thought about making a curved line, that became ridiculous, stretching out a rectangle that was going like this and now saying ‘put a curved line in it,’ that was a joke.”

Bill Atkinson was on Larry Tesler's team and shared his passion for simple interaction concepts. He recognized that this approach for a modeless graphics editor was too cumbersome and that there should be a drawing tool. Although he, too, preferred a modeless concept, he saw holding a pen or an eraser in hand as a natural mode and proposed a deliberate exception for it.

“I was arguing that we needed to be in a mode for the creation stroke, like you grab a crayon and you draw with it and every stroke you make a crayon mark. You pick it up. Instead, a marker and every stroke is a marker or an eraser and these are really modes. You're in eraser mode.”

Unlike at Xerox PARC, where researchers could develop solutions without time pressure, Apple faced the imminent market launch of the Lisa and Macintosh computers. To make the most of the limited time, Bill Atkinson often built software at night, which was then tested by others during the day. He proposed a toolbar to solve the problem with the drawing app, and created a test program for it.

“So, I had to make a little mock up. I realized, okay, if there's going to be a mode for the tool that you're in, that mode has to be in front of your face and visible, so that at least it isn't a hidden mode. If you select a tool from a menu, it's not really in front of you like a palette, and that was the origin of a tool palette; I wanted to put it out there on the screen. You can see at any moment at a glance, what tool am I in? Is this stroke going to erase some stuff or going to draw with marker or et cetera?”

For the tests, users with no computer experience were deliberately included as well, in order to assess how self-explanatory an interface was. Bill Atkinson's toolbar was successful in these tests, and he was able to win over his team with it. As a result, all three graphics editors under development at Apple at the time included a toolbar: LisaDraw, MacDraw, and MacPaint. The Lisa computer launched with LisaDraw in 1983, and the Macintosh followed a year later with MacDraw and MacPaint.

The trend toward simplification was also visible in the Lisa and Macintosh mouse, which had only one button. This was later jokingly described by a co-inventor of the three-button mouse and colleague of Doug Engelbart as one of the greatest mistakes in product history [10]. It wasn't until 2005 that Apple reintroduced the option for a second button with the Mighty Mouse, followed by touch gestures with the Magic Mouse in 2009. Multi-touch gestures, such as those on MacBook trackpads, are no longer self-explanatory, but they enable more effective use, very much in keeping with Doug Engelbart's philosophy.

Other companies, such as Adobe, also adopted a toolbar after MacPaint, with the number of tools continuing to increase over time. In Photoshop 1.0, released in 1990, all the tools still fit in the toolbar. Later, there was no longer enough space, and the toolbar gained menus. Even Larry Tesler seems to have made peace with the toolbar:

“As for graphics editors, I agree with the common wisdom that modes can be good when they support a metaphor like picking up a brush, and when feedback identifying the current mode is displayed where the user is almost certain to be looking.”

It can certainly be assumed, however, that Larry Tesler would have greatly appreciated a modeless graphics editor. But what could a new approach to this look like? Or is this simply not solvable in any meaningful way?

Square Sketch

Square Sketch has been actively developed by me since 2023 and represents a new attempt at a modeless graphics editor. Before active development began, I had already built prototypes for it to test various ideas. Version 2.0.0 was released for macOS and Windows in June 2026.

The drawing app is modeled on pen and paper, with the difference that, instead of freehand strokes and handwriting, it is designed for precise geometric shapes and typed text. Like a sheet of paper, the window is meant to show only the drawing area and therefore have no toolbar.

In the following sections, I describe how I replaced the toolbar with a modeless interaction concept in three steps.

Reduction of tools

The first step toward leaving out the toolbar is reducing the number of tools. With pen and paper, one tool is enough, namely the pen in hand, to draw geometric shapes and write text. Square Sketch follows the same principle, merging several classic tools from other graphics editors into a single draw tool.

It could be argued that, even with pen and paper, a ruler and compass are additionally needed for precise geometric shapes, and that classic graphics editors replicate this. However, software offers more possibilities, and it can detect from the path of the draw tool (the gesture) whether, for example, a line or a circle is being drawn.

The gestures should be as simple and intuitive as possible, based on the following ideas:

• Text: Click to place the cursor, like in a text editor.
• Line: Drag, like with the line tool in other graphics editors.
• Rectangle: Drag in one direction first, then continue dragging at a right angle.
• Circle: Drag from the center point first, then circle around the center point, like with a compass.
• Point: A long press creates a point, like with a fountain pen on paper.

Testing revealed that the rectangle gesture was frequently misrecognized. It was difficult for the app to distinguish whether, while drawing a line, only the angle of the line was being changed or a rectangle was being drawn. By removing the rectangle gesture, the app worked better, and a rectangle is now composed of four individual lines, just as it would be with pen and paper. As a result, a rectangle no longer has any special status but is drawn like a triangle or other polygon. If a rectangle is needed often, it can be duplicated using copy and paste.

Fun fact: Even Sketchpad, from the 1960s, had no direct way to draw rectangles. Maybe because the rectangle tool hadn't been invented yet. But maybe it was simply too obvious that a rectangle is built from four lines.

Nowadays, gestures are mainly used on trackpads, smartphones, and tablets to zoom or rotate content on the screen using two fingers. They are simple and intuitive, but the interface doesn't show which gestures are supported. Square Sketch addresses this by displaying a tutorial on first launch. It can also be reopened later via the Help menu.

Additional tools via modifier keys

After reducing the tools, the second step is assigning further basic tools to the modifier keys. On a Mac, four keys are available (Shift, Command, Option, and Control), and on a PC there are three (Shift, Ctrl, and Alt). This means there are at least three keys that are themselves modeless and therefore, for example, do not insert characters when the cursor is in a text field.

The following ideas are behind this assignment:

• Move: The name Shift itself suggests movement. It can also be understood as lifting, to enable a move.
• Select: Some keyboard shortcuts, such as for cut and copy, relate to a selection and use Command/Ctrl. This way, the modifier key can be used not only for the selection itself, but also for the subsequent command. In addition, some apps use Command/Ctrl together with a click to select multiple objects individually.
• Delete: The next available modifier key on the Mac, or the last one on the PC, is used, without any particular meaning behind it.

The draw tool is active by default, so you can start drawing right away, just like with pen and paper. The other tools are only active for as long as their modifier key is held down. This behavior was chosen because otherwise the tool would once again become a classic mode. Users who are familiar with keyboard shortcuts are used to holding down modifier keys.

This means both hands are required for operation, similar to pen and paper, where one hand holds the pen and the other holds the paper in place. In Square Sketch, the hand that would otherwise hold the paper in place can instead rest on the modifier keys. This enables quick tool switching and an effect that I'll describe in its own section later on.

The assignment of the modifier keys is shown in the bottom left corner of the drawing area, but it can be hidden via the settings.

Additional shapes through combination

After reducing the tools and assigning the modifier keys, the third step is combining the available options to create additional shapes. Just as a rectangle is a combination of four lines, other shapes can also be formed through combination. The idea is that this allows not only geometric shapes, but also tools and keys, to be combined.

This allows the following shapes to be created:

• Curve and ellipse: Clicking on a stroke with the move tool makes its control points visible. Moving the control points can form a line into a curve and a circle into an ellipse.
• Arc: If points are drawn on a stroke, it is divided into segments. Segments can then be removed with the delete tool.
• Arrow: After drawing or selecting a stroke, an arrowhead can be added by pressing the V key.
• Fill: After drawing or selecting an outline, a fill can be added by pressing the F key.

Surprising effect

With pen and paper, the pen can disappear from conscious awareness after a short time while drawing or writing, so that the focus rests entirely on the content of the page. Only when the pen stops working properly and needs to be replaced does it come back into conscious awareness as a tool, distracting from the actual activity at hand. Switching pens, or switching to an eraser, requires hand-eye coordination that happens consciously. The same is required when pointing and clicking to switch tools in a drawing app via the toolbar.

If a pencil has a built-in eraser, no hand-eye coordination is needed to switch to the eraser. Turning the pencil is a purely motor action, which can occur unconsciously after a learning phase. Interestingly, the same effect occurs in Square Sketch when a hand rests on the modifier keys and switching to the move, select, and delete tool happens motorically.

It was to be expected that removing the toolbar would make the interface less visible, and that minimizing tool switching would push it further into the background. However, I was surprised that, after a learning phase, the remaining tool switching can become purely motoric, and therefore automatic. Then the interface disappears entirely from conscious awareness, which could also be described as a transparent interface.

Synergy

Two sections earlier, I described how new geometric shapes can be formed by combining existing options. Square Sketch's interface is also a combination of different ideas.

Even in MacPaint, developed by Bill Atkinson and modal due to its toolbar, there were influences from Larry Tesler, and with them the goal of making the rest of the app, apart from the toolbar, modeless. There were also influences from Doug Engelbart:

“I got to visit with Doug Engelbart …, and what he said to me …, ‘You're all focusing on you on um user friendly, and you know, walk up to it and intuitive. It just works like you would think it would, and you don't have to read a manual or anything.’ And he says … that that may end up limiting the depth that you can go, the power that you can get in for the experienced user, and he gave an example. He said, ‘Look how hard it is to learn to ride a bicycle but look at the power that it gives you. It's worth learning’ … I think it was within a week we had command keys on the menus.”

Square Sketch's draw tool still follows Bill Atkinson's approach: you grab a crayon and you draw with it and every stroke you make a crayon mark [9]. However, Larry Tesler's influence is greater than in MacPaint, so that the goal is a fully modeless interface. Doug Engelbart's influence is also greater, so that keys are used not only for menu commands but also for switching tools. The operation happens two-handed as with NLS, and the resting of one hand on the modifier keys is reminiscent of Doug Engelbart's chord keyset. The gestures require a brief explanation via the tutorial. According to Doug Engelbart, a learning phase is worthwhile if it enables more effective use.

Bill Atkinson, Larry Tesler, and Doug Engelbart had, in some ways, different approaches: toolbar (Atkinson) vs. modeless interface (Tesler), easy to use and self-explanatory (Atkinson, Tesler) vs. effective (Engelbart), few keys and one-handed (Atkinson, Tesler) vs. many keys and two-handed (Engelbart). But out of the combination of these ideas, something as wonderful as the transparent interface I described in the previous section was able to emerge.

Summary

Initially, computers were mainly reserved for researchers. Operating them was complex and required a significant learning effort. With the introduction of personal computers, greater emphasis was placed on ease of use, so that they could also be used by office workers with little learning effort.

The first toolbar appeared in the mid-1970s in a drawing app at Xerox PARC and has shaped the appearance of graphics editors to this day. At the same time and place, the first modeless interface emerged in a writing app, which today is standard not only in text editors but also in most other apps. In graphics editors, the toolbar, with its switching between tools, prevents modeless operation, since each tool also constitutes a mode.

In the early 1980s, Apple made an attempt to implement a modeless interface in a drawing app as well. However, this early approach was unable to prevail against a toolbar. The toolbar was not only easy to use, but also self-explanatory. The developers' goal was that only minimal or no learning effort would be required, in order to also appeal to users with no computer experience.

Later, features such as multi-touch gestures were added, which are no longer self-explanatory but enable more effective use. The countless keyboard shortcuts that apps now have also require a learning phase in order to benefit from them.

Square Sketch is a new attempt to implement a modeless interface in a drawing app and thereby do without a toolbar. To achieve this, it uses gestures and modifier keys. As a result, it is no longer self-explanatory, but still easy to use. After a learning phase, a remarkable effect can also occur: The interface not only recedes into the background, but disappears from conscious awareness altogether. The focus then rests entirely on the activity, such as sketching an idea, and the app's interface does not distract from this task.

Inspiration

The story of Square Sketch dates back to 2005, when the media reported on the death of Jef Raskin and called him the father of the Macintosh. This sparked my interest in his work, and I came across his book The Humane Interface, in which he wrote at length about the advantages of modeless design.

I was looking for an exciting programming project at the time, and Jef Raskin's book inspired me to develop a modeless interface for a drawing app. Over the following years, I built several prototypes in my free time. I also read more about interface design and its history, and became aware of the work of Doug Engelbart, Larry Tesler, and Bill Atkinson, who inspired me as well.

While I was developing the drawing app, Doug Engelbart died in 2013, Larry Tesler in 2020, and Bill Atkinson in 2025. Their ideas are the foundation for new ideas, which in turn become the foundation for further new ideas. Ideas remain woven into this endless chain, and are thus immortal.

Sources

[1] Computer History Museum (2024): Sketchpad (YouTube)

[2] Doug Engelbart Institute (2022): 1968 "Mother of All Demos" with Doug Engelbart & Team (2/3) re-mastered (YouTube)

[3] Computer History Museum (2023): SuperPaint H264 SD sq 4x3 AAC mono 2pass (YouTube)

[4] Computer History Museum (2017): Yesterday's Computer of Tomorrow: The Xerox Alto │Draw and Markup Demos (YouTube)

• [4a] Markup 11:28 (YouTube)

• [4b] Draw 5:22 (YouTube)

[5] Brad A. Myers (1996): A Brief History of Human Computer Interaction Technology (Carnegie Mellon University)

[6] Computer History Museum (2018): Alto System Project: Dan Ingalls demonstrates Smalltalk (YouTube)

• [6a] BitRect 1:25:30 (YouTube)

[7] Tesler, Larry (2012): A personal history of modeless text editing and cut/copy-paste (ACM Interactions)

[8] Computer History Museum (2004): Oral History of Andy Hertzfeld and Bill Atkinson (Computer History Museum)

[9] Computer History Museum (2010): MacPaint Interview and Demonstration, with Bill Atkinson and Andy Herzfeld (YouTube)

[10] Computer History Museum (2013): White Rabbit: Interview with Doug Engelbart and Bill English, Moderated by John Markoff (YouTube)

Notes

The first images up to MacPaint are black/white screenshots from the linked YouTube videos. The last images from Reduction of tools onward I created directly in Square Sketch. For the English version, I translated each paragraph of the original German text individually with AI assistance, reviewed the result, and adjusted it where needed.