Helping New Users Visualise Creative Use Cases For a Versatile Lead Qualification Tool

The Brief

Saleswhale is still a rather niche product in the market and most marketing managers still struggle to grasp how AI assistants can help them and how we can fit into their existing tech stack. It can sometimes fly over people’s head when we try to explain how our software works with demo videos and an integration diagram such as this:

An integration diagram we use to illustrate how Saleswhale works
User journey of an unintentional prospect
User journey of a warmer lead


We have brought up the idea of a template library multiple times during ideation in our past design sprints but always shelved the idea in fear of it becoming something larger we can take on with limited resources on the web team.

The Goal

Our goal was to help prospects and new users how Saleswhale works as quickly as possible and reduce the friction of them giving Saleswhale a try.

Role, Team, Scope

Role: Lead Designer
Scope: Interaction design, Visual Design, Prototyping
Team: Dea (Frontend Dev), Reshma (Project Manager), Gabriel (Stakeholder, CEO)


~2.5 weeks

Key takeaways from the research

  • Customer Gong Calls — Takes a while for prospects to comprehend how Saleswhale AI works. “This looks quite complex”; “How does the AI know what is qualified?” Customers also struggle to connect their pain points to our solution sometimes, which also means they struggle to come up with use cases after onboarding.

The Solution

At this point, the playbook library in-app was already in production and so we had some point of visual reference how the library could look like, there was no point in starting from scratch.

Screenshot from the first prototype

Internal Testing

We used Notion to track questions and notes
  • What is the unified term we should use for templates — playbooks or use cases?
  • How can we make the templates more robust and surface more educational material for new users?
  • How can we come up with a proper filtering system for the library? How should we categorize the playbooks?

Closing the Loop

Final Results

As of the time of publication, the use case library has become the top 3 most-visited pages on our marketing website:

Results from our Hubspot dashboard

Relating it back to our sprint questions

We started the project with a rough idea to replicate the playbooks we have in-app on the marketing site.

Key Takeaways

  • Focus on the MVP — The initial prototype included some features like the Search Bar and Sliding option for the cards. Upon scoping with our frontend developer, we quickly realised that these functions would take up much more development time than intended and may not move the needle as much for such a preliminary stage for our library (less than 10 playbooks at that point in time). We decided as a team to move those functions to backlog and focus on pushing the MVP in the 2 week time frame instead.
  • Be resourceful in recycling relevant research and content — The product team had already set out the direction for the playbook onboarding in-app and had some content structure laid out when the web team was planning to feature these use cases on our marketing site. We managed to save quite a bit of time by basing off our designs on some of these sketches and notes provided by the product team.



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


Visual-turned-UX Designer. Always a work in progress