Case Study: Build a warm user on-boarding for Captain Feedback using GIFs on Slack
Informing the users about how to use an application for the first time is hard. Doing so using a conversational interface is even harder. You can only prompt so much information.
How might we confirm our hunch about the on-boarding problem? How might we make sure our new users understand the value of the application and how to use it?
This case study is about Captain Feedback. It’s a Slack bot that facilitates quick structured micro-feedback in teams.
Why did I design this?
The initial problem was located just after a user installed Captain Feedback on their Slack team. I identified the problem first in our analytic platform. The 3 things I noticed were:
- Users did not engage with Captain Feedback.
- Users typed “help” for their first interaction.
- Users asked questions to the bot such as “what can you do?”
The main goal of the project was to improve the on-boarding. It needed to be warm / welcoming and to communicate the value of Captain Feedback : facilitating timely and structured feedback in teams.
Who did I design for?
The users of Captain Feedback are professionals who are using Slack as a way to communicate as a team. Majority of users install Captain Feedback in their teams to promote the culture of giving and receiving feedback. A small minority of the users are “bots enthusiasts” and just want to try out the bot.
While the size of the teams are small, both startups and large companies are installing Captain Feedback. Some of the teams work remotely.
As I worked through the project, I noticed that they were 2 types of users:
- The user who installs Captain Feedback.
- The user who talks to Captain Feedback for the first time.
What was my role?
I conducted the entire project with my co-founder Greg from research to prototyping and testing. Greg focused on the data analysis while I focused on the implementation and testing. We both worked on the user research and ideation.
The design process
Validating the problem
The product was pretty much at the MVP stage. From our website, a user would install Captain feedback on Slack:
He would then get a prompt inside Slack from Captain feedback. That was it.
At this point, I could feel that the on-boarding was a big friction point for the users to interact with Captain Feedback. And to be fair, we did not put too much effort in this part yet. To confirm the problem, we decided to update the copy to communicate the value proposition. Then we created a little “Trojan horse” to gather insights from the users who just installed the bot.
The user would install the bot and would get asked three questions:
We’ve waited to get more than 15 installs and we got the following result:
At this point we were pretty sure that the message was not simple enough. We also noticed that we were only treating one part of the problem. While user who install Captain Feedback got the prompt, all the other users were still not engaging. They were still asking questions likes “who are you?”, “what can I do?”, etc.
Iterating toward a solution
While text is a great way to convey a tone of voice, it’s not a warm welcome. As a GIF lover and power-user, I always use GIFs to convey emotions to my colleagues when I use Slack.
I created a GIF that would appear in the conversation not only for the users who installed Captain Feedback, but for all the users who interacted with him for the first time. This is a great medium because unlike a video, it auto-plays and catches attention right away.
The idea behind the GIF was to emulate the first time you meet someone: “Hi, I’m Antonin and I do Product Design. I can help you by doing XYZ and this is how you can reach out to me”.
“A good GIF, and anything is GIF-able these days, captures just enough of a specific moment to illustrate emotion yet leaves enough out to spark your curiosity. It’s a beautiful balance of amusement and wonder.” Gizmodo
I did a first version to see what it would look like in the context of the Slack Application. I sent it to a few colleagues to get their feeling about a GIF with text (speed, size of font, visual design):
My colleagues enjoyed the concept of the GIF. They wanted something more welcoming and impactful though. They liked the pace but thought it was too big in their screen. In fact it was so big on their small screen that they could not even see the text below it.
I took their feedback and I created a simple series of images. I put them together to create an animated GIF. The result was the following:
I then asked a few users about it to get some first reactions:
The value proposition was not communicated well enough. I did a final iteration before the testing:
I now had a GIF that emulates a first meeting with a person. It is warm and welcoming and it communicates the value of Captain Feedback.
Testing it live
I implemented the solution and tested the same question to see if it had any impact at least for users who installed Captain Feedback:
I was really happy with the results. Out of the 17 answers, all the users clearly understood who was Captain feedback, what it could do for them and how they could talk to him.
As for the users who talked to Captain Feedback, it is hard to say if it led to more engagement. In fact, we were changing other features of the product at the same time.
As a good proxy, I did notice a strong decrease in the number of “help” requests:
Since we did not have anymore friction at the on-boarding stage, we decided that the solution was successful.
What did I learn?
It’s easy and fast to iterate with a text-based only interface.
I feel like the copy of a visual design might appears as secondary for some designers. When it comes to conversational interfaces, it matters. It matters a lot. Because it’s “only” a text, it’s easy and fast to implement a change to see if it helps your design. To do a lot of the testing in Slack, I just had to copy and paste my text to get immediate genuine reaction. I did not have to write code or set up an interview. I would just send a message to a few users pretending to be Captain Feedback. I could see what they wrote back to me.
Conversational interface are great for user research.
I enjoyed this concept of “Trojan horse” for user research where I was able to gather insights without disrupting the flow for my users. Since it’s a conversation, it’s easy and time-efficient for them to provide an answer to a question I might have. They also feel more compelled to tell me certain things than if they were having a conversation with me face to face. I recommend you to read what the folks at IDEO are doing with chatbots and prototyping: Chatbots: Your Ultimate Prototyping Tool
When the interface is a constraint, think about all the possibilities of formats and contents.
When I face a “text-heavy” content, I always tend to shrink it as much I can. But sometimes, it’s just impossible to do so without removing too much information. For the on-boarding process and the info I wanted to share with our user, it was the same dilemma. The Slack messaging platform can let you post a long text (not like Twitter), but how likely is it that someone will read everything? Slack also lets you use basic text formatting and emoji. Those are great to put an emphasis on something, but it’s still more information. I found the GIF to be a great medium to communicate in this type of interface. It plays on it’s own and it grabs attention. This is why GIFs got so popular in messaging applications. Next time I’ll have a “text-heavy” content, I’ll make sure to consider a simple animation as an alternative.
If you are interested in promoting timely and structured feedback for your team, please visit and install Captain Feedback for free over here: http://getcaptainfeedback.com/
Want to read more about conversation interface: Chatbots: What’s the real impact behind the hype?
