Making Influitive Challenges more delightful and engaging

After a decade of focus on growth, neglected UX and tech issues plagued Influitive’s customer engagement platform, leading to poor engagement in its flagship feature, Challenges. In 2021, while leading an ambitious project to rebuild the app from the ground up, I had the opportunity to reimagine the Challenge experience to be better than ever before.

My role

Lead designer

Length

Jan 2021 - Late 2022

Areas

Strategy, Research, Design, Launch

Platform

Responsive web

Team

Product Manager x 1

FE/BE Engineers x 20

QA Engineers x 3

Platform

Responsive web

Team

Product Manager x 1

FE/BE Engineers x 20

QA Engineers x 3

Background

About Influitive

Influitive is a B2B SaaS web platform used by companies to build branded communities where they can discover, nurture, and mobilize their most loyal customers and advocates to complete tasks that fulfill their sales, marketing, and product needs.

What are Challenges?

In exchange for points and rewards, community members can complete Challenges which are made of admin-defined tasks, ranging from providing product feedback and customer testimonials to sharing a social media post.

The Problem with Challenges

After years without significant updates, the Challenge feature was stunted by numerous UX issues that affected its ability to engage members:


Although one of Influitive’s design principles is Delight, the existing Challenge experience did a poor job at appealing to user emotion. We had to leverage emotional design to motivate and excite users, celebrate their achievements, and make them want to come back for more.


Challenges were also hard to find. We discovered that newly published Challenges were not highlighted and partially completed Challenges were hard to identify. In addition, suggested Challenges were seemingly chosen at random and rarely interacted with. All of these factors contributed to low completion rates.


Most importantly, Challenges suffered from a high drop-off rate due to its modal-based format that was susceptible to accidental closure. This was exacerbated by Challenge tasks that require members to exit out of the Challenge. Keeping users within the Challenge flow would be essential to increasing engagement.

Challenges before the redesign

Impact

After a long and arduous journey, I’m proud to say we were able to ship a more delightful and engaging Challenge experience to our customers and community members when the beta of our newly redesigned community platform launched in late 2022! (blog announcement)

Challenges after the redesign

Early signs of happy customers

As we delivered more functionality and migrated more customers over the course of 2023, we were able to collect overwhelmingly positive customer and end-user feedback. Beyond excitement, many shared their love for how simple, efficient, and friendly our redesigned Challenge experience was.


As for any criticism we received, fine-tuned changes were made and a UX roadmap was implemented to curb any UX debt from ever building up again.

Early adopters and user testing participants had positive sentiments towards our changes.

A good step toward better engagement

After a year of our Challenge updates living in the wild, we revisited our initial success metrics and saw a significant improvement across our customer communities (as of September 2023). Specifically, we saw:


  • Reduced Challenge drop-off by 29%

  • Increased re-engagement of partially completed Challenges by 51%

  • Increased Challenge completion by 56%

  • Improved Challenge discovery by 252%


Needless to say, we were able to meet and exceed all 4 project goals: provide a delightful experience, increase member engagement, increase customer satisfaction, and strengthen product value.

Our baseline metrics remeasured and compared

Research

Gathering customer and member feedback

Ever since the inception of Influitive, Challenges have always been the same. As expected, over the years, user experience issues surfaced through our customer success managers and our Influitive customer community called “VIP”.


To get an initial understanding of the issues members and admins were facing with Challenges, I did an inventory of the Challenge feedback posted by customers in VIP.

Product feedback submitted by Influitive customers through our customer community

Verifying sentiments with a survey

We also wanted to ensure that the problems we captured match the current sentiments of our members and customers. To get responses from a roughly representative sample, we published a set of Challenges in VIP that asked customers to provide the most common issues raised by members in their community and from what they’ve experienced themselves.

Quotes captured from our customer survey

Building understanding with flows

With so many different problems faced by different individuals in isolated situations, we had a difficult time seeing how they all relate to one another within the Challenge experience.


So to get a holistic understanding of the entire experience, I constructed task flows to map out how members interact with Challenges and exactly where the experience breaks down.

Task flows were created for all Challenge states and stage types. Issues were marked in red.

Key issues

After synthesizing our research, I discovered the 6 key issues that were plaguing our Challenge user experience.

Challenges are accidentally closed

With members trying to finish Challenges as quickly as possible, many accidentally click out of the Challenge modal.

External tasks are frustrating

Many Challenge tasks require users to navigate elsewhere in the community, forcing them to leave the Challenge.

New Challenges are hard to find

Without a clear indication of which Challenges are newly published by admins, the latest and greatest content is frequently missed by members.

In-progress Challenges are rarely re-engaged

Members frequently leave Challenges partially complete. However, only a small and vague icon is used to identify these Challenges, making them difficult to find and frequently abandoned.

Members rarely complete multiple Challenges in a row

Despite being suggested other Challenges when a Challenge is completed, members tend to ignore them and leave the flow.

Challenge length is obscured

Without a visual indication of how many steps are in a Challenge and which step they’re on, members are hesitant to start Challenges since they aren’t sure if they have the time to complete them.

Success Metrics

Since we’ve historically seen our customers have positive sentiments toward our product and business, I was curious to see whether these issues were superficial or actually impacting the feature’s engagement.


Diving into data specific to each issue revealed poor engagement metrics across the board, seen through:


  • High drop-off rates - 31%

  • Low re-engagement rates - 35%

  • Low completion count - 2.7 per session


Improving these metrics became our definition of success.

Metrics measured to determine the efficacy of our existing Challenges. Gathered with the help of an Engineer

DESIGN CHALLENGE

How might we create a seamless Challenge experience that’s more engaging and usable for community members?

Project Goals

Business goals

Strengthen product value

With the customer community and advocacy space more competitive than ever, we want to strengthen the unique product offerings that differentiate us from the market. One of these offerings being Challenges.

Increase customer satisfaction

To increase customer satisfaction and build trust, we will gather and address the most commonly reported issues in our customer communication channels.

User and customer goals

Provide a delightful member experience

Our customers’ community members want to earn points as much as their admins want them to complete Challenges. We aim to provide a fun and easy-to-use user experience that allows members to spend their time completing tasks for admins rather than fighting our platform.

Increase member engagement

Our product’s value depends on its ability to engage members and incentivize them to complete Challenges. Minimizing user drop-off, improving usability, and appealing to our users’ emotions are all methods we can use to increase member engagement and satisfaction.

Setting Priorities

Without the time to address every problem, we had to identify our “must-haves”.


We did this by weighing each problem based on its popularity in the feedback collected and where it occurred in the Challenge flow. Since problems that occurred more often in flows with heavier traffic were likely to affect more users more frequently, we tackled those problems first while the others were redesigned for a fast-follow post release.

Each critical problem we discovered was mapped on a impact-effort matrix to help us identify our priorities

Early Designs

A sneak peek into the early stages of my designs. I hosted numerous ideation workshops with my product, engineering, and customer success counterparts to explore as many approaches as I could to solving the problems we had discovered.

An example of one of our Figjam brainstorming sessions

Our ideas were weighed based on engineering effort, delight, rationality, and popularity amongst participants and the best ideas were pursued further. Chosen solutions were explored through mid or high-fidelity designs due to the availability of design system components and our desire to move fast and keep up with engineering deadlines.


Countless iterations were made due to various reasons: Technical constraints, shift in product roadmap, or user testing feedback.

Challenge header & progress bar

One of our design principles is to keep users informed of system statuses. When a user opens a Challenge, they should be able to find all Challenge related information in one place such as the Challenge name, Challenge length, their progress, and their points.


Many of these iterations did not make the cut due to a number of reasons such as poor discoverability, lack of scalability, and cluttered design.

Discussion reply stage

Challenges are typically made of multiple steps called “stages”. There are various stage types, each presenting a unique task such as answering survey questions, sharing a social media post, reading an article, and replying to a community discussion.


Since the old discussion reply stage caused significant user drop-off by forcing users to exit the Challenge in the process of replying, we needed a new approach that would allow users to reply to discussions within the Challenge context.

Testing

To validate our designs and prototypes, we tested their usability with internal and UserTesting.com users in an effort to keep the project hidden from competitors.


Through these testing sessions, we had three goals:

  1. Identify early design issues

  2. Validate any assumptions we made

  3. Collect qualitative feedback and remarks from testers.


Our final design was ultimately described to be clean, simple, familiar, modern, easy to use, efficient, friendly, and exciting!

Prototypes and assumptions were tested with internal and UserTesting.com users

Final Product

More space, more fun

No longer will you have to worry about accidentally clicking out of the Challenge Player. The spacious new full-screen Player provides a comfortable and immersive experience that presents all the information you need when completing a Challenge. This includes a new progress bar and point counter that animates as you earn points and rewards you with a blast of confetti on completion.

Bring your Challenge wherever you go

Need to go elsewhere in the Community to complete a Challenge stage? Take your Challenge with you. With minimized Challenges, Challenges will stay by your side, notify you once you’ve completed the task at hand, and give you a shortcut for you to return to your Challenge and progress to the next stage.

New Challenges first

Influitive keeps things fresh and exciting by showcasing the newest Challenges from the past week via a badge in the corner of each card. This way frequent members stay engaged, occasional members stay up-to-date, and the most immediate program needs are met.

Challenge history exactly how you left it

Do you have Challenges you partially finished? Influitive has your back. Find them using the in-progress filter or look for Challenges marked with a progress bar to continue exactly where you left off. If you have multiple submissions for the same Challenge, they’ll all conveniently available one click away.

Smart Challenge suggestions

Members want to earn points as fast as possible and Community Managers want to hear from them. When members complete a Challenge, Influitive keeps them engaged by suggesting more to do, whether it’s the next Challenge in a series of Challenges, a Challenge with related content, or a Challenge prioritized by admins.

What I Learned

A minimum viable product is your MVP

Being a complete rebuild from scratch, Elevate was an incredibly complex project with an endless list of user stories. When we began to reimagine Challenges, we had countless features to build before we would reach the level of functionality provided by our current platform. This caused our team to tunnel vision on designing and developing every parity feature before shipping to users. Ultimately, more technically challenging improvements kept us from delivering high impact yet low effort improvements to users.


For example, our full-screen Challenge player was relatively quick to design and implement yet it had a large impact on usability and user satisfaction. However, we spent a lot of time spinning wheels on how to improve 20 different types of stages, and as it turns out, only 9 of them were heavily used by customers. Had we prioritized the 9 stages to be shipped first, we would have been able to deliver numerous high impact and low effort improvements to customers months ahead of time.

Nothing better than real customer testing

From the outset, our team wanted to make a big marketing splash with our revamped platform. In hopes of gaining a competitive edge, we refrained from testing our prototypes on real customers and members, fearing that our designs would be leaked to competitors.


Although we were still able to deliver noticeable improvements across our platform, especially in Challenges, I can’t help but feel that there were missed opportunities to build excitement in our customer base and to better guide our product decisions if we had tested with real customers and members.

Building Influitive's next-gen design system

I reunified Influitive's platform around a new design system, driving product consistency, reducing accessibility issues, and increasing design and engineering velocity by 50%.

Read case study

Simplifying the customization of Influitive communities

I designed a new tool for admins that will reduce time spent on customizing navigation bars by 99%

Read case study

Building Influitive's next-gen design system

I reunified Influitive's platform around a new design system, driving product consistency, reducing accessibility issues, and increasing design and engineering velocity by 50%.

Read case study

Simplifying the customization of Influitive communities

I designed a new tool for admins that will reduce time spent on customizing navigation bars by 99%

Read case study

Building Influitive's next-gen design system

I reunified Influitive's platform around a new design system, driving product consistency, reducing accessibility issues, and increasing design and engineering velocity by 50%.

Read case study

Simplifying the customization of Influitive communities

I designed a new tool for admins that will reduce time spent on customizing navigation bars by 99%

Read case study

My experience

Senior Product Designer 2020-2024

Product Design Intern 2019

Product Design Intern 2019

Product Design Intern 2018

Various companies

Software Engineer Intern 2015-2017

Have a question, some feedback, or wanna work together? Msg me!

brandon.tong.do@gmail.com

Copied

Copyright © 2024 Brandon Do

My experience

Senior Product Designer 2020-2024

Product Design Intern 2019

Product Design Intern 2019

Product Design Intern 2018

Various companies

Software Engineer Intern 2015-2017

Have a question, some feedback, or wanna work together? Msg me!

brandon.tong.do@gmail.com

Copied

Copyright © 2024 Brandon Do

My experience

Senior Product Designer 2020-2024

Product Design Intern 2019

Product Design Intern 2019

Product Design Intern 2018

Various companies

Software Engineer Intern 2015-2017

Have a question, some feedback, or wanna work together? Msg me!

brandon.tong.do@gmail.com

Copyright © 2024 Brandon Do

Email