Overview
Summary
Created a UI component that assists users in identify contracts that breach the terms of their contract
Role
UX/UI Designer
Impact
Near total reduction in contract breach case
Creating a UI component
Overview
With an increasing number of portfolios to manage, Jarden wanted to provide advisors with quicker access to key metrics.
Design environment
Design was a new concept for Jarden. Management did not know what to expect, nor what functions design would fill. Due to this, problems and solutions are presented, and design was expected to execute on a UI level only. To enlighten management on the value design can offer, I extended my role to include user research. to improved the original solution and demonstrate value.
Objective
Develop a visual tool to identify portfolios that are not meeting their required risk tolerance.
Management had not previously worked with a design department and had dictated a desired design.
-
"Add new column to existing accounts page, single % ranging, +/-, maximum of 100%, sortable"
-
"If income is less than it should be, then the number is positive, and the calculation is current growth - strategic growth target"
Initial product
The page where the component would live shows a summary of each investment portfolio managed. This information is a static summary of the contract, not a real-time view of the holdings. Users have to navigate down through multiple paths to find actual values.

User Testing
Management had made the assumption that users viewed the growth target of a portfolio in isolation. I wanted to challenge that assumption to test whether it was indeed how users acted.
Hi-Fi Figma designers were tested with 6 advisory teams (15 individuals).
A key objective of the testing was to show management that testing and co-design with users was a way to rapidly identify success without wasting development resources.

​Testing identified how users mentally visualized targets, and how management’s perspective was different from users. Users considered growth and income as a combined, inseparable concept, and would struggle with the idea of “growth being +100% of target”.
Redesign
Based on user feedback the component was reworked.
I borrowed from a similar visual design used to display cash levels.
Strategic targets have also been introduced based on user feedback.

Implementation
The component is successfully deployed with no significant negative feedback.
Management was happy with the deviation from the initial design spec.

Impact
Before this feature, portfolio managers could not quickly identify whether their portfolios were within the acceptable growth allocation. This resulted in managers breaching a portfolios contract for weeks at a time. With this new visualization, the compliance and management team experienced a near total reduction in contract breach cases.