Redesign feature release modal component
Aimed to drive increased click-through rate and product release awareness
Role
Product designer
Team
Product manager
Duration
3 weeks
Tools
Figma, WalkMe, HTML, CSS
The platform’s feature release experience was stringing together multiple features within a carousel modal component, going through feature one after the other. This experience introduced the challenge of showcasing features equally and led to users missing features in the latter half of the sequence.
Impact
Exceeded our goals of increasing click-through rate, and achieved a 5% increase in CTR from an average of 20% to 30%. The new component was introduced to our design system and fully replaced our carousel component.
5%
Increase in click-through rate
1
New new component created
30%
Average click through rate
Challenge
Mitigate the risk of high drop-off rates
We observed that our carousel feature release component had a 75-80% drop-off rate from first card to second, and a 25% drop-off from second to third, and these are pretty standard popup drop-off rates.
Hence, our product team took up the challenge to re-think the component that announced product news and feature enhancements.
The new component aimed to increase 1). user visibility on all product related news at a glance, and 2). click-through rates.
Design & develop
Tabs instead of carousel slides
By introducing tabs to the component, users were given the autonomy to choose product release topics that suited their needs. This choice increased our components click-through rate by 5%, allowing us to increase awareness around newly released features and/or product news.
Before
Users could only view one topic at a time, and high drop-off rates meant majority of users barely made it past the 3rd card.
After
Tab titles gave users key information at a glance, and due to the increased visibility increased CTR by 5%.
User decision oriented
Instead of sequentially shuffling between topics back ‘n forth, user were given the autonomy to select topics that suited them.
More context and CTA opportunity
Each tab retained the same content real-estate and on top of that allowed for additional actions to be introduced.
Customized HTML & CSS
Since this was a re-engineered out-of-the-box component for our WalkMe platform. I led a majority of the development within WalkMe, where I contributed from a front-end engineering standpoint configuring the components topic navigation, and writing the HTML and CSS.
