Amplify + Hootsuite mobile app integration
Amplify used to be a standalone product created by Hootsuite Labs and this project aimed to integrate the Amplify mobile app into the Hootsuite core app. Throughout this presentation, you will be able to understand why this integration was needed, what were the expected businesses and users outcomes, what strategy was taken to make this integration and how it was executed.
Note: the images below come from a slide deck that I used for a job interview. Some of the slides are clickable to expand the image.
Throughout the entire Amplify integration process, I was the only designer working on the end to end design process with the support and collaboration of PMs, devs, copywriters, a researcher and a few other designers. Here’s the detail:
Introduction
To start off, what is Amplify? In a short way, it is a product that helps an organization to promote brand advocacy and social selling. Think about Mary Kay as an organization. Mary Kay has people that represent the brand and sell its products. These people are usually self-employed and use their personal social networks to promote Mary Kay products and help with their sales. They are called Social Sellers, our primary persona. These social sellers, therefore, need to post relevant content to their audience that are approved by Mary Kay. How can they easily find relevant content approved by Mary Kay to post on their social networks? This is when Amplify can help. Mary Kay marketing team creates the content and upload into Amplify so that the Social Sellers can grab the content from Amplify and share them to their own Social Networks. That way, Amplify also helps Mary Kay to promote the brand and helps the Social Sellers to look active on social and bump their sales. Other examples of Social Sellers are financial advisors, realtors etc.
The biggest problem with Amplify mobile is that the features available don’t really give to Social Sellers everything they need to be successful in social. Amplify only allow Social sellers to browse content created by their organization so they can share to their own social networks. If we integrate Amplify into Hootsuite mobile app, that would give to Social Sellers the option to create their own content from scratch to they can stand out among their competition, engage with prospects through Inbox and monitor post performance to replicate the success of a specific post.
In summary, we have 3 big problems that the integration would help to solve:
My design process
My design process at Hootsuite is very similar to the Zendesk Triple Diamond. Like Zendesk says:
“The third diamond marks the start of the iterative Agile cycle. We treat the design concept as an initial plan we’re refining and filling in more details at each sprint as we discover more. That’s when engineers are investigating the technical solution while designers are creating prototypes and conducting usability tests. Research and design should happen throughout the cycle. “
I can’t agree more with the idea of the third diamond. All I had to do to was tailoring their third diamond to reflect better how I work at Hootsuite:
And going a bit deeper and more specific about this project, the process was split in two big phases: the vision phase and the roadmap phase. The roadmap phase was split into 4 milestones and each milestone had 3 months period.
Discovery and Defining
As mentioned before, Social Seller is our primary persona defined by the research team awhile ago. This helped me to understand who is they are, what is their sophistication level in marketing, what are their motivations in social and main challenges. Also what kind of Archetype and Orgsona structure they fit in:
Having a well define persona is super valuable but it wasn’t enough to give me all the answers I needed to move on with the vision of this integration. I needed to understand better how Amplify users interact with the mobile app, their frustrations, what makes them coming back etc. I had a few insights from past interviews, but they were not enough either. So I decided to interview a few Amplify users and here’s the summary:
A few highlights from the most common answers:
After synthesizing the results, I used the finds to reflect it on the Social Seller’s day-to-day journey:
The vision
Based on the user insights, I worked on a low-fidelity vision of how the integration would look like. You will see below some principles that I used throughout this project. These principles are straight connected to the research finds and personas. The goal of this vision was to act as guidance for myself, since this is was a one-year project with lots of different phases, and to also help the team to visualize where we want to go and how we could split the work into these different phases (we called them ‘milestones’):
And then, the strategy work. The image below is not very self-explanatory, but it is just to give an idea of how the milestones were divided (they were separated by colors):
A deep dive into the milestones phase
You can see below the process for each milestone. A few notes about this process:
A light discovery phase was needed on each milestones to fill up some gaps
Depending on the milestone, the Usability Testing was either moderated or unmoderated
The Owls release is an internal release. After the 2nd milestone, internal peeps could provide feedback on the go. The feedback period last until all the milestones were complete. I worked on some improvements and testings from the previous milestone in parallel with the current milestone
By the time I completed this Portfolio, the project was partially released to the public (only 30 organizations had early access)
Here’s a close up from the 1st milestone (M1). I used defined user tasks (some from my research and some from existing Hootsuite documentation) to help me to capture the functionalities needed for the user to complete these tasks:
Throughout the solution phase, it is extremely common to come up with a few different design solutions for a specific workflow (diverge moment from the Triple Diamond). What did I do to pick a direction and start converging towards a single solution?
I collaborated with other designers to get their point of view
I refered back to the data to find any qualitative or quantitative insights that could help me to lean towards a specific solution
Validated that solution with users
In some cases, when the idea is too broad and there are still many questions to be answered, a Concept Validation would be ideal, but that was not the case for this project.
Here’s is an example of how I took the decision when I had too many directions. This is social network selection workflow. I had three options to go with and each one of them had their advantages and disadvantages. Some covered more use cases than others, but would also required more or less dev effort.
The last option was the chosen one based on data and also based on the principles defined for this project: the experience needs to be simple and quick. However, the data could be biased. Testing the usability and gathering feedback after the release will tell us if that was the right direction or not.
Another example below is the ‘share now’ workflow. When user chooses a social network to share the post and tap on "‘share now’, the first option closes the bottom sheet right after the tap, allowing them to keep browsing more content to share. The second option shows again the social network list after user shares a post, allowing user to select a second social network to share the same post to.
The first option seemed to be more relevant to the user because user will be more likely browsing more content to share than sharing to a second social network.
Here are some of small improvements that made big impact. The previous app interface was confusing and counterintuitive. A big example was using the social network colors on check marks to indicate that user share a post to a specific social network. It is nearly impossible to know what social network the post was shared to based on the color because Facebook, LinkedIn and Twitter have very similar colors. This is also not accessible.
A video of the Share Post workflow from the internal release:
Usability testings were done on every milestone. As mentioned before, they were either moderated or unmoderated depending on what I was going to test. Usually the unmoderated one was quicker and more efficient but it was tested with people who never used Amplify before, therefore it could only be used if user didn’t need a lot of context. And the reason why I used people that never used Amplify before is because it is really time consuming to recruit real Amplify users (Social Sellers) and this project was very tight on time. For the moderated testing, I used internal peeps like Hootsuite recruiters who are an example of our secondary persona called “advocates”. The moderated ones were used when I needed people who already knew Amplify and used it before. But I needed to keep in mind that they are a secondary persona when testing with them and how this could affect on the testing results.
Delivery and validation
After 2 milestones, the integration of Amplify into Hootsuite app was released to internal peeps so we could gather feedback. From that moment until to the end of the 4th milestone, internal people were part of several new releases. Every new release, they were notified through our internal communication channel and requested to provide feedback.
The biggest highlight of these internal releases was a feedback from several people saying that they didn’t know if they were sharing the right content 😱. Even though an Usability Testing was done prior this release, I didn’t capture this problem. Probably because a when user pretends they are doing something, they care less and pay less attention. When things get real, they start noticing things they didn’t before. And sharing the right content is very important on real life and not so important when you are just simulating.
After talking to a few folks that provided same feedback, I understood why the UI was causing confusion and worked right away on a solution that was also a low dev effort. The new design was released on the following sprint and very well received.
Below is the Content Feed in production after fixing the issue. No more confusion around “which post am I sharing”?
Here’s a video of what is in production related to Topics. User can subscribe and unsubscribe to topics. User can also navigate through related topics from a specific post.
This video shows Amplify workflows integrated with Hootsuite workflows:
Last but not least, Amplify is fully accessible. Here’s in example of accessibility specs:
Wrapping up…
I wish I could bring real numbers and user’s feedback in this session, but this integration was released to a small portion of our costumers (30 organizations) 1 week before I left Hootsuite. However, I can share internal peeps feedback:
Thanks for reading!