Channel Configuration

Design for mobile

Banner
Overview

The Channel Configuration feature was introduced to address a major limitation in our app: users could only connect their social media channels like Facebook and Instagram via a web interface, which hindered in-app usability and retention. By enabling channel connections directly within the app, we aimed to improve user experience, boost engagement, and increase the number of returning users.

My Role

I led the design, research, and testing for the Channel Configuration feature, ensuring seamless integration.

The Team

Solo designer, 2 Product Manager, 7+ engineers.

Timeline

August 2022 - May 2023
Rolled out in July 2023.

PROBLEM STATEMENT emoji

Previously, users who installed our app had to navigate to our web app to connect their social media channels. This additional step resulted in a significant drop in user engagement, as many users never returned after this cumbersome process. The lack of in-app channel connection led to poor user retention, directly impacting the app’s overall usage and engagement metrics.

VISUAL REPRESENTATION OF THE PROBLEM
Below Image show A two-part diagram showing the user journey before and after “Channel Configuration.” Before: users redirected to a browser, leading to frustration and app abandonment. After: users connect channels within the app, resulting in a smooth, engaging experience.
Before
Visual Rep User installs zoho social app.
Visual Rep As part of the onboarding process, users attempt to add social networks, but we direct them to connect through our Zoho Social web app to complete the setup.
Visual Rep Users become frustrated and abandon the app due to a poor first impression.
After
Visual Rep User installs zoho social app.
Visual Rep As part of the onboarding process, users can now add their social networks directly through our app.
Visual Rep After connecting their social networks, users can seamlessly publish posts through our app, leading to increased satisfaction and ease of use.
PROCESS AND SOLUTION

We kicked off the process with comprehensive user research to identify the need for the Channel Configuration feature, collaborating closely with the product triad.

This IS WHAT OUR USERS SAID:
Reaction

“It was frustrating to install the app on my phone and then be asked to switch to a desktop to connect social media accounts.”

Reaction

“I lost interest when I realized I couldn’t complete the setup within the mobile app.”

Reaction

If I could connect my social accounts directly in the app, I would have continued using it more often.”

Reaction

“Switching to the web app to connect accounts felt unnecessary and disrupted the onboarding process.”

Detailed view
Revamped Settings Flow

When introducing Channel Configuration, we realized our existing settings interface lacked clarity in certain areas. We took the opportunity to redesign the settings page, making it more intuitive and accessible for users to manage their social accounts directly within the app.

Brand Settings and Social accounts

We introduced a dedicated ‘Brand Settings’ section, providing users with a centralized hub for managing all aspects of their brand. This redesign makes it easy for users to navigate to their ‘Social Accounts’ and seamlessly connect their social media networks within the app.

Facebook Gif
Connecting Facebook

When users connect their Facebook account, we streamline the process by using an in-app browser for authentication. Once connected, users are redirected back to the app, where they can easily select the appropriate page to link.

Empty Page Empty Page
Empty pages

In some cases, users may connect a Facebook account with no associated pages. When this occurs, we inform the user and provide a clear option to switch accounts or connect a different page, ensuring a smoother setup process.

Linkedin
Connecting LinkedIn

For LinkedIn, users authenticate through an in-app browser. After successful login, users are redirected back to the app and prompted to connect their LinkedIn business page if desired, ensuring a comprehensive integration.

Mastodon
Connecting Mastodon server

For Mastodon, which operates on a server-based structure, we’ve integrated a validation step to ensure the server is authenticated before users connect their social media account. This added security ensures a smooth and reliable connection.

New brand New brand New brand
Creating a new brand

During onboarding, users can easily create a new brand, complete with a custom logo and description. They are then guided through the process of connecting their social networks, ensuring a smooth start.

Tour while signin TOUR WHILE SIGNUP
Error while signin ERROR WHILE SIGNUP
Product tour & Error handling

To support first-time users, we offer an optional product tour that guides them through creating a brand and connecting channels. In case of any issues, such as data sync errors, we’ve designed clear error messages to keep users informed and provide them with support options.

Impact

Since its release in July 2023, the Channel Configuration feature has led to a 35% increase in user retention, with a 50% reduction in drop-offs during onboarding. Users have responded positively to the simplified, in-app process, boosting engagement and satisfaction.

HIFI emoji
Key Takeaways

User-Centered Design Matters: Listening to user feedback and iterating on the design allowed us to create a feature that addresses a core user need—seamless in-app social network connections.

Streamlining Processes Boosts Engagement: By eliminating unnecessary steps, we improved the onboarding experience, which had a direct impact on user retention and engagement.

Collaborative Efforts Lead to Success: Close collaboration between design, product management, and engineering ensured that the feature was technically feasible and aligned with user expectations.

Eye ball