B2B SaaS
Web App Feature
0 → 1
Sales Readiness Template Capability
Designed end-to-end product, resulting in reduced program launching time by 80%
ROLE
End-to-end design process, from ideation to implementation, design specs and collaborating with developers to ensure feasibility
End-to-end design process, from ideation to implementation, design specs and collaborating with developers to ensure feasibility
TEAM
2 designers, 5 developers, 1 PM, 2 UX writers, CTO
2 designers, 5 developers, 1 PM, 2 UX writers, CTO
TIMELINE
Apr - Aug 2021
Apr - Aug 2021
IMPACT
40% growth week-on-week in active customers post-launch
40% growth week-on-week in active customers post-launch
COMPANY
MindTickle Inc.
MindTickle Inc.
TOOLS
Sketch, Figma, InVision, Flowmapp
Sketch, Figma, InVision, Flowmapp
Project Overview
This project is a program building tool for sales managers, allowing them to create sales programs quickly and effectively with templates. The design focuses on giving users the power to take action quickly and prepare their sales reps!
Live Project
The Problem
Clients were struggling to regularly create and update targeted training materials for their sales reps, which took a lot of time and resources. While the top 10% of clients refreshed their training at least once every three months, this process demanded significant time and resources that only 27% of clients, like MongoDB, could allocate. As a result, many clients missed critical opportunities to address individual skill gaps, ultimately hindering the performance of their sales reps.
We achieved
About MindTickle
Mindtickle is a B2B SaaS platform focused on sales enablement, helping businesses coach and develop their sales teams. The platform primarily supports two types of users: Admins (typically sales managers) and Learners (the sales reps). Admins create and assign targeted training materials to reps, monitor their progress, and provide coaching to boost performance.
Where the story began...
The clients observed a decline in sales rep performance after completing the courses created by the sales leader of the client businesses. The team found the underlying problem in the creation of the training programs.
The training program creation is complex and time-consuming. It requires resources like sales managers, learning and development teams (L&D), and subject matter experts (SMEs) to create training programs. Only 27% of the clients, like MongoDB, had resources to create industry standard training programs. Other 63% were investing a lot of time in program creation and still was unsure of the impact.
The Process
When I arrived, the team had an initial thought of the user persona and the requirements for solving the problem. To further evaluate the problem statement, I onboarded the team by learning about the existing Mindtickle Admin and Learners platforms.
This involved attending the tutorial sessions, asking questions to the design team, collaborating with the product manager, researching about sales management, and conducting contextual interviews.
Understanding the pain points of admins
To deeply understand the problems faced by the sales leaders, I started doing the following:
- Interviewed internal clients
- Performed competitive analysis
Admin goals
Key Pain Points
Mapping the Larger Experience
With the help of PRD and discussion with the Product team: I understood that these training programs follow a basic skeleton designed by the L&D teams at large scale companies and the content structure is managed by the SMEs.
Here we saw an opportunity to templatize these programs with the help of our teams at MT and using MT’s expertise in Sales readiness to keep these templates up-to-date with the latest industry standards.
Here we saw an opportunity to templatize these programs with the help of our teams at MT and using MT’s expertise in Sales readiness to keep these templates up-to-date with the latest industry standards.
I sketched out the steps of the users' journey to see how I could present this new solution and make it easier for them. I was able to sympathize with the users by breaking down the user task flows into two use cases: selecting a template and using a template
Conceptualizing
I sketched out the layouts and created high-fidelity wireframes to find the best solution. I then tested them with a few internal users and incorporated their feedback in the successive iterations.
01 - Template Gallery
Due to the tight timeline of the project, I tested these wireframes with the MindTickle design team and conducted a brainstorming session. The session was greatly helpful in finalizing the wireframe structure for the MVP.
The below wireframe was selected based on 3 major criteria:
The below wireframe was selected based on 3 major criteria:
- It was reducing the number of clicks for users.
- Following the industry standards of showing compressed view on the left and expanded view on the right - like whatsapp web view and gmail.
- Reduces cognitive load with clear information segmentation using modular tabs and card headings.
02 - Introducing Templates
Final Designs
Once I tested out all usability mistakes by several rounds of user testing and re-iterating, I started designing the final screens in Sketch.
I followed the design guidelines of Mindtickle to create the final outcome.
I followed the design guidelines of Mindtickle to create the final outcome.
Impact
Week after week, we noticed a 40% increase in the total number of active customers after the product was launched.
Interact with the final prototype
Final Prototype
Takeaways
- Collaborate to make successful products.
- Take help from other designers to critique your design rationales and incorporate their feedback. It helps!
- Understanding the technical aspects and constraints before building the end-to-end prototype.
- Always speak your ideas!