Next Best Action (NBA) is a feature integrated within the app homepage that surfaces personalised recommendations to guide users toward relevant actions within the platform. The feature aims to highlight products, services, and ongoing activities that users may not easily discover through normal navigation. By presenting contextual suggestions, NBA helps users identify meaningful next steps while also improving product discovery and engagement.
As the Product Designer, I was responsible for defining the experience strategy for NBA feature, collaborating with product managers on recommendation logic, designing the homepage NBA UI component and interaction patterns, ensuring the feature balanced user needs and business objectives.
Many features within the app remain underutilised because users are unaware they exist or are unsure where to find them. Despite having multiple products, users often interact with only a small portion of the ecosystem.
Key challenges identified
Product remain underutilised despite being relevant to users.
Low feature discoverability, products are buried within multiple layers of navigation.
Unstructured homepage experience, homepage lacks contextual guidance on what users should do next.
This results in missed opportunities for both user value and business growth.
The objective of the Next Best Action feature is to surface relevant actions or products based on the user’s context, helping them discover features they may not have been aware of. It also aims to highlight ongoing activities, campaigns, or promotions, while encouraging users to take the next meaningful step within the app.
Homepage mapping
I started by understanding the overall structure of the homepage and identifying the highest visibility touchpoints that could influence user behaviour. From there, I explored areas within the homepage that could be leveraged effectively, which led to the concept of Next Best Action (NBA).
It became clear that the first fold of the homepage is divided into two main sections User area and Business area. Since the purpose of the NBA feature is to recommend the most relevant actions to users, while also supporting business goals by driving discovery of new products. The optimal placement is between these two section areas, positioning it in between maximises the visibility and effectively captures user attention at a critical moment in their journey.
UI design
Now that the placement of the NBA has been identified, the next step is to define the layout structure. Given the limited space available, I decided to use a two-column layout.
The first column is dedicated to the icon, while the second column focuses on the text area. The icon serves as a visual cue to support the action described in the text, helping reduce text heaviness and improving scannability. This approach also ensures the component remains visually balanced and integrates seamlessly with other elements on the homepage.
Exploration
I explored several layout options to determine which works best with the overall homepage elements while effectively captures user attention and maximises the visibility.
Option 3 emerged as the strongest, offering a visually balanced layout that feels intuitive and doesn’t overwhelm user. In contrast, Options 1 and 2 felt cluttered and lacked a clear focal point, making it harder for users to quickly scan and understand the content.
Once the layout was finalised, I tested it against all product services and edge cases to ensure the design could scale and remain future proof to accommodate any additional product services.
With the structure confirmed, I collaborated closely with the illustration team to create the visual cues. Our goal was clear, icons should be simple, immediately understandable, and attention grabbing. Multiple versions were developed to standardise the visual language, not only within the NBA feature but across the entire illustration system.
Finally, all icon variations were integrated into machine learning personalisation variants, allowing us to identify which styles users most intuitively understand and engage with.
Experience
Designing the experience of NBA was about delivering the right action at the right time, not adding more content. To avoid overwhelming users, I worked closely with the AI team to define a clear recommendation logic and hierarchy, ensuring each action is intentional and measurable.
To ensure relevance, NBA recommendations are refreshed every three hours and we anchored the system around fuelling behaviour, the most consistent user entry story before expanding into deeper user personalisation. Allowing us to move from static recommendations to more timely, intent-driven recommendations.
Relevance first – recommendations must feel useful
Clarity – actions should be immediately understandable
Minimal – simple cards with clear CTA
Flexibility – support multiple recommendation types
NBA hierarchy
NBA hosts two types of services, ongoing activities and product recommendations. In terms of display hierarchy, ongoing activities are prioritised, followed by product recommendations. This prioritisation ensures that time-sensitive and active campaigns receive maximum visibility.
When multiple ongoing activities are present, they are ordered by recency, with the most current or latest activity shown first, followed by the next. This approach helps surface the most relevant and timely content to users while maintaining a clear and logical structure.
The introduction of NBA significantly improved both user engagement and product discoverability on the homepage.
Key outcomes included
Increased discovery and adoption of underutilised features.
Higher engagement with ongoing campaigns and promotional activities.
Improved interaction rates within the homepage’s first fold.
Stronger alignment between user intent and business objectives
By proactively guiding users toward relevant and timely actions, NBA shifted the homepage from a passive entry point into a dynamic, personalised action hub, driving both user value and measurable business impact.