Spover
Implementing product design strategy to boost sales task completion by 5x
Background
When there’s a lot of data to sift through, it’s crucial to provide Spover customers with context-specific information and provide a personalized view.
Problem
Spover presented me a version of their product that needed significant UX/UI improvements. Besides a need to modernize their software platform, the Spover sales platform needed to allow for more customizability features to meet their growing number of customers and improve its usability to become more useful for users.
Solution
Provide product strategy and vision in how to allow for more customizability for users in the correct contexts where inefficiencies are present in the sales pipeline.
Impact
UP TO
5x
faster task completion time
APPROX.
72%
feature utilization
Challenges
• Data Density: Finding the right balance between showing the crucial pieces of data, while not overwhelming the user with a flood of information.
• Learning the sales domain so that no crucial piece of information is removed at the expense of simplifying the design.
Original Design
Modernized UI
Working within the constraints of brand guidelines, I modernized the user interface using subtle blues, lighter weight typography, and increased spacing to make it easier on the eyes.
Ideating & Iteration: Collapsing and Expanding Groups
Users needed a usable and clear way to collapse groups because the table list becomes too long and requires a lot of scrolling, which makes it difficult to see the other accounts.
Note: Moved down 'Group By' button next to the '+Filter' button because it worked as a filter. This enhances usability by grouping filters together.
Ideating Process for 'Group By' Filter
Proposed multiple ideas for how to collapse and expand groups (i.e., Owner). I tried different variations with icons, icon positioning, different interactions to select a group, and different interactions to select the expand/collapse option.
Final Design for 'Group By' Filter
After receiving user feedback from users, the general consensus was that the toggle switch component was the most clear for displaying a more granular view by expanding and collapsing 'detail rows'.
Continuing to Focus on Customizability for Usability
Column Management
Users needed the ability to choose which columns to display by default, and to modify over time. This required the need for hiding and adding columns of their choice.
Initial Idea
Final Design for Column Management
Default View - Includes '+' icon in last column to add columns
Hide Column - By clicking column header of each column
Show Column / Hide Column - Drawer opens up when selecting '+' icon
Results
Up to 5x faster task completion time, due to:
• Reduction in scrolling horizontally and vertically to find context specific data
• Personalization of column organization