The Body of the Screen

Patrick Stowe Jones
8 min readFeb 23, 2018

--

Interaction, user experience, and interface designers love showing screens in axonometric projection (in “perspective”). But why?

Screens of an app, the way one finds them in nature. (ECook app concept by Ha Truong)

Ways of seeing

In some ways, interaction design is instant, immaterial architecture. Both are manifestations of procedural design and construction but interaction design operates outside the laborious complexity of processing material, coordinating multiple physical systems, and negotiating the economic, cultural, and political boundaries of the built environment. The economy of scale of interaction design is almost purely efficient: with a single change in code, outputs change globally in an instant. Like architects, interface designers translate the procedural logic of information into tangible experiences through interactions with things like buttons, swipes, quirky haptics, and visual hierarchy.

In this way, to design an interface is to design an environment, or a realm for human comportment, intent, and agency. Unlike architects, interaction designers can think it, cook it, and eat it all in one day, and still have time for a nap while their architect friends are pulling another all-nighter tweaking finish schedules or managing change orders. Architecture is interaction design writ large and embodied, and at a finely-tuned scale, interaction design crafts the sensory basics of spatial experience: sight, sound, and touch.

Despite these affinities, interaction design lacks a robust discourse of representation. In architecture, that discourse is expansive, and records the development of disciplinary knowledge through constantly-evolving explorations of technique and theory. Architecture’s dream is the synthesis of idea, method, and form, and over a few thousand years of experimentation architects have developed tools to translate those desires into lived experiences within constructed space.

If building is architecture’s religion, descriptive geometry is its faith, and representational drawing is its ritual. All architecture is coded as form and space through drawing which is simultaneously directive and documentary. But there is no one true way to see; over the centuries, as our understanding of perception and experience became systematized and coded, architects established disciplinary techniques of representational drawing to excavate perception and inhabiting as both fact and phenomena. Those techniques are now embedded throughout cultural production, going well beyond architectural practice into film, photogrammetry, gaming and, naturally, interaction design.

Floating screens

That’s why the consistent habit among designers of representing UX/UI screens in axonometric projection is especially curious. Designers creating apps for everything from recipes to mileage tracking consistently represent UI elements in “perspective.” On portfolio websites and design blogs, interface mockups are displayed delaminated from the screen, suspended in 3D space, and endowed with depth, dimension, and extension despite having no real site. They even cast shadows! The effect is not to describe the functional use of an UI or clarify design intent, but to present a general aura — like that of a casual encounter, perhaps — with the interface itself. Blank axonometric mockups are easy to find online and populate with screens created in design tools like Sketch.

It’s done in a jiffy; pixel perfect layouts take up a position in space-time as though God snapped his fingers. The outcome will almost always look good (axonometric drawing distorts in a way that is — let’s not beat around the bush — cute), so it’s incredibly easy to plug-and-chug screen designs into a mockup and instantly give the work a pretty good feeling of legitimacy. All of this is a question of representation, and ignores the question of whether the interface is good from a disciplinary standpoint; that is, as an interface.

Here’s an example —

This is not an ad. Perfection comes from “good perspective.”

What is the allure of this casual encounter that somehow seduces? Why has interaction design, a two-dimensional practice, appropriated from architecture axonometric drawing a technique developed to reveal and correlate three-dimensional information to spatial experience?

Thick interfaces

Perhaps the answer is in the desire to create something that is more than its surface that architects and interaction designers share. Other than orthographic spec drawings, there is no obvious drawing mode for interaction design to convey subjective presence beyond the descriptive documentation of style. Without depth, and without any need to understand interconnected elements in terms of volume, extension, and orientation concealed by perspectival sight, digital interfaces are flat. They are planometric as drawings because that’s exactly how they’re experienced in everyday digital interactions. While this flatness can be broken with shadow, layering, and animated dynamics that objectify elements and bring them closer to hand, these effects are often debated on aesthetic grounds, whether they are ornamental or tangible, style or trend, rather as a question of the discipline’s ultimate purpose.

Even so, interaction designers already do understand their work environmentally — that is, as producing, through immersive design, a mode of inhabitation by which the screen becomes a unique sort of dwelling-place that is not merely utilitarian, even as it constrains and encapsulates experiences to a single plane. There is an environmental, affective outcome to interfaces that asks the user to enter in, but which evades stasis through the rules of drawing. How do you describe Narnia within the threshold of the wardrobe?

For architecture, the axonometric drawing clarifies multidimensional relationships in a measurable way, while unmasking correlations between parts that would otherwise remain obscure. While architectural axonometric drawings are revelatory, digital interfaces present no such opportunity or need; in fact, ambiguity and obscuration usually defy the tenets of interaction design. Through architectural drawing, however, interaction designers break free of the head-on use cases that define most of their work. With the suggestive power of drawing, they can imbue interfaces with a certain environmental presence. As the gaze tilts away from our normal frame of reference, UI drawings in axon attempt to simulate a subjective encounter with the screen as well as substantiate something which has actually has no physicality and, therefore, is void of the environmental meaning that only three-dimensional inhabitation provides. Axonometric projection is an attempt, in other words, to make interaction design more like architecture — literally, to give it thickness.

The function of drawing

Because it is four-dimensional and touches all of our senses, architecture is immersive and lived; it is sited, weighted, and placed. The dynamic exchange between the subject in space and the form of space itself accounts for the range of representational methods found in the discipline. Simultaneously descriptive and imaginary, the laws of projection convey meaning both ontic and ontological, reconciling the experiential truth of perception with the epistemic truth of logic. Architecture conveys these truths back into the world as physical construction. In this way the architectural drawing is an act of inhabitation; projection desires embodiment as an antecedent to experience. With the development of Renaissance perspective, how we see and encounter became constitutive of architecture itself, almost as an attribute in itself, just as a structural or material logic is translated into the construction of space.

The convergence of seeing and dwelling codified the function of drawing for spatial production, and aligned perception and being. Just as astronomers were finding godliness in the measured path of the planets, architects were discovering a holy unity between perception, drawing, and building that established the rules of conventional representation which, even today, dominate practice both conceptually and in the legal documentation of the built environment through drawing standards.

Even still, perspectival accuracy relative to our own visual comprehension isn’t enough to give a complete picture. While perspectival drawing can tell powerful stories, it privileges surfaces over relationships, light over shadow, the question over the answer; its desire is constrained by the earnestness to mimic how our eyes and brains view the world. Perhaps even more so than simulate, perspectival projection masks what lies before us, removing the nuances of perception to flatten the world and adhere to ruling logics of point, line, plane, and depth. Not until the perspective drawing becomes space itself can it be anything but flat.

Axonometric stories

But axonometric projection reveals. Freed from the exclusory rule of linear perspective and the spatial ordering of foreshortening, axonometric drawings allow the hidden to come into view by eliminating the convergence of parallels. Instead, the Cartesian grid never recedes; all objects are equally present regardless of distance, and foreground and context suspend as equals. You see the face, and also what’s behind the face.

It is visually seductive, even as it immediately unnatural. In defying the laws of perspectival projection the equivalency of seeing and being is disrupted. Entering the drawing pulls you into the uncanny valley of reality and representation, where the truth can be measured but not reconstructed. Instead, the mind is jolted to work interpreting space as pantomimesis. The eye traces the drawing to register its spatial instructions while the mind’s eye imagines the story and embarks to enter it.

In the work of Arenas Basabe Palacios (Top) and Microcities (Bottom), a landscape of courtyards and the spaces between individual buildings is folded into the story as it unifies the architecture.

Digital interfaces also depend on storytelling, but of a different sort. Because they are fully revealed through planometric 2D drawings, there is no equivalency between seeing and being. Instead, the best interfaces linger in a suggestive in-between state, where you discover digital space through the interaction with its components. A unique two-dimensional physics exists in this realm, with its own spritely propensities and kinematics acting across the face of the screen. The interface quickens in a way architecture cannot, suggesting a type of existence more profound than the attributes of the surface.

Digital experiences can go beyond, and with no burden to trace multidimensional experience or a mandate to reveal the real, all that remains is a story in the imagination. Whereas the architectural axonometric must contort spacetime to become unreal, the digital drawing can exist in any dimension it desires with equal validity. The surface may be ruled in x and y, but the body of the screen inhabits its own kind of being; below the surface, the unreal is perfectly real.

We’re just beginning to understand the potential of three-dimensional interfaces. By this I don’t mean augmented and virtual reality. Instead, what will the depth of the screen reveal? How will it touch back? Architects six hundred years ago and more wondered the same thing about our own world and how we hold it on paper. Today, interaction designers are using the methods developed in search of an answer to advance the question. Why do interaction designers show their work in axonometric projection? Because they desire, however subtly, the lure of physicality that defies dimensionality.

The screen may be a void; even so, with no there there, ultimately this desire is to give substance to the invisible or otherwise substance-less — to bring interaction design closer to the divine eye. And in doing so, to achieve something architecture never can: representation for its own sake; unapologetically, simply, purely aesthetic.

— — — — —

Architecture in axonometric projection. The drawing reveals what would be hidden in perspective by privileging all depths of view equally. Image by Noam Saragosti.
In the work of Drawing Architecture Studio, axonometric drawings reveal the simultaneity of experience, well beyond the direct comportment of the viewer.

--

--

Patrick Stowe Jones

Architect and interaction designer focusing on the human environment and place-based innovation.