Cyberspace cities: The Image of the City and software design
Urban planners have been designing for human experiences for nearly 200 years, UI/UX designers can learn from this
This article is part of a series where I am exploring the connection between cities and urban planning theory with the modern practices in digital product design and user experience design. You can read more from this series here.
In 2017, my wife and I spent our honeymoon in Lisbon’s Alfama district. The small district was formed in 1200 BCE. Beautiful old churches are sprinkled between the narrow residential three and four flats throughout the neighborhood. Small residential groceries and bakeries are on every corner and in the evenings, some streets completely shut down to become open air restaurants for locally caught fish. All of the streets are cobblestone and narrow, often no wider than 15 feet across. Your only real option for mobility in Alfama is walking. In fact, I think owning a car in the Alfama district would be more of a hassle than a benefit, as evidenced by the row of cars parked on sidewalks overnight.
What I find remarkable about Alfama is this: it shares, more or less, the same characteristics and elements of any modern city. Despite the centuries of time that separate them and clear differences in scale, Chicago and Alfama share many of the same core elements. They both have roads, businesses, homes, places of worship, public art, neighborhood squares, parks, schools, and much more. They may look exceptionally different in terms of their form and scale, but at the end of the day Alfama’s churches, markets, and alleyways perform the exact same functions as the same spaces in Lagos, London, Beijing, Mumbai, Los Angeles, or any other major modern metropolis.
Taking this a step further, all these cities also share similar traits to classical era cities like Rome or Alexandria. And of course, all of them share similar characteristics with the first known cities in Mesopotamia, such as the earliest known city, Çatalhöyük (7400 BCE to 5200 BCE), and other ancient cities such as Babylon, Uruk, Ur, Nineveh, and Jericho. In the nearly 10,000 years — as far as we are aware — that mankind has been building cities, the same common elements have always existed, albeit in various forms and scales.
In my first article on the subject of Cyberspace Cities, I made a brief case for the remarkable parallels between cities and software in terms of how they are designed to facilitate human activities. The city exists in a physical vector while cyberspace exists in a metaphysical vector, but they both seek to connect people to each other, services, and other places of interest in a meaningful and pleasant manner. These similarities then beg to question: what can we learn about the centuries-old practice of building cities and then apply to the modern practice of software design? Let’s get started with some basic theory; a condensed 101 course, if you will.
Urban Form
One of the most foundational elements of urban planning is the term “urban form”. Foundationally, all cities have these common components I mentioned above and compose the urban form. These features, elements, and motifs may range in size, color, material, age, features, and countless other parameters, but primarily they share common elements. This is precisely why when you visit Paris, Mexico City, Cairo, rural Japan, or a suburb of Seattle you can use the same common names for elements with relatively little variation in meaning. Foundationally, every city has streets, buildings, and open spaces, but if we subcategorize these, we still see clear cross cultural equivalents. Product design leverages metaphorical urban form constantly and it is quite easy to spot.
A brief note on design as a collective field first. All design depends on repetition and motifs to create universal experiences and they all have their own, field-specific terms. Various fields of design focus on the “intended” user(s), seek to minimize friction between the user(s) and their goal(s), assisting in whatever the task(s) at hand is(are). In many cases, this causes convergence on ideal design choices. These may often be codified in the form of regulations like architectural code, or universal theory, such as Gestalt Principles. We have this sort of cycle of innovation and standardization to thank for why all spoons, cars, or user interfaces are, more or less, the same shapes, sizes, and mechanisms. In many cases, these principles of design enter the societal zeitgeist in a manner that allows many users to unconsciously engage with a product. Can you imagine having to “make sense” of every door before using it? Worse yet, think about how frustrating it is when a design contradicts expectations. Have you ever pushed on a “pull door” or pulled on a “push door”? These unclear doors are known as Norman Doors, and are uniquely frustrating because they often contradict expectations in a way that leaves the user confused, irritated, and even embarrassed.
This approach to design, where user needs and values are centered along with the goals of simplicity and ease-of-use were formalized in the 1920s Bauhaus movement. The core values of this German design school still guide design to this day, but it has its roots in the often quoted maxum of Lewis Sullivan, stated nearly century before the Bauhaus movement: “Form follows function”. Lewis’ protege Frank Lloyd Wright further expanded on the idea, saying: “Form and function should be one, joined in a spiritual union”. Regardless of the semantics, design as a collective body can be summarized for these purposes as oriented towards problem solving in a manner that is comfortable, intuitive, useful, and often beautiful.
Cities, because they are they are the direct result of humans need for community, shelter and food, arose out of the invisible “form vs function” tug-of-war. It is clear that, since the dawn of the “city” as a concept, humans have sought to create functional and beautiful places to inhabit. These choices have molded the urban form of all modern cities today.
The Image of the City
In 1960, Kevin Lynch, an American urban planner and MIT professor, released one of the most influential urban design texts to date. The book is titled The Image of the City and every urban planning student or practitioner for the past 50+ years has read it. Lynch is widely regarded as one of the patron saints of urban planning along with Jane Jacobs, Lewis Mumford, Ian McHarg, Daniel Burnham, and Frederick Law Olmsted. Ask an urban planner about these names and they’ll surely talk your ear off.
Lynch’s seminal book is predicated on his research into the theory of urban form while working as a professor at MIT. The core objective of the text focuses on how people make sense of urban spaces while experiencing them as pedestrians. Lynch’s book lays a foundation for understanding the human experience of space as a conceptualization based on his observations of a few cities as examples. This framework gives language and to the human experience of urban life, and it remarkably transcends space, time, culture, and technology.
Lynch identified five core elements that every city has as a sort of macro-taxonomy for urban spaces. Regardless of size, age, or country, urban spaces share these five elements. The resulting maps Lynch created from these theories have become a staple of urban planning theory. The maps are subjectively drawn according their the creator’s “mental map” of a place. While these are subjective classifications of space, comparing dozens of mental maps from strangers often reveals clear patterns and a level of objective truth about human experiences of places.
These elements are so universal that anyone can make a “Lynch” map quickly. In fact, asking people to create their own mental maps of cities, using the elements he identified, is a standard practice at the early stages of most new urban planning initiatives. Below are the 5 elements of urban spaces that Lynch identified along with examples I have created using Chicago’s “Loop” district.
Paths
Paths are simply defined as the corridors or channels that foot traffic, cars, etc. traverse to move about the city. Paths can be formal or informal (such as a sidewalk as opposed to a commonly known shortcut in a park). Paths can share modality (roads allow bikes and cars) and paths are generally easy to follow and identify.
Edges
Edges define boundaries between “A” and “B” within space. Paths often create edges within an urban space, meaning that paths cut through space and create edges on either side of them. Most simply said, edges allow us to say “this starts here and ends there’’ and ultimately identifies differences between places. Edges can be hard or soft and it is generally easy to identify where an edge starts and ends.
Nodes
When many paths or edges converge a node is there. Nodes are junctions between many elements that allow users to move about other parts of the city. The intersections of our roads are the most clear form of a node in a city. Nodes are a decision point for those moving about a city.
Districts
Within the boundaries of edges, we have districts. Districts are identifiable and usually homogeneous in perpetuity. Neighborhoods are the most easily defined districts, but other examples could be college campuses, parks, industrial districts, or areas of commerce. Districts may also feel very similar to one another from an outsider’s perspective whereas a local may see more subtle nuances. Most local Chicagoans recognize the differences between Logan Square and Wicker Park, but a tourist might not. Districts make up the majority of the physical area of cities.
Landmarks
Landmarks are easily identifiable physical elements that ground one’s experience in space. When visiting Chicago, one can use Lake Michigan to easily orient one’s self. Likewise, The Hancock building and Willis (Sears) Tower help one know where the River North and West Loop neighborhoods are. Smaller cities, towns, and neighborhoods have landmarks too, even if they are less grandiose. These are often monuments, restaurants, coffee shops, convenience stores, billboards, or even landscapes that everyone commonly recognizes. Landmarks should be relatively universal, even to outsiders, though, in smaller localities, they may become more colloquial in nature.
Lynchian Map
If you stitch together all of these elements you create a Lynchian map. This is a foundational map every planner uses to make sense of a specific space or area. There is an element of subjectivity to this practice, but generally, people draw very similar conclusions. Both the similarities and differences help designers postulate as to how people experience civic spaces.
This sort of basic classification of space might not seem like some sort of revelation, but it gives everyone common language for defining urban elements. It also then gives people the tools needed to critique good / poor urban design. Paths are designed to be traversed, if they fail at this core function, then they’re not really well designed. Furthermore, some paths focus on casual mobility, like a trail in a park, where speed is secondary to the primary goal of leisure. Arterial streets primarily prioritize speed and efficiency by contrast. As such, dropping a busy street in the middle of a park or placing a meandering trail in the middle of a business district violate the contextual needs of the design. Can you imagine running Chicago’s Michigan Avenue straight through New York’s Central Park?
It’s not hard to think of examples where other elements do their jobs well or poorly. Central Park is both a landmark and a district and does a great job at providing pedestrians a sense of where they are in Manhattan while also clearly communicating the intended use of the park. Meanwhile, my hometown of Cincinnati is one of the worst victims of American Urban Renewal in which American cities ran highways directly through their urbancore neighborhoods (mostly communities of color, often in poverty). The results have created jarring and repressive pathways, and edges, often with very few nodes to allow diverse mobility or choice of direction. In my next article I’ll speak more directly to these issues.
Returning to Product Design
So, what does this have to do with product design? Well, product designers have their own form of Lynchian mapping for products. User journey maps and service blueprints are profoundly similar tools for making sense of “space”. In my prior article I made a case for cities primarily focusing on human mobility in the physical world while digital services transcend the physical world to “travel” through the metaphysical world of cyberspace. Buttons, clicks, drop downs, and menus are the streets, highways, building, and open spaces of our metaphorical city.
Service blueprints and user journey maps also tell us about the common elements between the city and applications and what design choices do and do not serve users well. The lines connecting objects in a blueprint or journey map represent a “pathway taken” often from one “district” to another. Moving from the “profile district” to the “marketplace district” in an app requires use of a “pathway” and “nodes” in the from of clicks, buttons, and menus. There are clear “landmarks” within apps, usually in the form of controls, top ribbons, icons, logos or hamburger menus, and they all help us stay grounded in the experience and navigate about the application.
We can thus, consider the mobility in an application just like a trip to the grocery, a bike ride to the park, or a walk to pick your kid up from school. The physical pleasures and frustrations of the urban form all have metaphorical equivalents in apps. The detours, turns, and short cuts along these trips perfectly mirror how we navigate cyberspace. This is an inflection point for me. This is where, I believe, we begin to see that the similarities between cities and applications are no longer metaphorical. Cities move our physical bodies from place to place, service to service, and task to task. Applications move our virtual “bodies” from various digital places, services and tasks in the exact same manner. Through the use of paths, edges, nodes, districts, and landmarks applications move us through the digital world in a perfect reflection of our built world.
In my next article I’ll explore what determines good and bad urban design and how that translates to the user experience. The exact same things that make some cities or neighborhoods beautiful or ugly also mirror the best and worst in our applications.
