⚡️ Intro
During this case study I focused on iterating on the Slack on Desktop. I followed the Design Thinking workflow during the case study and used the latest tools and workflows.
📅 Timeline & Role
🔨 Toolstack
Communication
Productivity
Research & Ideation
Prototyping & Testing
👀 Questions & Observations
To help me better frame any problems with the product, I began by forming some questions and observations I have about the product. To easily document these I followed the structure [Situation], [response], [problem to business or experience] to ensure I'm aware of users and business needs
When [using slack for work], users [receive a lot of messages], which causes [overload on information]
When [trying to organise your messages], users [can overlook messages], which causes [the problem of missing important messages]
When [using slack for multiple organisations], users [have to navigate through various interfaces], which causes [irritation and feeling lost or behind, because you might miss messages]
🔍 UX Research
To confirm my observations and begin forming a hypothesis backed by data, I created a user survey to form no frill personas and understand the problem space more from real users perspective.
📊 Synthesis
Having shared my survey with users of the product using Typeform, the next stage of my case study was focused on synthesising the data to recognise trends and form a hypothesis.
Initial Observations Survey
Affinity Map
Frustrations with the product
- Due to multiple ways of messaging, group messages, channels, dm's, multiple organisations it can be noisy, tiring, confusing and frustrating to keep track of all your messages.
- Second frustration if you open messages and not respond immediately you can forget about messages, leaving messages without response, creating frustrating
😀 No Frill User Personas
During the synthesis stage of my case study I focused on identifying the different personas who have frustrations with discovering new music. I created no frill personas, focusing on their biography, goals and blockers.
❓ How Might We
During synthesis, I jumped into the ideation phase and worked through the solution design model, identifying users actual behavior, and optimal behavior. This allowed me to form how might we questions to begin forming a solution.
💡 Ideation
To avoid following the first idea I conducted a series of ideation techniques. This allowed me to consider an array of solutions. Following ideation I mapped what could be improved, added, and crazy ideas and prioritized them based on user value, business value, effort and time.
| Selected | Name | User Value | Biz Value | Effort | Time |
|---|---|---|---|---|---|
Prioritisation of certain team channels | High | Medium | Medium | Medium | |
differentiation between general and direct message popup via color or shape can customise even | Medium | Medium | Low | Medium | |
The archiving of information | Medium | Low | Low | Medium | |
How information is displayed as a long message thread | Low | Low | Medium | High | |
The way that important messages are displayed | Medium | Medium | Low | Medium |
| Selected | Name | User Value | Biz Value | Effort | Time |
|---|---|---|---|---|---|
A history overview, to see missed messages
(unresolved message) | High | High | Medium | Medium | |
Notifications if messages are not answered | High | High | Medium | Low | |
have various #filters on different tabs and direct messages in a different area | High | High | Low | Medium | |
Popups
(snooze) for forgotten or important messages | Medium | Medium | High | Medium | |
An indicator for important messages like a flag | Medium | Medium | Medium | Medium | |
Have different colours for key people | Low | Medium | Low | Medium | |
An extra inbox for important (people/groups) | Medium | Low | Medium | Medium |
| Selected | Name | User Value | Biz Value | Effort | Time |
|---|---|---|---|---|---|
Connection with Siri for reminders
(syncing) | High | Medium | High | High | |
AI technology for automatic answering | High | High | High | High | |
Algorithm for filtering important key words | Medium | Medium | High | High | |
a Kanban board of completed filtered messages | Medium | Medium | High | Medium |
✍️ Hypothesis
Having prioritized ideas based on what can be improved, added, or crazy ideas, I wrote a hypothesis that helps me frame the problem for user and business goals.
Users goal Business goal
We believe that by adding reminders for read but unanswered messages and organising messages in tabs users will have a more organised view and forget less messages. This will help Slack to grow their application towards most efficient communication tool.
✏️ Rapid Sketching
Following the creation of my hypothesis I rapidly sketched solutions in lo fidelity. This helped me quickly map and understand the current product and consider options for how I could iterate directly in the product.
Notifications for unread messages
Screens with a notification pop-up & settings
Two type of pop-up screens
Tabs for dm's and group messages
Screens with tabs for separating dm's and channel messages (perhaps even VIP). Second screen has a status of replied / non replied messages. Third screen has a toggle to see either read / unread messages or replied / non replied messages.
🗺 Information Architecture & Sitemap
With a hypothesis defined, I define the information architecture of the product to help me easily plot the optimal user flow and path for a user to complete the task.
⤵️ User flows
With the sitemap and IA defined, I could easily plot the optimal user flow using Miro. This allowed me to quickly and easily understand the decisions users would need to make to complete their goal.
🧻 Paper Prototype
With the user flow defined, I rapidly created a lo-fidelity paper prototype. This allowed me to quickly iterate and visualize the experience without wasting hours in Figma.
*Going through this flow on paper en recording the loom, made me realise that at the end the user should not go back to the home screen but back to the list with non replied messages. This will be updated in the Lo Fi Wireframe
🖌 Lo Fi Wireframe
Creating the paper prototype allowed me to quickly and easily create a lo-fidelity wireframe of the experience directly in Figma. I used a neutral color palette to avoid any decision bias and would use this prototype to get feedback internally.
Autoflow
I used Autoflow in Figma to help me easily map the user flow between each page ahead of converting the pages into a prototype. Adding the iteration regarding not going back to the home screen.