Declara mobile discussion
2015 / Product Designer / Android APP
How do we incorporate Declara discussion, a core part of our web product, into our Android app?
At Declara, we wanted to make it easy for people to annotate and discuss anything on the web—think comments and targeted conversations around an excerpt from any article on the internet. But our mobile app lacked a discussion functionality, which was a problem because that was one of our product's core differentiators. Users were clamoring for it, saying that without being able to annotate and engage in article discussions, there wasn't really a point to our app.
I worked with my design manager and an Android developer over one week to come up with a way to incorporate conversations into our Android app.
The Declara app has a 4.8 rating and is currently live on the Google Play store.
Since this was v1 of our mobile discussion, we wanted to build an MVP of the feature to see whether people would even engage with it. Our design stories were as follows:
Allow users to start a new conversation with individuals or groups from within an article.
Allow access to chats that are already going on, in a way that is not intrusive to content consumption.
Keep group chats and individual chats as separate entities—a user is not able to initiate both a group and individual chat from the same conversation.
Should have a similar experience to our web product (i.e. "seen by" behavior, conversational UI).
This was a project in which we only had one week, so I had to cut down my usual design process in order to come out with testable prototypes quickly, as well as depend on the Google Material Design guidelines for a ready-made design language.
User flow overview
Two conversation starter flows were built—one to one (individual) conversation flow and a group conversation flow.
One of the issues internal testing showed the need to address was retaining conversation context - since conversations were centered around the article, the design needed to make clear which piece of content was being discussed. The need to emphasize this was initially overlooked until we tested it with users.
Building a conversation view seemed straightforward enough—however, in doing a comparative analysis and looking at how iMessage, Facebook Messenger and Whatsapp handle conversation UI, I found that they all tackle conversations in slightly different ways (i.e. direction of chat, read receipts, or how content is highlighted).
Using Sketch Mirror, I prototyped several different flows for both individual conversations and group conversations. The prototypes were tested with users we recruited at local coffee shops, as well as university students.