My guest today is Dr. Jeff Johnson. Jeff has been applying his background in psychology towards designing better human-computer interfaces for over forty years. He teaches computer science at The University of San Francisco, and has written several influential books on UI design. Among these, he co-authored with Kate Finn Desiging User Interfaces for an Aging Population, which is the focus of this conversation.
Listen to the full conversation
- Jeff Johnson
- UI Wizards
- Cognitive Psychology
- GUI Bloopers 2.0: Common User Interface Design Dont’s and Dos by Jeff Johnson
- Designing With the Mind in Mind: Simple Guide to Understanding User Interface Guidelines by Jeff Johnson
- Conceptual Models: Core to Good Design by Austin Henderson and Jeff Johnson (My notes on Conceptual Models)
- Designing User Interfaces for an Aging Population: Towards Universal Design by Jeff Johnson and Kate Finn
- Tesla Model S Interior
- Google Maps
Some show notes may include Amazon affiliate links. I get a small commission for purchases made through these links.
Read the full transcript
Jorge: All right, Jeff. Welcome to the show.
Jeff: Thank you! I’m glad to be here.
Jorge: I’m very excited to have you with us. For folks who don’t know you, can you please tell us about yourself?
Jeff: Okay. Well, I have a degree in psychology — not computer science — from Yale University and then I went on to Stanford in graduate school in psychology. So, it was Cognitive Psychology and my research at the time focused on understanding human problem-solving and human memory. But I found that after graduate school, I could either become a professor of psychology somewhere or I could go into the computer industry and help companies make their products easier to use, easier to learn. And that’s what I decided to do. I worked for a small company in Silicon Valley named Cromemco and then I moved from there to Xerox, where I was working on document preparation systems. And then I worked for a series of companies in Silicon Valley and around the country, essentially doing human-computer interaction.
While I was doing that, it became fairly clear to me that companies keep making the same mistakes over and over and over. And they were design mistakes that were causing their products to be not usable. And so, I eventually quit working for companies and became a consultant. I started working for myself, as a consultant, but my clients were companies. And so, I’d go from one company to another. And I continued to find that they were making the same mistakes over and over again. And it got to the point where I could start to categorize the mistakes. You know, this is mistake number 47, this is mistake number 19, et cetera. And so then eventually, in the late nineties, I wrote a book called GUI Bloopers, which was basically a catalog of all of the common mistakes that companies make in their design that cause their products to be less than usable.
And that book was very popular. It basically made me well known in the field as the guy who wrote GUI Bloopers. People started calling me “Dr. Bloopers,” which I at first thought, “well, that’s great.” But then I started thinking, “well, I don’t want to be stereotyped as ‘Dr. Bloopers’.” So, I wrote another book, which came out in 2010, called Designing With the Mind In Mind, which was the psychological basis for user interface design principles. You know, where do user interface design principles come from? And that book was fairly popular. And so now, that book is in its third edition. The second edition came out in 2014 and the third edition has just come out now, in 2020.
Since 2016, I’ve worked as a professor of computer science at the University of San Francisco, teaching introductory computer science, introductory programming, and also human-computer interaction. In particular, I focus my human- computer interaction course on user experience design. And, so that’s… that kind of brings us up to the current day.
Jorge: I want to call out that you’ve also authored a few other books. Among them there’s one that’s been particularly influential to me called Conceptual Models: Core to Good Design.
Jeff: Right! Yeah, I neglected to mention that book. So, when I was working at Xerox, they had an approach to design that involved understanding the conceptual model underlying a user interface design before starting to draw screens and figure out what the appearance of the application on a screen or on a device would look like. And I very much agreed with that approach… their approach. And so, I, and Austin also — Austin Henderson, my coauthor — also worked at Xerox, and so, later the two of us started pushing that approach — the conceptual models approach — throughout the rest of the industry. We would give talks here and there, we wrote articles for magazines and at one point, a publisher approached us and said, would you be interested in writing a book on this topic? So, we did. And so, in 2011, the book Conceptual Models came out, as a result of that work.
Then, also around that same time, I became interested in how do you design for older adults? That is, the technology doesn’t seem to work as well for older adults. And there are a number of reasons for that. And so, I started doing some research on that and reading and understanding, and then a colleague and I formed a consulting firm that was called Wiser Usability, as in older, but wiser. And we would help companies make their products more friendly for older adults. And then we eventually wrote a book about that, that is called Designing User Interfaces for an Aging Population. And that book came out in 2017.
Designing for an Aging Population
Jorge: That book is part of the reason why we’re talking today. Tell me about designing for an aging population; what is different about folks who are aging and other folks in the groups of people that we design for?
Jeff: Okay. Well, number of things that make designing for older adults challenging. But first let me mention the irony in this situation, which is that older adults are in a sense the population that is most in need of technological assistance, because they could benefit greatly because of limited mobility, because of limited eyesight, because of limited other things, from technological assistance of various sorts. You know, the ability to shop online, the ability to do their government businesses online, getting a driver’s license, and things like that. But the irony of course, is that the technology doesn’t support them very well, and they struggle with using the technology — I should not say “they,” because I am myself over 60, and therefore I should say “we” older adults — but, that’s the irony: they’re the population that would benefit from it the most, but it actually is least usable for them. The question is why and how can we fix that?
And there are a number of reasons for that. One of them is a whole collection of things that have to do with the fact that as we age, we experience certain disabilities of various types like failing eyesight, failing hearing, failing hand-eye control and other things like that, and therefore products and services that don’t take that into account can become difficult for us to use. Now, the interesting thing about that is that, of course there are people of all ages who have difficulty with vision, difficulty with hearing, and difficulty with hand-eye control. And so, really making things and products more accessible to older adults actually helps them for all of us.
One of the examples I like to give is that when you’re on a bus and you’re riding from someplace to another place, or in a car and you’re riding from someplace to another place, and you are trying to use your phone to either get the weather report or to text somebody or something like that — and I’m not assuming that you’re the driver, let’s say you’re a passenger in a car or even a bus — and you’re trying to do that while the bus is shaking, now suddenly you are like a person who has hand tremors. If you’ve ever tried to text someone while you’re in a car, then the is driving over a bumpy road, you know what I’m talking about.
Those kinds of things are one of the family of reasons why older adults have trouble with technology. We just don’t take them into account. But there’s another set of reasons that are perhaps in my view almost more important than that category of issues that I would call accessibility issues that I’ve just discussed. And that is, issues that are more about how do they think? How do older adults think about the world and how do they think about doing things and accomplishing tasks? What are their models of how the world works and how the technology should work? And that is something that’s quite interesting because that problem is not going to go away. The first set of problems isn’t going to go away either because people are going to continue to age and experience age-related disabilities. But the second category of problems is going to remain with us too, and for a different reason.
But let me back up for a second and say something: there is an argument floating in the computer and technology industry that the problems of designing for older adults are going to go away and that we don’t have to worry about them forever because, they argue, that today’s older adults are “digital immigrants” rather than “digital natives,” right? So, digital natives are kids of today who’ve grown up with technology all their lives and they know this technology and they’re comfortable with it, and, it’s not a problem for them. But the digital immigrants who are the current generation of what you would call “boomers,” and people who are older than that, are going to have trouble because they weren’t used to this technology.
The argument goes that once all the digital immigrants die, everything will be fine, and we won’t have to worry about designing technology for older adults because everyone will be digital immigrants. So, that argument is false. That argument is wrong. Because technology does not stand still and people tend to get… they grow up in whatever the dominant technology is, as people are, let’s say between ages 10 and 30, is the one that they become used to, and then they got stuck in that way of thinking about the world. But the world moves on. The technology moves on, okay?
One way you can think of it is that the current generation of baby boomers, they grew up when the technology was analog electronic and mechanical. There were mechanical objects, and they were analog-electronic objects. Now, these boomers were born from between 1945 and let’s say 1965. That means that they were 10 through 30 in the time between the sixties and the late seventies and early eighties. And so, the technology that was prevalent then was mostly analog electronic, and some mechanical technology, not so much anymore. And that’s what they got used to. And that’s where they got stuck. And so, the technology that came along afterwards, which was personal computers and the rise of the internet and digital electronics, was new to them. And so, they were not natives of the digital technology world. And so, today’s kids… people who are born after that, the children of the boomers… I don’t remember what the name of that generation is…
Jorge: Maybe Gen X?
Jeff: Gen X, yes. They grew up in a world where there were personal computers and the internet was just getting born. And there were online discussion groups, and AOL had become a thing and it was popular, and the web started during their maturation years. And so, they were natives of that. But the Generation X is not natives of social networking and Google and all of that. And so, basically everyone is natives of some technology and immigrants of the next wave of technology. That affects what you know, and that’s going to keep going on.
You know, my students at USF don’t believe that they’re going to get stuck in any particular digital age, but I keep telling them they’re wrong. That their kids are going to be saying to them, things like this: “Mom, why do you keep Instagramming me? Nobody uses Instagram anymore. I use Brain Link. What are you talking about? Instagram?” And then the mom is going to be saying, “Oh, this Brain Link thing. I just can’t get used to it.” And my students don’t believe that’s going to be them in 20 years. They don’t believe it, but it is. They are digital natives and they’re social networking natives and they’re digital music natives, but they are not quantum computing natives. They are not neural-network-driven computing natives. Those are coming along, and they will be immigrants to that technology.
Empathizing with Aging Users
Jorge: I want to reflect back on what you’ve been saying here, because there’s a lot of really interesting and important ideas that I want to follow up on. One is this distinction between a set of challenges that has to do with the usability of these artifacts that we’re dealing with — I use the word accessibility — and the other set of challenges has to do with trying to bring a mental model that no longer fits the reality of the ecosystem that you’re dealing with or the products that you’re interacting with. And the thing that strikes me about those two is that the challenges for designers in both cases have to do with an ability to empathize with the people who are unlike them, who have a different set of physical or… I don’t know if to say their motor skills are different and their perceptual skills are different. And also, what I’m hearing you say there at the end with the Instagram example, is the younger folks, who predominantly I see as representing the demographic that is actually designing these products, is unable to conceive of themselves operating in a world where their mental models aren’t dominant. How do you overcome that?
Jeff: Well, first of all, you have to teach methods, right? Methods for design that involve building empathy into the process. The methods for design should include having older adults on your team, or at least within easy access of your team. Your design team should be able to talk to a lot of older adults and run focus groups with them and show them examples of products, in fact, even before the products are designed. You know, storyboards and things like that. Or even just have discussions about what the older adults are having challenges with. That’s one way to bring empathy into the design process.
Another way is kind of interesting, and some companies have used this method — and in fact, this method I’m about to mention is actually called “empathic design.” What you do is you give prosthesis to the young designers that impair their perception or their movement in various ways. Some car companies have actually done this: When they’re trying to design a car that will be bought by aging boomers of today, they actually will give the young car designers clothing to wear that impairs their movement. So here put on this jumpsuit that’s got straps built into it that make it hard for you to turn and twist your legs and turn your head and get in and out of this car five times in 10 minutes. Please do that. And then the designer goes, “Oh yeah! These seats are too low.” Or, “This door doesn’t open wide enough.” You know, things like that.
So, you can do that in the physical realm relatively easy. Perceptual realm, what you can do is you can give designers glasses that blur their vision or that darken the world. One of the interesting things about older adults is that our eyes become less capable of taking in light over our lifetimes. There are a number of reasons for that. One of them is that your cornea and your lens become yellowed over time with exposure to ultraviolet light, and therefore let through less light to your retina. Now, the retina also loses light sensitive cells over the course of your lifetime and therefore becomes less sensitive to light. And so, the upshot is that the average 80-year-old needs light to be three times as bright in order to perceive the same brightness as a 20-year-old. I may not have those exact ages right because I haven’t memorized them, but they’re in the book. So, in the perceptual realm, you can give your designers prosthesis, or artificial impairments that will affect their hearing or their vision or their touch. For example, the example I gave earlier, right? You put someone and tell them, “Okay, you got this phone and the buttons… we think the buttons are too small, but you think they’re fine. Okay, here. Get into this car and we’re going to drive over a bumpy road and you try to text somebody.” You know? So, you can make people situationally impaired, and that can bring empathy. Put somebody on a camel and tell them to use their iPad.
Jorge: On a camel? I love that. I’m going to try to find out where we can procure a camel for a usability study. These all seem like good methods to use for the accessibility part of the equation. I’m wondering if there are similar methods we can employ for the mental model part of this. Where these folks like you said, they might have grown up in a world where the technologies were very different, and now they’re being asked to somehow operate in this world where a lot is taken for granted that just isn’t available to these folks.
Aligning Mental Models
Jeff: Right. Well, think of it this way: When I was 15 years old, all the user interfaces I used were right there in front of me. They didn’t require any kind of a concept of navigation. I did not have to navigate to the function that I wanted to do. Whereas now, starting with, personal computers, but continuing through the web, continuing through social networking and continuing through the use of cell phones, navigation through a user interface became an important concept. It’s part of the design, right? There’s no way a cell phone with its small screen can provide all the functionality right there on the screen that you need at any given time. But the old telephones, there was no need to navigate from one function to another. You just pick up the phone and start dialing the number.
Interestingly, the concept of dialing a number… we still use that word, even though nobody has dialed a phone for 30 years. But anyway, so I guess what I should say is that our terminology often gets stuck even though the technology moves on from that, right? I keep hearing people on the news say, we have film of this politician committing bad stuff. We have it on tape. We have it on film. We captured footage. Those are all words that apply to actual physical film. Some of my students have no idea where does this term “footage” comes from and why do we apply it to movies. But anyway, that’s just a little aside.
So, the concept of navigation is a new thing for many older adults. It’s something that happened after their maturation period, after they got stuck in their technology. And so, when I’m driving in my Tesla and I want to use the radio, I actually have to navigate from the map screen, which is showing me where I am right now in my neighborhood to the radio screen, right? And in the old days — when I say the old days, I mean, the days that baby boomers were used to, they grew up in — I didn’t have to do that. There was no map on the screen. I had a map maybe on the passenger seat next to me, unfolded, that I got from a AAA. But the radio was right there on the control panel — the dashboard — all the time, and so was the ignition, and so was the air conditioner, and so were all the other functions. They were right there. I didn’t have to navigate from one function to another. So that’s a confusing concept for many older adults. And yes, eventually, those older adults will eventually die, and tomorrow’s older adults won’t be confused by that, but they will be confused by other things that will change.
Jorge: I was really intrigued by these methods that you called out like the bus example earlier for the physical challenges involved… what I think of as the UI challenges. And I’m wondering if there are equivalent methods for us to use for this more conceptual challenge. Are there like the dark glasses that I can wear, but for the conceptual models that have become part of my world?
Jeff: Yes and no. It’s easier to impair someone’s vision and hearing and physical movement than it is to impair their brain function. I mean, you can impair the brain function by giving them a bunch of whiskey to drink, but that’s not the right kind of impairment, right? What you need to do is to be able to make it so that certain concepts don’t make sense to them. So, that is difficult.
But there are some design techniques that one could use. For example, suppose I want to make a map app and I want to make it easier to use for a wider range of people, including people who don’t have the mental model that involves a lot of navigation. Well then, I just build what’s called a one-screen app — and those are actually becoming fairly popular, right? So, there are lots of companies that are going with this idea of everything should be on a screen, and I shouldn’t have to keep moving around in the app from one place to another. Google maps is a good example of a one-screen app, right? And there are some others that are coming along. I’m having trouble remembering them right now. But the concept of one screen apps is actually becoming more of a thing and it actually is quite useful for mobile apps on phones.
Now, the problem with a mobile app on a phone is that your screen is really small. So, a one-screen app is really challenging design-wise. But what you’re trying for is to eliminate the notion that people have to find their way to the function that they want, right? When I buy an airline ticket on an airline’s website, there’s a whole series of pages I have to go through to get that ticket. And some older adults find that quite challenging, because just when they think they’re close to getting their ticket, they see a link that says, “bargain prices here” and they click on it and suddenly they’re nowhere near their goal. And they go, “Oh! This is crazy. I thought I was going to get a bargain price on that flight I was just about to buy!”
There’s an interesting design pattern that was invented actually maybe 15 years ago, by some colleagues of mine, I’m trying to remember their names. But the design pattern is called Process Funnel. And what Process Funnel is, is the idea is that once your app knows — once your website knows — what a user is trying to achieve, guide them strictly toward that goal, do not distract them. Don’t put up ads. Don’t put upside links. Don’t put up little bargain links that take them away from that path. Once you know what they want, guide them to their goal. Because you make money when they get to their goal, and they are satisfied when they get to their goal. And if you distract them from their goal, you’ve lost them. You don’t make money. So, process funnel is a very useful design pattern. Try to figure out… Yeah, offer a lot of different choices for them at the start, but once you know what they want, take them there. Make sure they don’t get off-path.
Benefits for the Young and Old
Jorge: I love what you’re saying here, and I have so much that I would like to follow up with you about this topic. Unfortunately, we’re running out of time. But I just want to say that the things that you’re describing — the methods, the processes, and just the mindset of empathizing with folks who have different abilities than your own — sounds like something that might be valuable not just for making your products sell better, for example, among older adults, but also would bring benefits to everyone. If you do what you’re describing there of optimizing the path to completion of a goal, other people — younger people — are going to also derive benefit from that, no?
Jeff: Yes. One of the things I have to say since I teach introductory computer science at a university, is that I don’t think it’s the case that all younger adults are tech-savvy. I have lots of students in my classes who don’t know the difference between WiFi and cell service. “My cell phone’s not working. Why not? I have WiFi!” “Well, people can’t call you on your WiFi. Don’t you know the difference between WiFi and cell service?” Okay? So, there are lots of young people who are not technologically savvy.
But what we’re trying to do as designers is to build essentially the equivalent of curb cuts. You know, curb cuts were put in for a specific purpose: to comply with laws that people with wheelchairs needed to be able to get around in cities. But actually, more than 90% of the users of curb cuts are not people in wheelchairs. The people who actually benefit from curb cuts are… the overwhelming majority of them are people with skateboards, and pushing shopping carts, and pulling roller bags, and pushing strollers, right? So, the curb cuts actually helped everyone, even though they were mandated for people in wheelchairs. And that’s what we need to do in technology, is design not strictly for older adults — because that makes no sense — we need to design so that older adults and everyone else can use the technology.
Jorge: That strikes me as a great summary of the topic and a fantastic place to wrap up the conversation. Where can folks follow up with you, Jeff?
Jeff: Well, I have a consulting firm called UIWizards.com. So, they can look me up there. I have these books, Designing With The Mind in Mind, GUI Bloopers, Conceptual Models, and Designing for An Aging Population. They can check out those books and, you know, get in touch with me that way. I teach at the University of San Francisco. You can get in touch with me that way.
Jorge: Well, fantastic. It has been such a pleasure to have you on the show. Thank you for making the time.
Jeff: Thank you for having me.