.avif){kind=small}
Integrating the Post-it App with a leading platform for team collaboration
Beginning in 2019, 3M launched several corporate transformation initiatives designed to enhance their digital presence and capitalize on the brand strength of their iconic products.
Although Slack is one of the world’s most popular collaboration tools, the platform lacked an integrated whiteboard. As similar platforms (including Zoom and GoogleMeet) found integration partners, 3M approached Slack with a similar proposal.
The Post-it brand is intended to embody efficiency, creativity, and innovation. The iconic product is synonymous with convenience and organization. From handwritten reminders to detailed project planning, Post-it’s simplicity is what drives its universal utility.
The Post-it team aimed to ensure integration with an external communication tool aligned with the brand's values while still fostering an environment that supports both individual and group ideation.
In an effort to prioritize collaboration, the product team decided to integrate the Post-it App directly into individual Slack channels. This approach merges the collaborative flexibility of the Post-it App with the structured, team-based interface that Slack offers.
Each organization highlighted the key features their product offers to its user base.
With many teams still under COVID-19 travel restrictions, all initial brainstorming sessions took place via MS Teams.
The Post-it team independently developed the proposed user workflows, outlining each action, decision point, and navigation path.
This process enabled both teams to identify potential pain points that would need to be addressed during the design and testing phases.
While the Discovery Phase offered guidance for potential integration, defining the information architecture and designing the user interface presented their own distinct challenges.
Three key areas of opportunity emerged for the Post-it app:
1. Post-it workspace panel: For the user, what is ideal location for the Post-it App's interface within Slack’s three panel design?
2. Slack prompts & commands: What prompts will assist users in creating new boards as well as adding content to existing boards?
3. Post-it capture integration: Considering the limited number of panels, how will Post-it Capture appear within the Slack interface?
In this phase, our focus shifted to user input to ensure the product delivered value and enhanced team collaboration.
Most tasks in this phase were completed in quick succession. While we prioritized rapid iteration, we also scheduled opportunities for user testing.
Specifically, we focused on the following:
We identified 200 survey respondents via UserTesting. We selected participants who used Slack for text-based communication and worked remotely at least three days per week.
The survey focused on how users organize their Slack channel as well as personal preferences for notetaking and brainstorming.
Using insights from the Scoping phase and the UserTesting survey, the Post-it Design Team developed a set of low-fidelity wireframes that showcased potential options for integrating the Post-it App into Slack's panel-based interface.
Initial designs were shared with the Slack team via weekly review meetings.
Both Slack and Post-it’s design teams reviewed the initial wireframes for feasibility. Multiple options were selected and presented to users during 1:1 interviews.
Interviewees were selected from the list of respondents who responded to the initial UserTesting survey.
As discussed in the Scoping Phase, the following emerged as key priorities for exploration:
Selecting the ideal location for the Post-it App’s interface within Slack’s three panel design.
What prompts will assist users in creating new boards as well as adding content to existing boards.
Considering the limited number of panels, how will Post-it Capture appear within the Slack interface
Slack's panel design is characterized by a clean, intuitive layout aimed at facilitating efficient communication.
The Channel List is a set of conversations. Selecting a specific channel or chat, opens the Channel Focus window for that specific conversation.
Slack Desktop: Standard panel alignment
Slack Desktop: Channel List & channel Focus
Slack Desktop: Channel List & channel Focus
Integrating the Post-it App as within Slack’s UI proved slightly difficult as Slack's standalone product does not have to share space with additional panels.
An integrated layout had to provide users with the space to interact with the Post-it panel without preventing users from accessing a channel's activity.
Replacing the Channel Detail panel with the Post-it Interface left users with limited space to work. This was specifically noticeable on standard laptop screens.
Alternatively, replacing the entire Channel Focus panel with the Post-it Interface prevented users from simultaneously viewing the relevant conversation while also manipulating the shared board.
Testing showed that users will only open the Post-it Interface during active team sessions. As such, they preferred to collapse the Channel List while adding a add sizing slider between the Channel Focus and Post-it Interface.
Testing indicated the vast majority of users will avoid using a mobile device for group ideation. However, users cited editing to-do lists and creating reminders as examples of when the Post-it Interface was most likely to be used on the go.
As such, our design focused on ease of movement between the Channel List, Channel Focus, and Post-it Interface.
Slack commands are text-based instructions entered into the message input field to quickly access features within the Slack platform. These commands usually begin with a forward slash ("/") followed by a keyword or action.
As we moved through the initial ideation and development stages, we kept an active list of potential commands. Users described additional commands during 1:1 interviews.
The Post-it Design Team created wireframes highlighting the workflow of the most popular commands.
.gif)
We selected three core commands for the pilot:
Capture, a key feature of the Post-it App, lets users add Post-its to a board by photographing a handwritten note. 3M’s proprietary technology converts the handwritten text into editable digital fonts.
This feature is also available via Post-it's mobile app, thus allowing users to add notes to Slack's mobile interface.
.gif)
Beyond wireframes, the team also created short videos to illustrate various capabilities of the proposed integration.
The following examples highlight key product features.
Users can add, delete, edit, and adjust the location of individual notes within the Post-it Interface panel.
.gif)
.gif)
Post-it to Slack: Highlight individual notes and transfer contents to Slack.
Notes appear as text in Slack’s textbox, allowing users to edit before sending.
Slack to Post-it: Slackbot automatically identifies tasks which can be transferred to the channel’s Post-it board via commands.
Transferred notes are editable and adjustable within the Post-it board.
.gif)
The Post-it Design Team also built short marketing videos to announce 3M's collaboration with Slack.
.gif)
.gif)