Agorapulse

Better craft, personalize and schedule social media reports

Keywords

SaaS platform, Social media, Marketing

Team

1 PM, 1 UX, 5 full-stack dev, 1 QA

Lead

Lucas Lengagne (Lead Designer)

Time Span

2 months (Sep - Nov 2020)

Location

Paris, France

Contribution

User calls, Pain point identification, Ideation workshop, Wireframe, Design reviews with lead designer, Prototyping, Design system Update

Before & After.png

Agorapulse is one of the top-rated social media management platforms that enables agencies, businesses and marketers to manage their social media messages, schedule and publish content, and get stunning reports all in one easy-to-use dashboard.

At Agorapulse, designers work imbedded in small multidisciplinary teams. I worked on the 8-person report team and I (re)designed the user experience to improve user satisfaction and fuel product growth.

Context

  • 🤥 Are you overwhelmed by pulling the right metrics to measure? 

  • 🥱 Do you spend a lot of time manually creating and exporting custom reports? 

Currently, you can use Power Report add-on to customize your social media reports~~

Agorapulse Social Media Report.jpg

Custom report let user build reports based on metrics which matter most to them. It is part of Power Report add-on, a set of advanced analytics and reporting features.

XXX clients have activated the Power Report add-on since its release in September 2020, generating XXX MRR! 🥳🥳🚀🚀

(Product metrics are strictly confidential, for more information, let's talk during the interview!)

However, the experience is sometimes frustrating 😢 ...

1️⃣ Users cannot track campaign success

on the specific label(s)

2️⃣ Users cannot re-order profiles

within the custom report

3️⃣ User cannot select the sections and options

for each social profile easily

4️⃣ The entry point of automating scheduled exports

is hidden and nonituitive

👉🏻 We need to make it easier for user to create custom reports the way they want.

Adding the Label Report and improving existing reports are our Product Roadmap priorities for Q4 2020 📈

User need validation

Need validation1.png
Need validation2.png

Potential Needs

It’s a top requested feature based on our customers feedback, which means it's a high priority for our team.

Competitors

Sprout Social and Hootsuite allow user to create Tag Report, providing a better understanding of campaign effectiveness.

Co-Design Session

A 2-hour workshop is conducted to review our existing report creation modal and see how to improve so that we can create the label report.

GOAL

Define the steps and flows for the Label Report creation. 

PARTICIPANTS

6 cross-functional team members

  • Voice of the customer: 1 Lead designer, 1 Junior UI/UX designer (facilitator)

  • Business: 1 Head of Product, 1 PM of Report Feature (facilitator)

  • Technologists: 1 Head of Engineering, 1 Full stack software engineer

THE WAY WE RUN THE PLAY

  • Alignment (5 min)

  • Crazy 8’s Brainstorming (2 min per user flow)

  • Presenting ideas (3min max/participant) 

  • Proposal challenges and Group-thinking (15 min in total)

  • Dot-Voting (10 min)

WechatIMG130.jpeg

ACTIONABLE TIPS

The workshop went well as we achieved the desired results. However, there is still something to improve:

1. Ensure that the context is clear 🔬

Since I didn’t provide enough hint or guide, team members seemed confused and wanted support during the brainstorming. Making decisions around areas of focus and priorities is the name of this game. It’s good to have a more-detailed intro (context, user research or exploration) to help people get in the right mindset.

The format of the workshop was optimised after Retrospective with the design lead 👇🏻

Optimised.png

2. Be open to all kinds of ideas 🧠

Even though we set the "no criticism" rule, some people still seemed hesitant and felt pressured to come up with good ideas.

A great way to get creative juices flowing and get different perspectives, is to switch the criticism mode off and create a relaxed atmosphere. Whenever I see a participant hesitate to put something up or feel awkward from the prolonged silence, I'll encourage them and remind them that all ideas, even wrong or stupid answers are welcome.

3. Listen better and keep record 👂🏻

Discussions can become very fast-paced, so be a good listener and have a good notetaker(s) who can document it. keeping track of what was discussed and what conclusions we came to will make further action much easier to plan. 

Outcomes

Label report can be considered as a type of aggregated report. Therefore, we will integrate it into Custom Report creation flow.We will take the opportunity to improve the custom report creation modal by integrating user feedback.

Solution to Problem 1

Create a new feature LABEL REPORT to provide visibility into label activity

Before & After-Select report type.png

User flow

For each profile, the user will select one or several labels. Label(s)' selection will be done at the same step as the profiles’ selection.

User Flow.png

High-fidelity Prototypes

Solution to Problem 2

Offer an easy-to-use Drag-and-Drop

(*Specific to Label report, Aggregated and individual report, Individual report)

Before & After-Select Social Profiles.pn

UX propositions "Add Social profiles"

Proposition1: Drag & Drop Side Panel

➕ The profile order can be defined at the beginning

➕ More engaging & interactive

Proposition2: Profile selector

  • Users need to adjust the profile order on the right after checking the box

Since the Side Panel is a reusable component in our design system and it doesn't support the drag & drop gesture, in order to maintain consistency across different functions (the PUBLISHING as well as the INBOX), the 1st proposition was abandoned, following a conversation with dev team.

Solution to p1.png

Defining UX patterns for Drag & Drop across components

Design systems don’t just create consistency across UI components, they should also advocate for consistent experiences. We defined the drag and drop interactions to ensure that they look and feel consistent across components within the interface.

Solution to Problem 3

Reorganise the sections and options

Before & After-Section Aggregate + Indiv

From Accordion to Horizontal scrolling bar  (*Example: Aggregated report)

User needs to select the sections for each profile during the creation of aggregated report.

Accordions shorten pages and reduce scrolling. However, it does hide content from users and it’s important to account for a user not noticing all customisable sections. Also, accordions cause a sudden UI-shift.

Based on common and critical use cases for our audience, the accordion is not the appropriate widget, we mignt need a different navigational approach.

(P.S. We removed the stepper on the left, which means we no longer have vertical navigation throughout, we don't need to go with accordions to keep the pattern same)

Solution to p3 (1).png

UI Explorations on "Sections and Options"  (*Example: Label report)

Unstructured extended lists have a low level of legibility, so users can’t scan it quickly and they need to make a significant effort to distinguish the metrics they’ve been looking for. 

To better orient people within the interface and save much effort for users, we set effective visual hierarchy and better structured/organized UI elements.

Solution to p2.png
Nav.png

With proximity (Gestalt principles) and contrast (size and color), we supported a slight hierarchy of the content and harmonically divided them into subcategories.

To make UI components all noticeable, digestible and visually pleasant for users, we also gave them the right amount of negative space.

Answer to user need "Add a glossary to the reports"  (*Example: Label report)

"It would be helpful to have an additional slide within the reports with a glossary of all the terms and metrics used" some users suggested.

However, what people SAY isn’t necessarily what they WANT. When digging into their motivations, we were then aware of the real reason behind: Users are not sure about the appearance/meaning of each section until far later.

Therefore, we can fulfil their need better: on hover, enhanced tooltips (including graphics) concisely explain the term of certain sections and allow users to have a general idea.

Solution to Problem 4

Clear entry point to improve feature discovery

Before & After-automate scheduled export

Rethink the Navigation bar