A no code interface to set up, customise, and maintain data to create a true Customer 360 record in Freshsuccess.
I led the design efforts from August 2022 to February 2023, where I worked together with the product manager, product head and a fellow designer.
In addition I worked with various account managers, customer support managers and developers to understand the current method and develop a no code interface. I took their help in reviewing the new approach and considered their feedback.I also collaborated with various teams to make an onboarding video.
Unfortunately the product Freshsuccess was put on hold and the feature did not see the limelight.
Reducing tedious onboarding for the product by making data importing easy and self sufficient.
Make the interface useable for every admin and get access to it.
Self-service sign-up from website
10K increase in customer
Reduction in product onboarding from 90 days to 7 days
Onboarding customers to Freshsuccess is time-consuming as it requires fetching data from external sources, resulting in heavy reliance on Freshsuccess teams for configuration and integration.
Usecase Discovery
Data integration call
Bluk of
work
Data review call
Product training
Go live
The present data platform is not self-serviceable, scalable and manageable. It has multiple entry points and scattered navigation.
When adding a new source app, users encounter a cluttered form flooded with unnecessary information.
After adding the source, the Super Admin (an onboarding or TAM from Freshsuccess) can access the app dashboard. However, it's designed for developers, making it hard to share with non-coders.
Using custom JSON code to map objects and fields isn't easy for users. This is a key feature of our product, but it means users often need help from our FreshSuccess representatives.
'%20stroke='%2379C3ED'%20stroke-width='1.76614'/%3e%3ccircle%20cx='11.7541'%20cy='20.8829'%20r='3.53227'%20transform='rotate(138.999%2011.7541%2020.8829)'%20fill='%23E4D161'/%3e%3ccircle%20cx='5.27581'%20cy='11.4371'%20r='2.47439'%20transform='rotate(138.999%205.27581%2011.4371)'%20fill='%23F7AB80'/%3e%3c/svg%3e)
During this project, I delved into the methods used by other customer success products such as Totango, Gainsight, Churn Zero, and Catalyst to handle their data importing processes. Additionally, I investigated data gathering tools like Freshservice, Zapier etc to gain insights into their approaches to importing and mapping data.
Few major learning from my research
For a jump starter, having some basics fields mapped for the apps.
Preview of mapped data, will avoid any mistakes.
Onboarding is a must, as well as a explanatory video.
CSV file upload to be an option too.
The user journey involves integrating with an app, mapping objects, fields, testing the integration, deploying it, and then maintaining it. Each step is designed to be intuitive and efficient, ensuring a smooth and reliable data integration process.
Integrate with an app
Object mapping
Field mapping
Testing mapped data
Deploy
Deploy
Testing mapped
data
App integration experience
For first-time users, the landing page appeared vague and lacked clarity in guiding them through the process. The overall user experience deviated significantly from the familiar interface of Freshworks apps. This type of landing page may be suitable for an entire app but seemed excessive for a mere feature.
From the user's standpoint, their main task is to integrate with an app and continue. Asking them to make a different decision here feels incorrect. It's always better to show the apps upfront.
The idea of template seems nice - should be there for every app. Not a choice should be an enhanced expereince
Categorization is appreciated, but since we're initially launching with only a few apps, we may consider it for V2.
Having three left navigation bars feels overwhelming.
Based on the feedback received, I maintained the segregation of apps to simplify the identification process for users, making it easier for them to find and manage their apps.
I designed the landing page to align closely with other screens, reducing cognitive load for users. The layout intuitively guides users to select an app for integration, with all available apps clearly listed to eliminate the need for searching (for V1 only).
Once the app is integrated, the initial step involves object mapping, where each object will contain multiple fields to be mapped.
Object mapping exclusively involves direct mapping, and field mapping can incorporate multiple types of mappings.
To enhance user experience, it's advisable to separate account and field mapping. Given the potentially large number of fields under an object, scrolling could become cumbersome in this design
Set direct mapping as the default option for simplicity and efficiency.
The absence of object selection for mapping is noted.
The mapping field experience is complex, lacking clarity on fields under objects in this method.
The wizard method implies users must complete all steps, constraining their ability to pause or exit their work midway.
Combining object and field mapping complicates the UI, particularly in complex mapping cases. Moreover, this layout isn't scalable for intricate mapping scenarios.
I separated field mapping into its own dedicated screen, providing a fresh layout that allows users to focus on the complexities of field mapping without distractions.
An overview of the field mapping is provided under each object, allowing users to get a clear picture of the mapping process. This also helps in quickly identifying and understanding default mappings.
One single entry for all actions for an app integration
One click approach to integrate with an app. No big forms to be filled
Made the complicated code to a visually easy mapping experience. This way any user who has the knowledge of mapping can use the feature. In addition provided a tutorial to explain the process
At Freshworks, we follow a comprehensive design system meticulously crafted with attention to detail and accessibility. By utilizing the established colors and components, I ensure seamless and intuitive user experiences, maintaining consistency and enhancing overall product usability.
Following the final designs, I held a critique session with fellow designers to gather their feedback, and also conducted user testing with designers, TAMs, and developers.
participants
tool
No.of.paths
success rate
Path 1 - Integrate with Chargebee
Direct success
Avg duration
The UI was clear and intuitive, enabling smooth navigation for users. Additionally, the process was highly efficient, requiring only two clicks to complete.
Path 2 - Field mapping
Direct success
Avg duration
'%3e%3cpath%20d='M28.7565%2057.513C44.6013%2057.513%2057.513%2044.6301%2057.513%2028.7565C57.513%2012.9117%2044.6013%200%2028.7565%200C12.8829%200%200%2012.9117%200%2028.7565C0%2044.361%2012.4499%2057.0754%2027.952%2057.5019L28.7565%2057.513Z'%20fill='%236410CF'/%3e%3c/g%3e%3cpath%20d='M21.599%2020.1441C20.6041%2019.3263%2020.6041%2018.001%2021.5658%2017.155C22.0632%2016.7321%2022.6933%2016.5347%2023.3565%2016.5347C23.9865%2016.5347%2024.6166%2016.7321%2025.0809%2017.155L36.6541%2026.94C37.1183%2027.3348%2037.3836%2027.8706%2037.3836%2028.4345C37.3836%2028.9985%2037.1183%2029.5343%2036.6541%2029.9291L25.0809%2039.714C24.1192%2040.56%2022.5606%2040.56%2021.5658%2039.714C20.6041%2038.8963%2020.6041%2037.5427%2021.599%2036.725L31.3815%2028.4345L21.599%2020.1441Z'%20fill='white'/%3e%3cdefs%3e%3cfilter%20id='filter0_b_2634_1156'%20x='-24'%20y='-24'%20width='105.513'%20height='105.513'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeGaussianBlur%20in='BackgroundImageFix'%20stdDeviation='12'/%3e%3cfeComposite%20in2='SourceAlpha'%20operator='in'%20result='effect1_backgroundBlur_2634_1156'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='effect1_backgroundBlur_2634_1156'%20result='shape'/%3e%3c/filter%3e%3c/defs%3e%3c/svg%3e)
A new AI-powered, easy and intuitive voice service and support solution for Customer Service Suite.
A glimpse of my diverse range of projects, featuring my expertise in mobile, website, logo design etc.
