Slack Tab Navigation Helper

✋ What is it?

This is a pattern found in Slack. When users start tabbing (pressing the tab keycap to navigate) in a conversation window, Slack will prompt them with a helper message that teaches them how to use other keyboard functions.

🤲 How does this interaction or solution work?

Keyboards are the most widely used computer peripherals and are the only input devices capable of addressing a wide range of cases like accessibility browsing scenarios.

Many users rely on keyboards to browse through UIs. Mainly, the tab keycap usage is a standard input to move through forms or select context buttons without the need for a mouse. This behavior is known as tabbing navigation (https://en.wikipedia.org/wiki/Tabbing_navigation)

Slack, as many other apps, allows users to navigate its UI with the tab key. When users start pressing the tab key while actively using Slack, the app will begin to highlight the different interactive elements. A series of continuous tabs triggers a modal window with information about other helpful keyboard inputs that allow users to interact more fluidly with the Slack UI.

🙌 How does this interaction or solution work?

Just in Time and Power User

Tabbing navigation is a common way for advanced users to interact with websites and applications. This behavior is especially true for users who have to work with other interaction heavy applications like spreadsheets and text editors.

Slack acknowledges that using the keyboard as a navigation mechanism is more comfortable for a subset of their users. Slack offers other mechanics and alternative keyboard inputs to help this group of users.

Unfortunately, there are not many opportunities in the user journey to teach customers about these inputs, so Slack cleverly chooses to do it when it detects that a user is comfortable with tabbing navigation.

This contextual prompt helps specialized users to learn about useful features without interrupting other groups of users who are less likely interested in these particular features.