Working at UPMC there was a set design system in use called Coral Design System. This Design system made use of the pictured colors to communicate company standards, alerts and the overall company theme. I followed the Coral design system guidelines for how the colours had to be used. For example, red had to be used to highlight only certain alerts that were urgent or dire.
DMV Before the timeline was added:
DMV After the timeline tab was added:
Lo-fi Wireframe shows potential filter that Business owners spoke about adding to timeline feature:
Hi-Fi Wireframes showing both desktop and mobile versions:
I was tasked with designing a timeline feature for the Member Journey portion of DMV.
I started by Interviewing the Users on what kind of timeline features would be beneficial to their workflow.
As a result of the research conducted, I decided to add a tab on the side that would allow the Timeline to be collapsible.
Pictured on the left is a Lo-fi Wireframe showing the Timeline expanded.
Within the timeline tab, each year is expandable to save space.
Afterwards I worked with the team to create the Hi-fi Wireframe as well as the mobile version. First I sought feedback from the team.
