🚀
Reducing onboarding friction
Hypersonix.ai Ltd
Reducing onboarding friction
Hypersonix.ai Ltd
Reducing onboarding friction
Hypersonix.ai Ltd
A few sections from cashgram UI
WHAT IS IT
WHAT IS IT
WHAT IS IT
A landing page is tailored homepage for new incoming inbound users to effectively help them start. That serves as the vital link between the onboarding journey and the integration process
The process of creating a Hyperspace is probably the most important stage of the customer lifecycle in our product. While it comes right at the start of their journey, it sets the tone for their whole relationship with the product.
User onboarding of the existing product was designed with the goal of just naming the Hyperspace and capturing only the basic details, allowing the user to land on an empty space. User’s then had to customize the scope by adding further inputs to view insights in the Hyperspace, specific to each user.
CONTEXT
CONTEXT
CONTEXT
Revamped the landing page of Cashfree to address the existing gaps in onboarding, improve the integration experience and help provide merchants with a smooth frictionless journey towards product adoption.
Focused on a new user-centric and informative design, supporting merchants
throughout their journey, providing essential information, resources, and options to optimise their experience and achieve
business growth.
Simplified the process of creating a Hyperspace. Which helped to drive smoother growth and boost product adoption as it enabled easy creation of multiple Hyperspaces for clearer scope and insights.
Read Case Study
MY ROLE
Product Design
Interaction Design
Visual Design
MY TEAM
Navdeep - Design Head
WHAT IS IT
The process of creating a Hyperspace is probably the most important stage of the customer lifecycle in our product. While it comes right at the start of their journey, it sets the tone for their whole relationship with the product.
User onboarding of the existing product was designed with the goal of just naming the Hyperspace and capturing only the basic details, allowing the user to land on an empty space. User’s then had to customize the scope by adding further inputs to view insights in the Hyperspace, specific to each user.
CONTEXT
Simplified the process of creating a Hyperspace. Which helped to drive smoother growth and boost product adoption as it enabled easy creation of multiple Hyperspaces for clearer scope and insights.
Final progressive onboarding interaction
CONTEXT
Revamped the landing page of Cashfree to address the existing gaps in onboarding, improve the integration experience and help provide merchants with a smooth frictionless journey towards product adoption.
Focused on a new user-centric and informative design, supporting merchants
throughout their journey, providing essential information, resources, and options to optimise their experience and achieve
business growth.
To view the full case study, please open the link on a desktop 🙂
To view the full case study, please open the link on a desktop 🙂
PROBLEM 01
PROBLEM 01
High customer
churn
Landing on a Hyperspace that required further configuration presented two major drawbacks.
01
The customer churn was found to be very high with poor product adoption.
02
Persuading a user from an empty screen to customize the scope of the Hyperspace rendered a bad experience that demotivates them.
User lands on empty screen after naming a hyperspace
User lands on empty screen after naming a hyperspace
RESEARCH
RESEARCH
Analysing Initial
flow
The onboarding was simplified to get the user to the Hyperspace with ease. It came to our understanding that this posed a few functional issues. An empty Hyperspace did not give the user any glimpse of what to expect.
01
A considerable number of clicks was required to further define the scope of the product since the onboarding wasn’t extensive enough to capture any information. The user behavior can tend to display a lack of enthusiasm in moving forward or using the product thoroughly as it doesn't serve as self-help.
02
The first few minutes of a new customer’s experience is ideally an effortless demonstration of your product’s value.
Fragmented - Initial configuration flow
Fragmented - Initial configuration flow
🧪 Feedback from user testing
Qualitative testing was conducted at this phase to try and identify why an experience or design doesn't work, or what needs to be changed. From this study, it was clear that prerequisite data collected was accurate but the sequence or the order in which it was being input from the user, was not apt. Below are a few snapshot of feedback from the conducted test.
Few feedback from the test participants
Few feedback from the test participants
INSIGHTS FROM RESEARCH
INSIGHTS FROM RESEARCH
Primary findings
& Insights
Based on the general feedback and the qualitative study, the most pressing areas which needed to be re-looked were identified.
01
✅ Lack of progression
The general feedback from the qualitative study showed the whole process to be tiresome, leaving the user dissatisfied with the output. The sense of progressing forward in creating something was lost in the process.
02
🚀 Complex flow hierarchy
The flow was complex and it was evident that the path a user takes and the order or hierarchy of collected data/input in the process needed rework. The design had to be more human-focused which iterates to present impactful yet concentrated solutions to those experiencing the problem.
SOLUTION / IDEATION
SOLUTION / IDEATION
Rocket launch concept
Introducing card grouping & layout control
Rocket Launch was conceptualised keeping in mind the sense of aiming for growth/heights or outer space since
Hypersonix pertains to speed 🔥.
Rocket launch concept progressive hyperspace creation - interaction flow
Adding delighting ✨micro motion- like the component falls if you unselect a given input
TESTING
TESTING
Insights from testing
the new design concepts
A remote test was conducted for this version within cross-functional teams and the sales departments. This gave us a perspective on various users from different roles and how each of them interacted with this concept.
01
The abstract illustration of a rocket being launched to space does not suit multiple business proposals.
02
The sequence of this animation was only identified among our team & company, giving it no meaning to the customer.
03
The graphics were gratifying & appealing visually but does not serve any function to the user.
02
The flow was complex and it was evident that the path a user takes and the order or hierarchy of collected data/input in the process needed rework.
✍️ A pivotal shift to purposeful design
As designers, this was a turning point in the process. For a first-time user, the graphic might be of great appeal but becomes monotonous in the long run, with a low business value. It was important to convey the design by giving the user a feel of building something & a glimpse of what to expect.
FINAL SOLUTION
FINAL SOLUTION
Selection-based
reflection
A Selection-based reflection was thought out as the core concept. At every stage, based on the user’s input a preview of the interface was demonstrated on the right-hand side. Along the process of onboarding, it simultaneously trains the user on what to expect at the end of the process.
End to end final interaction flow
FINAL OUTCOME
FINAL OUTCOME
Measurable impact
on changes
The general customer feedback was positive in terms of easing the whole hyperspace creation
process.
21%
🎉 Customer churn reduced and saw increase in the overall creation of Hyperspace's per month of new onboarded users
contributing to better product adoption.
🌱 Takeaway
To discard the rocket launch concept was difficult since we tried to emphasize growth conceptually but did not sit well with the customer. We learnt how to understand the user & think from their perspective functionally.
📊
Enhancing dashboard experience
Hypersonix.ai Ltd
Thanks for visiting my portfolio, Lets build together!
On Light
Thanks for
visiting my portfolio,
Lets build together!
Thanks for
visiting my portfolio,
Lets build together!
Thanks for visiting my portfolio,
Lets build together!