Designing Interfaces, 3rd Edition

Preface to the Third Edition

“The more things change, the more they stay the same.”

We’re approaching the 15-year anniversary of the original publication of this book, Designing Interfaces. And it’s been 10 years since the second edition. It’s worth looking at what’s changed and what hasn’t, and what it means for interface design and people who interact with software.

Since then, the big change is that technology and software accelerated their growth and spread in an ever-increasing way. This trend is not stopping. Today, we interact with software in almost every aspect of our daily lives; for work, leisure, communicating, shopping, learning, and more. The list of devices and things with software smarts and internet connectivity is exploding: cars, smart speakers, televisions, toys, watches, homes. Screen sizes and types vary, and an explosion of interfaces that are primarily gesture or voice are found in consumer products. Globally, more than half the population of the planet now accesses the internet. Finally, software is becoming more powerful, more analytical, more predictive, more able to offer smarter insights and operate more independently. In a phrase, it’s becoming more like us.

Interface design, like everything else, changes to keep up with the changing times. A third edition that tries to be the comprehensive design guide for all the possible interfaces in this increasing complexity would be enormous and never finished.

Why We Wrote This Book

When the opportunity arose to create the third edition of Designing Interfaces, we were excited for a number of reasons. First, we couldn’t help but be impressed that we have seen this title regularly on our colleagues’ desks and shelves over the years, a constant companion. Indeed, Designing Interfaces has been a lasting source of information and inspiration for many designers for a decade and a half. It’s a privilege to have a hand in updating this stalwart text.

The timing was right, too. The speed of change in technology and our digital lives has increased dramatically. Design is undergoing rapid change, as well. Designing Interfaces needed to be updated. That meant a twin opportunity of bringing forward what makes this book special and then sharpening and freshening the focus of the book.

The vision we said “Yes!” to is this: we see the need for a new guidebook to design. It would help make sense of this new state of software design. We wanted to write a guidebook that would have broad appeal, one that would be kept on hand by designers and teams of all stripes, from novice to seasoned. Although it’s no longer possible for a single tome to be a guide to all emerging digital channels and specializations, we still wanted a guidebook that would speak to the “home base” of interaction design as we understand it today. For this reason, we decided to focus this third edition on screen-based interaction design for web and mobile. What we removed is outlined in just a moment. Finally, we wanted to write a guidebook that offers a unique point of view. What makes Designing Interfaces unique and relevant is obviously its design patterns. We added some patterns of our own, specifically those aspects of human cognition and behavior that influence our design work. We hope we have a guidebook that brings design patterns to a new audience.

Design Patterns Remain Relevant

We asked ourselves, “How is design and Designing Interfaces relevant?” The answer is the design patterns. Design patterns come from the ways people perceive and use software. Human senses and psychology don’t change, and these patterns work with these, not against them. The patterns are evergreen also because they are based on the tasks–big and small–that people want to do with software. People will always want to use screens to search for things; enter data; create, control, or manipulate digital objects; manage money and payments; and send and receive information, messages, and files to other people. Design patterns form the building blocks for UIs for any screen. What’s more, thinking in patterns and looking for emergent ones is very much in line with how software and interaction design is carried out today.

Software Is Systems Now

Now more than ever, designers, entrepreneurs and developers, and companies have an effective toolset to design and build great software.

The design and software world has evolved into a systems, components, and modules approach. Starting from scratch to design or code something entirely new is not the norm anymore. There are numerous user interface (UI) toolkits and frameworks that allow you to create screen-based interfaces that work across many screen sizes quickly. These component libraries should be regarded as a way to rapidly get to a solid base. They are not a ceiling for design innovation: they are the floor.

The services and middleware that power software are increasingly an integration of separately owned and operated services, as well. Why develop your own registration system when you can sign up with Google, Facebook, and others? Why develop your own analytics and report-building software when you can integrate your choice of robust, customizable business intelligence platforms? Why host your own mobile platform when you have Amazon Web Services? The same is true for all of your HR processes, all of your IT infrastructure. We increasingly assemble, rather than create de novo.

Focus: Screen-Based, Web, and Mobile

We chose to focus on screen-based design for the web and mobile devices because that is the majority of what’s out there today. Screens are not going away. There will be more screens. In fact, the complexity of what we need to show on these screens is increasing. This will test our skills as designers and builders even more. We’ll always need people to design these interfaces.

We reworked the visual design and interaction design chapters to focus on the foundational theories and practices that drive great design. The rest of the book is the discussion of the patterns and how they can be applied.

We’ve updated the patterns and examples and provided explanations that show how they are relevant today.

What’s Not in This Edition

We deliberately did not go into a number of newly emerged and still-emerging areas. Not because they’re unimportant; rather, it’s because they have their own still-evolving patterns and present special design challenges. Already they represent distinct domains of design. Design books that focus on these unique new fields are here now. To go into the specifics of these areas, look for a design book that specializes in that domain.

Voice

We talk to our phones, our cars, and our smart music speakers at home to make software work for us. We have conversations with the machine. To find out more about designing for voice, we recommend Designing Voice User Interfaces: Principles of Conversational Experiences by Cathy Pearl (O’Reilly, 2017).

Social media

Social media has evolved beyond being a way for friends and family to stay connected. It is a communication, discussion, and interaction layer that is present in almost all software. It has revolutionized business communication and productivity. For more on this, see Designing Social Interfaces: Principles, Patterns, and Practices for Improving the User Experience by Christian Crumlish and Erin Malone (O’Reilly, 2015).

Streaming digital television

What we call television is now streaming digital video for entertainment on the screen or device of our choice. The interfaces for this are evolving beyond searching and browsing. TV is an app now, too, with access to all the features and power of our devices. You can read more on this in Designing Multi-Device Experiences: An Ecosystem Approach to User Experiences across Devices by Michal Levin (O’Reilly, 2014).

Augmented reality/virtual reality/mixed reality

Interface and software are becoming a layer on top of the physical world or a fully immersive world of its own. Goggles, glasses, and other devices are allowing us to mix the digital world in with what we see in front of us. To learn more, read Creating Augmented and Virtual Realities: Theory and Practice for Next-Generation Spatial Computing by Erin Pangilinan et al. (O’Reilly, 2019).

Chatbots and conversational design

Software assistants that seem to be human now talk to us every day via voice, messaging, and chat. These chatbots understand and respond to a conversation in a highly natural-seeming way. Powered by software that recognizes patterns in data and speech, and then learning and improving, chatbots are able to take over the handling of simple information requests and carrying out basic tasks for almost any business or situation. To achieve this capability, designers must create the source data domain and the conversation frameworks and scenarios that make the chatbot learn and become useful. To learn more about designing bots and conversations, check out Designing Bots by Amir Shevat (O’Reilly, 2017).

Natural user interfaces—gesture-based interfaces (beyond touch)

This evolving area of design focuses on using the body to interact with technology. Interfaces that you can touch, hold, squeeze or wave at; experiences that you can trigger by the movement of the hands, feet, or by moving around in space.

Who This Book Is For

We hope Designing Interfaces reaches current and new audiences. We created it to be of interest and value to many different people. It’s for design beginners, mid-career practitioners and managers, seasoned professionals, and executives. It’s for people who want to learn, to get a refresher, and to get inspiration and a new point of view. It’s for teams, classes, and individuals. It’s for interaction designers, information architects, product designers, UX/UI designers, product managers, developers, QA engineers, strategists, managers, leaders, consultants, teachers, students, and anyone who is interested in designing better software.

How This Book Is Organized

This book now has 12 chapters—some new, some substantially updated. The chapters themselves mostly follow a standard two-part structure.

Introduction and Design Discussion

The first half of each chapter is focused on introducing the topic and then expanding on it. This includes a discussion of the theory and practice of design as it relates to the chapter topic. Design principles, guidelines, and recommended best practices are reviewed. This sets the context for the second half of the chapter.

The Patterns

The patterns are concrete bundles of components and functions that help make software more usable and more useful. The second half of each chapter is dedicated to a selection of software design patterns. The selection is not an exhaustive list. There are many more out there. Each pattern is broken down into the following structure:

What

A definition of the design pattern.

Use when

This section covers the likely scenarios for use. The context for using the pattern is explained, along with any special considerations or exceptions.

Why

This section analyzes the purpose and benefits of the design pattern. This includes who might benefit and what kind of benefits can be intended or expected.

How

This section speaks most closely to the design of the pattern itself and the means of implementing it. What you should do to use the pattern well and when it is effective are outlined.

Examples

This last section provides a series of screenshots from different web and mobile properties that illustrate the selected pattern. Each example is described and analyzed.

Conclusion

We believe more people than ever are designing and building software. The tools are there. We want a guidebook for this new state of software design that makes it easy to understand and easy to implement. We wanted to write the handbook for web and mobile screen design that we would like to have at hand on our desks, a guide to give early-career designers, and a reference for product managers, engineers, and executive management. We hope that it becomes a useful reference that gives a common vocabulary for designing interfaces.

We see that consumer software experiences are an ever-present part of our lives now. We’re spending more time than ever using software interfaces. They should make life easier, not more difficult.

Although new modes, devices, and formats are rapidly emerging, screens are with us now and will be with us for a long time. We will be typing, tapping, and touching screens to get jobs done and to entertain ourselves, to find something, to buy something, and learn something. We hope the principles and examples in this book will give you the knowledge and confidence to use these proven patterns to create great products and services, great design, and great experiences for everyone.

Jenifer Tidwell, Charlie Brewer, and Aynne Valencia

Conventions Used in This Book

The following typographical conventions are used in this book:

Italic

Indicates pattern names, new terms, URLs, email addresses, filenames, and file extensions.

Constant width

Used for program listings, as well as within paragraphs to refer to program elements such as variable or function names, databases, data types, environment variables, statements, and keywords.

O’Reilly Online Learning

Note

For more than 40 years, O’Reilly Media has provided technology and business training, knowledge, and insight to help companies succeed.

Our unique network of experts and innovators share their knowledge and expertise through books, articles, conferences, and our online learning platform. O’Reilly’s online learning platform gives you on-demand access to live training courses, in-depth learning paths, interactive coding environments, and a vast collection of text and video from O’Reilly and 200+ other publishers. For more information, please visit http://oreilly.com.

How to Contact Us

Please address comments and questions concerning this book to the publisher:

• O’Reilly Media, Inc.
• 1005 Gravenstein Highway North
• Sebastopol, CA 95472
• 800-998-9938 (in the United States or Canada)
• 707-829-0515 (international or local)
• 707-829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at https://oreil.ly/designing-interfaces-3e.

Email [e-mail] to comment or ask technical questions about this book.

For more information about our books, courses, conferences, and news, see our website at http://www.oreilly.com.

Find us on Facebook: http://facebook.com/oreilly

Follow us on Twitter: http://twitter.com/oreillymedia

Watch us on YouTube: http://www.youtube.com/oreillymedia

Acknowledgments

We would like to thank our technical reviewers, Erin Malone, Kate Rutter, Frances Close, Christy Ennis Kloote, Matthew Russell, and George K. Abraham.

Thank you to Christian Crumlish, for connecting us to this opportunity.

And a big thank you to Angela Rufino and Jennifer Pollock from O’Reilly.

Aynne Valencia: I would like to acknowledge the stellar faculty of IxD@CCA, and the students I have had at SFSU, CCA, and GA over the years: you are a constant source of inspiration and give me abundant hope for the future. And mostly, I thank my husband, Don Brooks, for being my travel partner and for always defaulting to yes.

Charlie Brewer: I would like to thank the following people: the people at O’Reilly, for the chance to try something new professionally; the product team at SpaceIQ, for schedule flexibility; and especially my family and friends who have encouraged me in this effort.