Safe exploration in complex B2B applications

Matthäus Niedoba
UX Collective
Published in
5 min readMar 17, 2019

--

Enterprise applications are complex. It takes time to understand how they work and even longer to master them. Employees are constantly learning new systems or applications. This happens during a reorganization of a company involving new IT systems or an onboarding process after changing the job. Learning new systems and workflows costs a lot of cognitive load, stress and frustration. To make an employee’s life easier, applications should allow Safe Exploration.

The purpose of Safe Exploration

Safe exploration allows one to learn the application without having the fear of breaking something. It’s the learning by doing principle which is way more effective than studying with tutorial videos or reading manuals. Safe Exploration deals with “what if” scenarios. What if the user makes a mistake? Can he go back? It helps users to create the right expectations and helps them to imagine: “When I click on this button, I expect…” And most importantly, it teaches the user how to use the app. Enterprise applications are rigid and interaction concepts (once they are established in the beginning) will never change. Luckily, there are ways to add Safe Exploration on top.

Undo

The Undo feature is the basic command of every content creating app. It’s the big advantage why people prefer computers instead of working the analog way. If the user makes a mistake, he can always go back. It removes the fear of breaking something and provides confidence to try out features.

Even if it seems like a no-brainer, there are some hidden behaviors involved. Undo is not just stepping back every action the user created. It should be limited to changes on the work. Changing application settings is not part of Undo. Furthermore, Undo groups actions in meaningful chunks. For example, in Microsoft Word users are typing letters, but undo affects whole words. It even affects changes made by the computer like capitalizing the first letter of a paragraph.

Instead of reverting every user action, Undo works in logical blocks

Hovering

Limited to desktop applications, hovering is an easy to implement feature. It supports safe exploration, because the user does not evoke a command which would make changes to his work, but the visual indications create certain expectations to the feature. They can be a change to the cursor or highlighting of certain interface elements, like buttons or handles. It can also evoke tooltips, which we will cover next.

Cursors can be changed and interface elements can be highlighted

Tooltips

Safe Exploration educates the user directly in the application and avoids switching to an external resource like a PDF manual or a website. Tooltips play an important role here, because they are a simple way of explaining features. The cursor stays on an interactive element (ideally highlighted by a different hover state) and a message appears. This message can pop up next to the cursor or in a dedicated application area. If it’s placed next to the cursor, it will be easily recognized by the user. The message should be minimal. The drawback here is that it only appears after a certain delay, when the cursor is not moving. Chances are high that users will never face them. Sometimes it helps to add illustration and animation in tooltips, but it can be quickly annoying. Users will associate them with pop up ads.

Hovering works well with tooltips

If it’s located at a dedicated place in the UI, they can respond instantly when the user moves the mouse. The tooltip mechanism could be extended to anything visible in the UI and doesn’t need to be limited to tools. A folding mechanism should minimize them if the user needs the screen space for other interface elements. Ableton Live is a good example here.

Tooltips in a dedicated area can be used for more than just tools and commands

Interactive Tour

An interactive tour is valuable when people open the application for the first time. A good tour should not only explain the features of an application but guide the user through a demo project. At the end the user should have a finished project where multiple areas of the application have been touched. For example, exploring a video application is based on a small demo project examining multiple areas like file importing, cutting, color grading and sound editing. The user will then get an understanding of context and can then dive deeper into each area.

Explaining the application from the inside

Confirmation dialogues

Specifically for actions which are not able to be undone, confirmation dialogues are necessary. They add friction to the human computer interaction by making the user think, before submitting an action. Whether it’s the Drunk Mode for the iPhone, the classical “Are you sure?” dialogue box or a confirmation button in an online shop or banking application, they all provide a sense of security. A good confirmation dialogue explains what will happen when the user confirms the action. Its visual design needs to be vivid using contrast and color coding to highlight the impact of the action.

An other version of the classical “Are you sure?” dialogue

Conclusion

All the aforementioned elements can be designed and implemented without changing the foundation of a complex application. They are a layer of usability on top. Like most UX features, they are not noticeable, but make a huge impact whether users like an application or not.

Users are busy. They don’t want to read manuals or watch hours of video tutorials. They just want their work done. Education in the application has the same importance as intuitive design. Safe Exploration supports that.

If you found this article valuable, press the clap button so others can find it. You can find me on my website or follow me on Twitter.

--

--

I help people to build complex software products. Currently, as a Product Designer at bryter.io, working on decision automation platforms.