Lessons From Designing Adaptable Interfaces

Some tips on designing adaptable interfaces

·
February 8, 2023

In today’s world of apps for anything and notifications for everything, it’s safe to assume that most B2B and Enterprise SaaS users want to spend only a little time on your product. And, even if they are using your product, they won’t be giving it their full attention. At the same time, they face complex logistical issues on which they need to make informed decisions. When evaluating and redesigning these experiences, it is essential to understand the context of user decision-making to create an efficient user experience that complements their goals.

At Whipsaw, we recently explored designing with a combination of smart defaults and adaptive user interface (AUI) design patterns for one of our B2B clients. By reducing complexity at crucial moments, while still providing the necessary context to keep people informed, we achieved a simple and effective user experience. In this article, we will provide some easy-to-implement tips and walk you through key lessons learned in our design process that helped guide our approach toward the end result.

Lesson 1 — Building your system knowledge

Design decisions need to be backed by data. It’s no secret that user research is paramount to designing useful products. UXR is essential for understanding and then simplifying the underlying patterns of your product. By establishing these patterns, you are making choices for your users, and this requires care. However, there isn’t always time or money to run new user research testing. I’ve personally worked as a designer in both in-house and agency roles, and in both contexts, it’s not always possible to conduct new UXR. In some cases, you can make a case for it, and if you can go for it, but if not… Your next task is to dig into the existing research with the lens of defining how the current pain points are manifesting in the product. For our client, we focused on identifying design opportunities to reduce the cognitive load needed to make decisions and complete tasks. The best place to start is to capture background information from internal stakeholders —the customer experience team, user researchers, product managers, or engineers. Depending on the project and scope, it may make more sense to focus on a particular stakeholder. These are the people who know why the product is the way it is. They know the system’s capabilities and limitations, as well as an awareness of user preferences and needs.

☝️ Actionable Tip
Meet with stakeholders one-on-one, with a simple agenda with a few questions, and get to know where they get their data, and how they make their decisions. This will help you determine where features can be expanded, or changed, and what might be off the table.

Lesson 2 — Understanding your power users

We worked with the client’s product managers and user researcher to identify the behaviors and patterns of the expert users to inform our product feature definition. We used quantitative data to understand and define the attributes of the product’s power users. This data will help define what engaged product users doing, and then create interfaces that more accurately anticipate their needs and provide intuitive options to complete their tasks by learning from those people doing it well already. In our case, some people were already using the product as experts in their profession. They used the product differently than those with less experience. These people were planning ahead, using the products existing features to schedule in advance, and seeking more advanced automation options. A marked difference from the vast majority of users who were using the product more reactively. Within key areas of the product such as scheduling or item selection, we set defaults that optimized for more efficient orders and delivery but did not constrain the option for people to set their own preferences. These defaulted to personalized options that emulated actions power users took that saved money on shipping costs and created more proactive order schedules. And had the added benefit of saving the client save fuel on transportation and time on logistics.

☝️ Actionable Tip
Create a profile of desirable user behaviors within your product, and map them to possible user features that simplify this within your product. This will help determine if the defaults and interface design map to these behaviors, and improve the user experience.

Lesson 3 — Creating scenario-based task flows

In our research efforts, we defined the key areas to focus our attention on, and then wrote scenarios for how both new, existing, and expert product users might experience the new product changes. In our case, this included tasks such as selecting item quantity, scheduling deliveries or managing scheduled orders to adaptively display relevant information that simplifies complex logistical processes. We used the scenarios to anticipate the different types of needs, decisions, and tasks that might arise to provide options that adapted to be the desired course of action for each type of user and their needs at that point. This is especially important when modifying an existing, established product where people already have comfortable patterns and expectations — you don’t need to redesign an entire experience to deliver value.

☝️ Actionable Tip
Write in-depth user scenarios for how different types of users might experience the same feature. These scenarios will help you create and identify the key user tasks to optimize the interface design.

Design Takeaways

For any digital product, the relationship between business and user is essential for successful growth and adoption. Designers can use smart defaults to create user interfaces that are simpler to navigate and more intuitive. By utilizing user data, designers can create interfaces that can anticipate user needs and show users the most logical options for their desired course of action. Additionally, designers can use adaptable user interfaces to give users the ability to customize their experience and tailor the interface to fit their individual needs. When used together, smart defaults and adaptable UIs are powerful tools that can create an effective, yet simple user experience without sacrificing utility.

Below I’ve outlined and annotated some key design takeaways we learned through this process:

Create domain experts by presenting choices that encourage planning ahead with proactive decisions saving time and money for both parties.

Each time a user checks out, we look at who the user is and the items in the cart and then compare them with their existing orders. The interface contextually adapts to display defaults that encourage proactive order scheduling.

Automate repeated actions by reducing interface complexity at crucial moments but ultimately providing tools for the customer to choose based on their needs.

Automate repeated actions by reducing interface complexity at crucial moments but ultimately providing tools for the customer to choose based on their needs.

Provide contextual information needed to make decisions by adapting the interface to display relevant data so users don’t need to search for it at crucial moments of action.

When a user comes to the main orders page they can view order cards that reflect the current delivery status and surfaces relevant user actions with orders actively out for delivery pinned to the top of the page.

Good design plays a key role in finding the opportunity to surface these takeaways in the UX and UI of the product. Digital product design is increasingly being used to bring legacy domains into digital formats that once needed intensive back-and-forth communication, advanced systems modeling, deep domain knowledge, and of course lots and lots of paper. Automating these complex systems requires both utilizing familiar patterns and exploring new paradigms.

Share this article