Slackbot is getting an upgrade

When I first began using Slack, I loved it. I loved that people I respected and aspired to be like loved it. I loved its design, its friendliness, how I felt compelled to read about it and rave about it and recommend it to everyone I know, even if they technically had no use for it.

I realize this love, as love often does, has blinded me. Don’t get me wrong — Slack is a great product that I really admire. But it is for this reason that I have challenged myself to take a more critical view and — while acknowledging Slack’s successes — identify its shortcomings and potential for improvement.

Disclaimer: I am not affiliated with Slack; this is simply a hypothetical exercise I’ve completed as part of an application to the KPCB design fellowship.

Identifying the potential for Slackbot

Of course, my own perspective is only my own perspective, so I began by having discussions with other users.

People had various gripes: some didn’t like the colors; others did. Some had trouble distinguishing hierarchy; others didn’t. Many users I interviewed had one common confusion: they didn’t understand the “point” of the robot sidekick that called itself Slackbot.

“Ok…so is this the help desk or the mascot? What does it do? Is it supposed to talk back?” — My confused mother, a first-time Slack user

Slackbot is one of my favorite features because it’s cute, friendly, and can breathe a little life into any conversation. Though, as much as I may want to anthropomorphize Slackbot, it doesn’t make sense to design this feature as if it were human, as another messaging interface.

Here’s why.

  1. Slackbot is not a reliable communicator. It even admits: “Slackbot tries to be helpful, but is only a bot, after all.” Okay…cute, but if it can’t reliably communicate, why is it designed as a conversation? Rather than clumsily try to coerce this bot into answering my questions, I’m more likely to go directly to the guides for help.
  2. Its purpose is inconsistent with its design: it also designates the “message area” as a personal scratchpad. At first, I thought this was odd, but could be a handy idea. As I used Slack, however, I totally forgot it existed. Why would I keep my notes somewhere that looks like another conversation? And why does it look like a conversation if it will never truly behave like one?

Digging a little deeper, I found Slackbot’s official description that assures me it will message me periodically with “help, daily summaries and a few other things.” Sweet. Yet, I’ve never received such messages from my Slackbot DM unless I specifically requested “/help.” Granted, I’m only involved in low-activity teams, but I still expected something. I even tried once, to no avail, to activate this “daily summaries” myth:

Hellooooo? Anybody home? Am I even supposed to be talking to this thing?

As a help center, it can’t even respond to keywords for information it’s supposed to provide. As a scratchpad, it feels awkwardly re-purposed and doesn’t integrate well with the rest of the app. Since I don’t use it for either of these functions, Slackbot needlessly occupies prime real estate at the top of my DMs without adding value to my experience. Aside from its cuteness factor, of course.

Other users I interviewed hadn’t even explored the Slackbot potential. They assumed it was simply there to brand the platform. Less of a Siri or Clippy, more of a Snapchat ghost or Reddit alien. And that’s fine. But after my initial research, I saw so much more potential to augment the Slackbot experience and better articulate its functionality.

What if Slackbot was actually helpful? Instead of act as some sort of messenger-helpdesk-scratchpad hybrid, what if it clearly laid out its functions for users to understand? What if it consolidated my mentions, starred items, links, and contacts from the rest of the app in one easy place? What if it explained how to maximize the use of integrations based on my conversations? What if it provided context for my personal notes: directly linking them to specific messages in public channels?

“What if” is why I’ve decided to…*cue dramatic music*…redesign Slackbot.

My design process

I rooted my process firmly in user research and provisional personas. I felt it was important to approach my design decisions from multiple perspectives as Slack has a diverse userbase.

Though “What would I do?” is always at the back of my mind when designing, WWRD and WWVD became my new mantras. So, I asked myself and my two imaginary sidekicks: if we could do anything to make Slackbot 2.0 meet our needs, what would we do?

We brainstormed.

  1. Consolidate random buttons — one hub for everything. Mentions, starred items, reactions, team directory, tips, integration recommendations, credits, notes, links, to-do lists, etc.
  2. Some sort of tool that briefs users if they don’t want to be constantly disturbed, but still want to stay informed on important updates at a glance
  3. More management/organization done by the system to relieve people of these tasks
  4. Directly link particular messages to particular notes or due dates
  5. Organize notes into different categories based on purpose
  6. Add a new note, etc. within the hub or directly from another message
  7. Utilize natural language processing to maximize the use of integrations, etc. based on conversations

Etc. etc. etc.

“Etc.” in this case roughly translates to “I’m too excited to actually articulate these thoughts” aka I needed to visualize them to establish some tangible grounds to build upon. Ohh yeah, it was time to break out the sketchpad.

My preliminary sketches ft. espresso-fueled notes as scattered ideas came to me
A lot of this was trashed, but it helped me visualize what Slackbot 2.0 wouldn’t be.
Sample view for drafting a note

Ok, Slackbot 2.0 was beginning to resemble something. Sketching is a super valuable step in my process because it enables me to get my ideas out of my head and onto paper. And let me tell you…when you don’t have a team to confer with, a sketchpad is a great listener.

The more I sketched, the more I realized my designs looked familiar. But of course — feeds! Feeds everywhere! Alas, the “newsfeed” has officially penetrated whatever part of my subconscious is influencing my inner designer. I’m ok with it. What do they say — “good artists copy, great artists steal” ? Not totally sure if I should credit Picasso or Steve Jobs or someone else, but it makes a point. In this case, utilizing the “feed” in a time-conscious app that continuously provides new information seemed to make the most sense. Now it was just about implementing it to its fullest potential: stealing, not copying. Thus Slackbot 2.0 became Slackbot Feed.

Rather than supply info from people you follow, Slackbot Feed would be totally curated by you. It’s a place to file away important items to revisit later, without interrupting your workflow. It’s the personal assistant you always wanted, with a twist: it already reads and understands your Slack conversations and can recommend taking particular actions based on keywords. It’s already been trained.

Yes…finally, I was satisfied with how Slackbot Feed was molding itself. It was time to fire up my laptop and work some digital prototyping magic.

Slackbot Feed at a glance

Usually I use Sketch for UI/UX design, but I decided to try Keynote this time to make the most of its interactive prototyping potential. I was impressed; with a few workarounds I could achieve almost everything I do in Sketch.

D’aww…someone looks eager to help!

I drew the new icon for Slackbot Feed in Illustrator. It borrows its “look” from its predecessor, but is shaped as a circular button with larger eyes.

Because I’ve moved it from the DMs column to its own button at the top, I wanted it to still be discernible at a small size and stay consistent with the other circular buttons.

It was important for me to also maintain the original friendliness of Slackbot and invite a sense of approachability and intrigue to encourage users to explore this colorful button. Exploration is the best way for users to understand how Slackbot Feed works.

When users open Slackbot Feed, the background conversation blurs to indicate depth and redirect focus while still hinting at background content. It also behaves as a navigational element; to return to the same conversation, users can just click anywhere in the blurred area as if they were “refocusing”

Slackbot Feed opens like other drop-down menus. It has a feed of items that are most important to you that constantly updates in real time. But wait, there’s more! It organizes these items (messages, notes, agenda, contacts, reading list, and Slack tips) in designated areas and filters the feed according to which you select.

Users can immediately filter the general feed based on 6 major categories

I decided to structure it this way because I realized users would typically have an intended path when opening their feed. This makes getting to their destination clearer than, for example, endlessly scrolling or trying to conjure the perfect search terms.

Trying to remember what time Dwight wanted to meet for lunch today? Check; it’s in your agenda.

Intrigued by that article Pam posted, but don’t have time to read it now? Check; add it to your reading list.

Want to reference the message that made you jot down a particular note? Check; it’s directly linked to your note.

Trying to figure out what these “Integrations” are that everyone is talking about, where you can find them, and which ones will add the most value to your team? Check, check, check.

Slackbot Feed recommends taking particular actions based on keywords and enables its users to filter and notate conversations according to their personal priorities. Without leaving Slack.

And, of course, everything is 100% searchable.

Users can add anything to the feed by clicking the “Compose” button and using the above format

One of my major goals was to ensure Slackbot Feed’s design united seamlessly with the rest of the app. In every design decision, I concentrated on how Slack currently looks and behaves and used that as the inspiration for Slackbot Feed’s model. I followed the premise that the less a user must re-train herself — that is, the more intuitive the experience, the more effective the design.

Many of these features are better understood through demonstration, so I present…

The Slackbot Feed prototype demo

Check out the following demo of the desktop app in action, narrated by moi:

Download the entire Keynote file here to play with it yourself.

Reflecting on a few things I learned from this challenge

  1. Collaboration is really, really important. While working independently has its advantages, there were many times I wished I could turn to a partner to get a thoughtful second opinion. Siri barely even tried…typical.
  2. To get better at design, reading about it is just as important as practicing it. I read some fantastic pieces (and more) on Medium while doing research for this challenge that really helped me consider other perspectives when Siri just didn’t have my back.
  3. I had to keep reminding myself that although Slack seems like it’s just trying to selflessly make workplace communication more “delightful,” it is a business and like all businesses, it must make money to continue to provide its services. Therefore, all design decisions either must attract new paying users or impress current users enough to refer new paying users. Or somehow generate money. If I’m to be an effective designer (or, perhaps eventually a PM) it’s essential to recognize the realities of business often rule design.
  4. I’m really great at stumbling over my words when I record myself. (I guess it’s a good thing I’m not trying to be the next John Madden)
  5. Keynote lets users input custom slide dimensions. Of course, I learned this after the fact, but it will be useful next time. More pixels = happy designer. (well, no pixels is ideal, but you get the point)
  6. It’s easy to critique others’ work; critiquing your own work is another ballgame (this I knew). But what’s REALLY difficult is critiquing your own work directly after you’ve done it. This is an essential skill to have in order to quickly reiterate on a tight timeline. It’s something I intend to work at.
  7. I’m definitely using Parks and Rec characters for my next challenge.
  8. I finally feel like I’ve found what I want to do at this stage in my life. This is totally it and it’s the best feeling. I can’t wait to learn more!

Appendix: This is intended to be a first round proposal for an alternative default Slackbot that comes installed with the software. I recognize there are many ways for Slack teams to customize the bot experience with add-ons and while I’ve researched many, I don’t know for certain if something similar already exists. In any case, I envision this Slackbot Feed proposal would partner with custom add-ons in the same way Slack does now, with perhaps potential for more depending on the function.

Additionally, I welcome any commentary to generate further discussion! After all, (1) this is an ambitious overhaul that has (2) been largely stuck in my own head until this point. I’ve barely had time to appropriately assess it myself. In fact, even reading over this post has sparked some new ideas — but I have to stop myself somewhere. And finally (3)…I’m new to this and would really benefit from the feedback of more seasoned designers. So, consider this post an opening statement, rather than a closing one.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.