Add a Feature to Slack

A school project; adding a message reminder and saving a workflow to drafts in Slack ・ 2022

Overview

This project was part of a school assignment where we were tasked with selecting a website or product and adding a new feature to it. Given my current role on Slack's customer experience team and my aspiration to transition into design, I chose to focus on Slack.

Objective

To design features that enhance Slack's usability by reducing user errors and improving workflow efficiency.

The Solution

I developed two key features to address these issues:

  1. Message Reminders: Set reminders for users to review their work before sending a message, triggered by specific actions like adding attachments, misspellings, using markup, and exceeding word counts.

  2. Save Workflow to Drafts: Automatically saves workflows to drafts, allowing users to manage tasks efficiently, even when they are short on time.

These features aim to support users in our fast-paced work environment by minimizing mistakes and streamlining their work processes.

Constraints

  1. Slack already has a set UI kit and branding so I needed to create these features to seamlessly integrate into the current visual design standard.

  2. I had 80 hours total to finish the project.

Message Reminder prototype

Save a workflow to drafts prototype

Research

Goals

The project began with the hypothesis that an internal Polling feature would add value to Slack by eliminating the need for third-party apps like Polly or Simple Poll. Additionally, I hypothesized that adding a feature to save workflows to drafts would be beneficial.

During my research, I discovered that a polling feature might not provide the value I initially thought. Instead, I uncovered a more pressing need.

My main goals were to:

  1. Identify hidden pain points users experience with Slack.

  2. Validate my hypothesis by understanding user impressions of the proposed polling and workflow features.

Competitor Analysis

To understand the market and user needs, I conducted a Competitive Analysis to identify popular features and gaps in user satisfaction. This analysis was done twice: first for polling features and later for message reminders.

Key findings from the analysis included:

  • Customizability is highly valued by users.

  • Competitors like Microsoft Teams and Google Workspace offer warning messages for emails sent outside the organization, but lack customization options for chat messages.

This presents a unique opportunity for Slack to introduce innovative and customizable features, such as message reminders, to enhance user experience.

Provisional Personas

After I did initial market research I had a better understanding of Slack users so I created provisional personas.

I created 4 provisional personas:

  • “The Executive” problem solver and works fast

  • “The Volunteer” looking to connect with their community

  • “The 9-5er” looks for fast resolutions

  • “The Student” collaborates regularly and needs easy solutions

Survey Findings

I surveyed 12 participants about their use of polls:

  • All participants used polls for fun interactions, primarily in the #Random channel.

  • All participants used the third-party app Polly and found it easy to use.

  • All participants used emojis for quick participation checks or simple questions.

  • Half of the participants preferred direct messages for specific questions.

  • Half preferred using threads for discussions.

Interview Findings

In a Focus Group Interview with 4 participants, I explored their daily Slack use and pain points.

Key insights:

  • Users often worry about accidentally sending incomplete messages and the potential embarrassment of hurriedly editing them.

  • The hypothesis that automatically saving unfinished workflows to drafts would be beneficial was confirmed.

    • 100% found losing unsaved data inconvenient.

    • 25% didn't know workflows could be opened in a separate window.

    • 75% used Slack's "Drafts" feature.

Empathize

User Personas

After getting insight into the needs and pain points of my participants, I created a User Persona to generate an even deeper understanding of what would make work life simpler.

This helped me empathize with the user during the creation process. This also provided inspiration when it came to creating the channels, flows, and users within Slack.

Empathy Map

Next I created an empathy map to continue to explore the unique needs of Slack users like Andrew:

Storyboard

To better understand my user persona, I created storyboards inspired by real-life scenarios from my research participants. This approach helped me empathize with users and identify their common pain points through storytelling.

Define

Consolidate my findings

Research and user empathy led me to develop features to address workplace accidents. While Slack allows message editing and deletion based on permissions, it still lacked a preventive measure. This inspired the creation of Message Reminders. I used a feature map to see how this new feature would fit into Slack's existing system.

Prioritize

1.

Show a warning when a user hits "enter" or selects "send," based on their chosen triggers. The prompt will say: "Are you sure you want to send this message? This reminder is based on your selected triggers."

2.

Message Reminder Triggers

  • Attachments

  • Spell Check

  • Custom Keywords

  • Word Count

  • Formatting

3.

Add a “Drafts” section for workflows. Research Slack’s language and UI elements to understand their approach to automatic saving.

Task & User Flows

I created task flows for:

  • Setting up a message reminder

  • Saving a workflow to drafts

I also developed a User Flow. Initially, I considered placing Message Reminders under Messages & Media but later thought Advanced might be a better fit. Usability testing will help finalize this decision.

Lo Fi Sketches

I decided to draw some lo fi sketches as my lo fidelity wireframes. I made this decision, because Slack is an already established product and most of my visual design would be copy-work.

Sketching allowed me to work as efficiently as possible and only focus on the frames that I would be adding to or changing.

I used this time to brainstorm and develop the wireframes for my features; message reminders and add a workflow to drafts.

Brand Identity

Slack’s branding and UI Kit is accessible and easy to find. They provide a media kit that provides workspace screenshots, as well as their brand guidelines.

Since I couldn’t download Larsseit or Slack Circular as fonts, I did some research and found a very similar font available in Figma: Noto Sans.

I did have to recreate almost all of the icons native to Slack, since I couldn’t find downloadable vectors.

Visual Design

Putting everything together

I used Figma to create the visual design. I was able to get familiar with Slack’s voice and design style during this process, which ultimately helped in solidifying my design choices and weaving them seamlessly into the platform.

Message Reminder Visual Design

This is a reminder that will trigger when you press “enter” or click send, and your message includes one of your selected triggers.

I’ve also added an option to “view triggers” if a user is confused by this reminder.

I chose to put Message Reminders in “Advanced” because it didn’t necessarily fit in “Messages & Media”.

I included the “New” icon to alert the user this is a new feature, and ensured I used Slack’s style to explain the feature.

Here’s an example, when a user chose the triggers “Spell check” and “Word count”, as well as adding certain keywords.

The keyword option is already native to Slack in their “Notification” preferences, which helped to further blend this feature in with Slack’s UI.

Save Workflow to Drafts Visual Design

This is very similar to how this screen already appears during the workflow process.

The changes include “If you leave this will automatically save to your drafts” and I updated the “Leave” button from red to green since you are no longer losing data.

Here the Drafts have been updated to include a Workflow tab.

Everything about the Drafts section is almost identical besides including Workflows.

Note: this was created before “Drafts & Sent” was released

Test & Iterations

Test Objective

I created two prototypes to test each feature and identify any necessary revisions. The goals were to ensure that the features fit Slack’s design style and were easy to understand and navigate.

To test the prototypes, I initially conducted usability tests over Zoom with 3 participants for each feature. I then tested the Message Reminder prototype with 2 additional participants to further validate the findings. I used an affinity map to summarize the results.

Insights

  • Overall users felt that the features flowed really well with Slacks current UI. All of the participants, did not initially know this was a hypothetical feature and had already thought this was included on the platform.

    When they found out these were not features that were currently available they expressed great desire in making them available.

    “I would 100% use message reminders for spell check and word count!”

    “I can’t believe the option to save workflow to drafts is not currently available!”

  • the majority of participants did not, at first, know where to look for message reminders. Their initial though was either “messages & media” or “notifications”.

    Participants also expressed interested in knowing more about the message reminder feature within preferences, as well as more details for “word count” and “spell check”.

  • Participants did not notice the description to save a workflow to drafts. This could use bolding or more indication that this was a feature enhancement.

1st round of tests

2nd round of tests

Product Revisions

Based on feedback, I made the following revisions:

Message Reminders:

  • Created a new category specifically for “Message Reminders”

  • Added more description for word count and spell check

  • Included an example notification in a “Here’s an example” section

Add Workflow to Drafts:

  • Bolded the note: “If you leave, this will automatically save to your drafts”

  • Added a “New” icon

  • Changed the “Leave” button to “Save Draft”

Group 72.png
Group 73.png

Reflection

Conclusion

I was successful in designing a new message reminder feature and save a workflow to drafts feature enhancement for Slack that meets the needs of the target audience while remaining true to Slack’s style.

Learning

One of the most valuable lessons from the project was adapting my idea when my findings conflicted with my initial hypothesis. This taught me the importance of empathizing with the user.

Focusing on two separate features was also challenging, but it helped me stay organized and work efficiently.

Next Steps

With more time, I would:

  • Conduct additional usability tests to confirm the benefits of the changes

  • Interview more people to verify that message reminders would add widespread value

  • Ensure a smooth design handoff to developers and include any needed instructions

Previous

Squiggle
Next

AlteRealms Art