Building Engaging User Experiences

The Engagement Matters Podcast

Season 1, Episode 3

Mike Gaigg, author of the Esri Press book Designing Map Interfaces and the UX/UI Team Lead within Esri Professional Services shares how thoughtful design helps drive easier collaboration and engagement.

Listen now

Click on the audio player below to listen to this episode.

(Listen on any of these platforms:
Apple Podcasts, Spotify, Amazon Music, iHeartRadio, PlayerFM, Podbean)

Background

Most people know Esri as the world leader in GIS technology, but not everyone knows that there’s a whole division of consultants within Esri who focus each day on helping customers maximize their use of GIS. These people in Professional Services support customers across industries and in a variety of different ways. Sometimes customers need help in building a specialized app to streamline a process for their coworkers. Other times, Esri consultants help architect and build big solutions that solve enterprise-level challenges. This list could go on and on but the main takeaway here is that, regardless of how different the core project or task might be, the most common goal we see is the need for any solution to be easy to use and understand by users. That’s where the specialized user experience and user interface (UX/UI) staff on Mike Gaigg’s team come in. These consultants are experts at identifying who users are and what they expect, and then matching those factors with an engaging interface.

From “button guy” to “The Beautifier”

When Mike Gaigg first came to Esri in 2003, few people in the tech world were talking about user experience or user interfaces. The internet was still relatively young, browsers were limited in their capabilities, and most software products had steep learning curves. Essentially, functionality – what your software could do – was more important than how it looked to the average user. Little to no emphasis was placed on motivating people to use technology because there were so few options.  As part of his day job building functionality into ArcIMS (the predecessor of all web-based GIS platforms), Mike began styling buttons to make the software prettier and easier to use. As other developers around him started realizing the usefulness of this, the value of more intentional design started to take root and Mike became known as “the button guy.” That early work highlighted a need to make software more intuitive and prettier for users. These ideas evolved into defined roles within Mike’s new team:

• User experience (UX) designers who focus on the experience of the end user, and
• User interface (UI) engineers that build the code to make the interfaces engaging

Today, his team has consultants that specialize in either of these roles, consultants that do both, and even cartographers that make maps look better and more intuitive. After 20+ years at Esri, Mike is now known as “The Beautifier,” a good shift that signals how simply styling buttons has become just one, tiny component of engaging digital design.

The UX/UI Process

For people looking to tackle UX/UI challenges – or just looking to make their work more engaging – Mike suggests following his team’s “double diamond” approach. Often when we need to solve a problem with technology, we already have an idea in mind and that drives the work. Making the technology easy to use or pretty is a secondary concern. The double diamond approach turns this around to first focus on clearly defining the problem that needs to be solved. Who are your users, the personas/primary audience who will be using your app/interface (hint: it’s not “everyone” or “the public”)? What do they want to accomplish? How do they expect to interact with what you offer? These are the primary questions that we should ask before we start thinking about which software or tools to deploy. The second step of the double diamond process can be even more challenging: determining how to solve the business problem as directly as possible. Sometimes this means taking a more minimalistic approach which often isn’t easy for technology professionals.

To help illustrate this point, Mike uses a fictional trails app to help highlight the things we need to consider:

1. 1. Understand the strategy
      • • What do we (or others) offer now for our user personas/audience?
        • Where do we want to be at the end of this project?
        • What does success look like?

      We need to give people access to trail maps, camp sites, and more so that they can plan their trips better and have a better experience on our trails. Also, we need to solicit feedback from visitors so we can make targeted improvements to the trail system.

   2. Understand the business needs
      • • Why are we doing this?
        • What’s the vision?

      No digital maps exist to support the needs of people visiting our trails. We need a tool that shares information and also helps us engage with visitors in ways that are easy for visitors to understand.

   3. Understand the users and their tasks
      • • Identify the personas of our visitors (and be honest about who our visitors really are). We can’t just say “the public” because that’s not specific enough. Bikers, equestrians, families, tourists, all could be groups of people that visit.
        • There are two personas for the trails app: professionals (those who come prepared with equipment and are seeking an experience in nature) and the casuals (those who come in flip flops to walk around for a few hours and then go home).

      Accurately identifying the personas for the trails app will help focus the design to be as engaging as possible.

   4. Identify the data we need to support the personas
      • • Use the personas to guide what data you need. Professionals want detailed maps, wayfinding tools, and feedback mechanisms. Casuals want suggestions, more interactivity, and hours of operation.
        • o Identify the gaps in your data from a technical standpoint. You might have the hours of operation for different activities on the trails but is the data formatted correctly for the filters you envision?

      Knowing what data you have and if it’s formatted correctly helps you determine what kinds of UI choices you can make versus what compromises might need to be made. Ideally, your data should support your app so that it can be as engaging as possible.

   5. Ask questions (of real people)
      • • Interview real people, ideally a few of the people in each persona.
        • Use these interviews to build a list of requirements to discuss with stakeholders.

      Challenging your assumptions and conclusions from previous steps in this process will result in a better, more tailored and collaborative approach to building your app. This tailored approach will make it much more likely that users will interact and engage with you.

   6. Create visuals to make the concept real
      • • Make wireframes or mockups to plan what the app will look like.
        • Use these visuals to iterate early (before development begins) which will save you a lot of time in the future.

      Using visual depictions of the end product will help you and your team stay laser-focused on the thing that matters the most: the end user.

   7. Develop the solution:  Only after you’ve done all of the steps above should you start on actually developing the solution. To do so earlier risks wasting time and diluting the information you gleaned from the process which means that your app is less likely to do the job of engaging your intended audience than you hoped it would.

The double diamond process can be long, but that’s by design. Mike’s team has relied on it to guide countless projects that have yielded real impact because it helps focus an app, map, or story on the needs of the user which increases how engaging the app can be.

Conceptual vs mental models

When apps are developed that don’t fit this approach, and don’t provide the kind of intuitive experience that users expect, users tend to first blame themselves. “Maybe I’m doing something wrong,” is what we all hear from our grandparents when they struggle to search online for a new coffee pot. But most people aren’t that forgiving. Mike has observed that users will quickly realize “it’s not me that’s doing this wrong… it’s YOU” meaning that your app doesn’t meet their expectations. If you’re trying to engage people with technology, and the experience you built doesn’t match their expectations or isn’t intuitive, then you’ve lost their attention: no surveys submitted, no dots provided on the map, no sign ups for the in-person public meeting. This highlights a disconnect between what Mike calls “our conceptual and mental models of how the world works.”

Take for example a bookstore. If you manage the bookstore, you have a table where each record in the table is a book. Each book has a title, author, publication date, and more. Would you organize your bookstore like this? Would you have tables of books organized in stacks by title, author, and publication date? If you did, you’d be following a conceptual model which is great if your customers are computers that like indexing millions of books at a time. On the other hand, imagine how bookstores are organized in the real world and how you interact with them. You walk into the store and there are sections based on topic: travel, cooking, non-fiction, fiction, children’s literature. You go to the section that resonates with you and then you browse, even if you know exactly the name of the title you want. This is the mental model you have of how the bookstore is organized.

Mike’s point of using this example is to highlight the disconnect between how we might think of data (conceptual), and how our users actually engage with it (mental). If you want customers in your bookstore, you have to organize your books around how people expect to interact with the books. In the same way, if you want people to engage with your app (and you), then you have to build the experience around what they already understand.

Bringing it all together

The reason that digital design covers both the user experience and user interface of an app is because both sides of the user’s needs are equally important. Doing your homework to determine who your users really are, who you’re trying to engage with, and what they expect from your interaction with them (via your app) is critical. Your engagement work matters and the easiest way to convince people of that is to take the time to consider their needs first and to tailor your app to meet their expectations.

Learn More or Get Involved

If you want to know more about how thoughtful digital design (UX/UI), check out the Map UI Patterns site or grab a copy of Mike Gaigg’s book Designing Map Interfaces through the Esri Press.