Storyboard how each interaction looks

Create a storyboard of your app's interactions before you start coding it. It's a great way to stay user-centric and provide the most valuable and pleasant experience possible. Keep your goals and audience in mind when designing these interactions.

Keep text segments bite-sized and conversational

People don't read big blocks of text. They do read short ones.

Make use of Slack's UI elements

UI elements like buttons, attachments, and menus give you the flexibility to treat every message your app sends as a canvas. If you're having trouble keeping your messages short, think about whether there's anything that would be better represented by a button or an image.

UI element buttons

When using Slack's UI elements, you'll also benefit from the work we've done to optimize them for everywhere people connect to Slack— on mobile, our desktop client or the web— and we'll make sure that your content looks great.

We have a whole section on formatting messages to make them look great and stay readable. Beyond that there are a few more things you'll want to do:

Pick sensible default options

Save people work wherever you can by minimizing the choices they have to make. When you give menus and buttons good default values, you decrease the number of choices they have to make from many to just one— yes or no.

Say your app helps people buy coffee. Instead of presenting a full menu of choices every time someone orders, you could make the user's last order the default option. In the best case scenario, this reduces the coffee order to a single click.

Messages have a lifecycle

Users will be interacting with your app asynchronously. They may begin a task, then get interrupted- and your app should plan for that. Interruptions or periods of inactivity may or may not signal a loss of intent on the part of the user.

Decide whether anything in your workflow is time-sensitive. Should someone be able to jump in on the task again at any time? Should some content expire or need to be re-done? Make a conscious choice about the lifespan of your message.

Clean up after yourself

UI-heavy messages are great in the moment you receive them: they're easy to read, good to look at, and understandable to interact with. They also take up a lot of space on a person's screen.

In your storyboard, think about what a person will need to remember about their interaction with your app when they come back to it later, at the end of the message's life— or after an exchange of several messages. Do those buttons and menus need to stick around, or can you condense the message down to a basic text record of what happened? Be considerate and update your message after the interactive portion or the conversation expires.

Tidying up after your app goes beyond how your messages look. Be sure to also read the section on being a good citizen inside Slack.

Conversation, button, or slash command?

Storyboarding is a great way to help you figure out the best flow for a given interaction in your app. You want people to be able to get work done efficiently. Put yourself in your user's shoes: for the task you're trying to help them complete, will it be fastest for them to do it by calling a slash command, by clicking on buttons in a message, or by sending short messages to an AI-backed bot?

There is no one correct answer. There may be a different answer for each user story (e.g., admins should be able to approve requests in Slack; users should be able to get help from us when they need it). It is always worth the time to explore different possible ways of guiding a person through getting this work done, and picking whatever is best for your end user.

Tools

Storyboard your app with these templates, including design elements for Sketch and a PDF.

A partial view of the design templates.

Was this page helpful?