Adoreboard brought me in to work alongside their product team to redesign Emotics, an emotion analytics product used by consultants and agencies that analyses data to provide actionable insights for brands and research institutions.
Before jumping in with the redesign it was important to get familiar with their current iteration of the product and start figuring out the pain points. Emotics was still in beta at this stage and hadn't yet been released to customers but the internal consultants were already utilising it for live projects. They proved to be invaluable for gathering feedback on current weaknesses in the product and discussing new features.
The old version of Emotics suffered from a lack of clear hieracrchy and a confusing UI. Some of the key issues were:
- Difficulty uploading datasets
- Difficulty sorting through uploaded data as this was all done within the sidebar
- Viewing topics and snippets was confusing, with no indication of where to access them or dig deeper for further analysis
- Too much functionality and actions were contained within the small space of the sidebar
Once I had spent time with the current product and gathered feedback on the aspects of the product that needed improved, I started storyboarding and creating low fidelity wireframes of the product.
One of the most important aspects of Emotics is uploading datasets that can then be analysed by their engine to display actionable insights. Originally, this was all done within the sidebar — which was too much functionality for a small section of the app.
One of the challenges with Emotics is that it is a complex product with terminology and methods that wouldn't be immediately apparent. It was important to showcase the value of the product without overwhelming or trapping the users in an onboarding flow that would only frustrate them.
Modals are used to introduce users to each section of the app. Users can take the optional tour, at which point they'll be guided through the key features of that page.
The finished product
Just kidding.. a product is never finished.
One of the interesting things from talking directly with customers was discovering that conventions that you assume would be obvious to the average user turn out to be far from it. One of these such conventions was the "ellipsis menu" that was being used to group dataset actions within a dropdown menu.
After speaking with numerous users and gaining their feedback, it became apparent that this action was too abstract. They weren't aware you could interact with it. So I redesigned it to make the actions more apparent.
As Luke Wrobleski says, obvious always wins.
Redesigning the Adorescore
The Adorescore is a pivotal aspect of the Emotics product. Discussions within the team however concluded that too much emphasis was being placed on it and that the score, by itself, wasn't a key indicator of the data. This was leading to confusion from users who felt that the score was too inaccurate and not reflective of the data. To combat this, I tackled two things:
- Revisit the hierarchical layout to place less emphasis on the dataset's adorescores from a visual perspective.
- Give a visual breakdown of each adorescore that will allow users, at a glance, to distingish if their datasets consists of mostly negative, neutral or positive data.
One of the last tasks I undertook with Emotics was redesigning the brand. The original brand was dated and didn't fit with the new tone of the product.
I also animated the logo for use on loading screens and marketing material.