Thinking Out of the Box

User Interface Architectures – Four Things Architecture and Interface Design Have in Common

Jonas Stallmeister

When I started working at Centigrade, I wondered what the “User Interface Architectures” tagline in the company name is about. New terms are common in our line of work; the terminology is still young and changing all the time, many people try to influence it with their own terms and definitions. Still, I thought “why architecture” – maybe you, as a reader, did too?

The short, upfront answer: drawing attention. Readers are supposed to be teased by that line. So, of course it is supposed to stick out, elicit associations and set Centigrade apart.

Still, “User Interface Architectures” is not just another empty cliché buzz term, which brings us to the long, more profound answer. These words sum our work up for newcomers quite precisely and descriptively. We always have to expect that customers, users and external designers or developers may not have a clear understanding of our work. By comparing our services to the field of traditional building architecture, we offer a way to approach it.

Of course, we and other interface designers are familiar with the typical tasks, processes and results of our field. If, however, we get lost in our own work, the comparison to traditional architecture and to traditional architect’s way of working can bring about new ideas and give us new drive. Internally, “User Interface Architecture” forces us to re-evaluate our way of work and view it in a broader context. We want to present four things architecture has in common with user interface design to show how the comparison works internally and externally.

1 – Durability

Most user interfaces are designed for years of use. We link ourselves with traditional building architecture to illustrate this long-term durability to clients. Of course, buildings are used for tens and hundreds of years. Still, interfaces are more lasting than other areas of design like advertising, magazines, packaging or fashion. In five years, some customers may likely still want to use our interfaces to solve their tasks effectively, efficiently and elegantly. That means that we have to keep an eye on development aspects such as usability, aesthetics and technology, which is one thing “User Interface Architectures” alludes to.

Usability makes durable

We do not feel that thinking ahead is a restriction – conversely, we like to design for the future. The most popular example of good user experience, Apple, shows how useful this perspective can be. Of course, the success of the iPhone depended on many things, but taking care of the user experience was definitely one of them. The iPhone was revolutionary when Steve Jobs initially presented it – today it has become the everyday standard that even toddlers can use up to a certain point. To get this wonderful result, the designers were careful from the start to use revolutionary technology to help users solve everyday problems. Otherwise, customers would have refused the innovation as distracting, annoying or obstructive. We, too, check our work continuously to make sure visuals, animation and interaction serve the users. If we achieve that, the result has a higher chance to still be valuable some years ahead.

2 – Coordination

Everyone who has worked on a user interface knows that they demand the knowledge, experience and collaboration of multiple specialists. But people who have just heard the term user interface for the first time are in fact already pretty familiar with this way of working: from classical architecture. Complex projects with extensive planning and many owners, foremen and builders. The newcomers to interface design know that architects have many duties and responsibilities in this situation: working out a rough draft and a detailed concept with the owners, bringing together requirements, wishes, budget and technical restrictions, then managing engineers, builders and craftsmen for the implementation, all without losing sight of the big picture. We compare our tasks to those of traditional architects because user interface projects in a similar fashion need to be supervised from the first idea to actual deployment.

White shirt and hard hat

In a typical project, we take time to analyze the intended use of the interface, establish the visual style and the technical framework, bring it all together and discuss it with key persons from the client and third parties like external developers. Communication is paramount for user interface design because so many crafts and authorities have to mesh well. We like to use the image of the architect in a white shirt with a hard hat and wellingtons. She is connecting, planning and supervising implementation. We have to move equally well in these worlds, even if we do not have to wear a hard hat. Because Centigrade does not only do interaction design and project management, but also development and visual design, we can more easily take the point of view of the other stakeholders. We know that an architect needs to be the supervisor. That also helps us when we are working as “craftsmen” under the direction of other “architects” – be it the customer or other interface designers.

3 – Use and Observation

Only usage lets buildings and interfaces come alive. The beginning of a typical building project is not the intended impression, but its usage: housing, storage, work, connecting. These are the requirements that future owners bring to an architect, and only when they are clearly defined, things like size, budget, timeframe, shape and materials can be decided. User interfaces should be built around usage as well. The comparison of user interface architecture to traditional architecture can make this principle clear to everyone working on a project: we need to understand the usage situation to work effectively. In his book “The Elements of User Experience”, Jesse James Garrett explains the usage of popular software by boiling it down to a single verb: Google – to search. Word – to write. Skype – to phone. These activities, broken down into interactions shape the interface. And the interface decides how users experience the software.

Pattern Recognition

The user’s wishes and needs are complex and not predictable at first or second glance – not to us and not to traditional architects. This fact made Alaska Airlines build a prototype of their new check-in counter in 2003 to see how passengers and employees use it and to test new observations immediately. For the same reason, both the first Apple Store in 2001 and the new generation in 2012 were tested as prototypes, revised and tested again.  The architects who were responsible just knew they could not plan everything in advance. This approach is known to everyone in interface design: observation, prototyping, user testing, multiple iterations. We are using methods similar to those in traditional architecture because we both are solving complex design problems. By incorporating the users into the design process we are observing usage patterns that can become the foundation of the interface concept. We get to know users, their environment and their goals and receive direct, unfiltered insight. We can quickly use these connections in interface prototypes and again observe how our solution works in reality.  These iterations make our product more robust and adapted to its usage. And in every project, we get more experience on what solution works best in which situation.

4 – Patterns

Patterns in traditional architecture

The concept of patterns  dates back to the classical architect Christopher Alexander. In  his 1977 book “A Pattern Language”, he introduced them as a design method for architecture. Quickly, they were adapted to information technology and system design, and then found their way into interaction design. Along the way, the theory behind the patterns got lost. A rediscovery of Alexander’s theory could help user interface designers to better understand, recognise and use patterns.

Christopher Alexander drafted his pattern language as an easy way to design and build structures that are natural, comfortable, timeless and at ease at their site. His architectural patterns collect typical relationships between people and their environment. The pattern of “Positive Outdoor Space” is an example: people prefer gardens and public spaces with clearly defined borders because they can overlook them as one while taking a guarded position near an edge. “High Places” is another pattern: in public spaces, people like to sit on steps, railings and low walls because improves their point of view without separating them. We all have observed these situations. In the same way, we can observe typical relationships between people and their digital environment – how we edit information, search, organize and spread it.

Architectural patterns describe the templates for solutions, not solutions themselves. They reflect common conventions, but they are no standard solutions. “High Places” does not specify if the solution should be steps, a patio or a natural slope. This decision always depends on the local context, and needs to be made by the architect or the residents. Only they can experience the situation directly and design accordingly, for example if they are collaboratively building a residential house.

Patterns in User Experience Design

Patterns like “Wizard” or “Breadcrumb” from interface design libraries like Quince or UI Patterns are more concrete than patterns from architecture. They resemble solutions, although they still only work in a definitive context. But: these patterns need to be adapted to their usage as well. Screenshots and code snippets tempt us to quickly copy the solutions without regard for the context. This increases the risk of misusing them.

Other than most traditional architects, we will hardly ever meet all users of our interfaces. But we can better understand the context of our work by involving test users in methods such as context analysis, prototyping and usability testing. In this setup, we can observe the patterns that make an interface work or not (the latter are so-called “anti-patterns”). This testing should be closely linked to working of patterns: patterns are resulting from observations – their profound exploitation requires observation as well.

Conclusion

The four examples introduced show the common ground of traditional building architecture and interface design: both have to take into account many factors and participants, both link aesthetics to technology and design to implementation. This alone makes “User Interface Architectures” a good summary of our work. But we also learn from the long experience of traditional architecture – residents and users are central, and we have to observe and involve them in order to design successful user interface architectures. Therefore, we will keep looking to architecture for rethinking and learning from old ideas and finding new ones.

Update 2017: While the idea of “User Interface Architecture” still is relevant, our company has evolved to tackle even broader problems. Find our renewed mission statement on our About Us page.

iPhone is a trademark or registered trademark of Apple Inc. in the US and/or other countries.

Want to know more about our services, products or our UX process?
We are looking forward to hearing from you.

Corporate Experience Manager
+49 681 959 3110
Contact form

Before sending your request, please confirm that we may contact you by clicking in the checkbox above.
  • Saarbrücken

    Science Park Saar, Saarbrücken

    South West Location

    Headquarter Saarbrücken
    Centigrade GmbH
    Science Park 2
    66123 Saarbrücken
    Germany
    Saarland
    On the map

    +49 681 959 3110

    +49 681 959 3119

  • Mülheim an der Ruhr

    Games Factory Mülheim an der Ruhr

    North West Location

    Office Mülheim
    Centigrade GmbH
    Kreuzstraße 1-3
    45468 Mülheim an der Ruhr
    Germany
    North Rhine-Westphalia
    On the map

    +49 208 883 672 89

    +49 681 959 3119

  • Haar · Munich

    Haar / München

    South Location

    Office Munich
    Centigrade GmbH
    Bahnhofstraße 18
    85540 Haar · Munich
    Germany
    Bavaria
    On the map

    +49 89 20 96 95 94

    +49 681 959 3119

  • Frankfurt am Main

    Frankfurt am Main

    Central Location

    Office Frankfurt
    Centigrade GmbH
    Kaiserstraße 61
    60329 Frankfurt am Main
    Germany
    Hesse
    On the map

    +49 69 241 827 91

    +49 681 959 3119

Cookies help us in providing our services. By using our services, you agree that we save Cookies. Learn more.

Close