Fiserv
Leading the 0 - 1 redesign of a complex B2B2C enterprise-grade finance platform.
Overview
I led the redesign of an expense management platform that reaches over 500,000 end users and had not been updated in over 20 years. The goal was to
High Fidelity Mobile Designs
Project Summary
The problem
Our product, an expense management platform licensed to small and medium-sized banks across the NA and EMEA regions, was hemorrhaging clients due to how poor its user experience, and user interface, were. Contracts in the millions were slowly leaving to our competitors.
The solution
Overhaul the entire product from scratch. Revisit user journeys to rebuild the experience with user journeys front and center, and redesign the application with simplicity and beauty in mind.
My role
I was the sole designer until our Junior Designer joined a year into our project.
Our team
Senior Designer, Junior Designer, Tech Manager, Product Manager, 3 SMEs, Product Owner, Agile Coach, 12 UI Developers, 10 Backend Developers, 8 QA Testers. A true enterprise machine.
Step 1
User Research
I integrated clients and end users directly into the rewrite from the getgo by conducting new user research in the form of surveys, user interviews, and client roundtables. I first gained a thorough understanding of our user's thoughts on our product from a top-down level in order to understand the broad sentiments surrounding our product.
Understanding our users
I simultaneously conducted user interviews, usability studies, and gathered quantitative data to make the following personas and user journeys that guided our discussions.
Step 2
Collaborating with Product
I joined our Product team’s daily calls to gradually begin learning about the application and their vision for the product. These meetings allowed us to move the bar inch-by-inch every day. Product had never worked with a UX Designer before so these meetings also served as an opportunity for me to educate them on design best practices.
Building Information Architecture
I maintained Information Architecture to serve as the single source of truth for all requirements-gathering discussions. This allowed us to be on the same page for our vision and served as the springboard for future designs.
Step 3
Wireframing in Figma
By this point I knew who my users were, what their pain points were, and what Product's vision for the rewrite was. I also had a clear outline of what my wireframes needed to consist of. I thus began wireframing and shared my progress with Product in our daily calls to consistently source their feedback and ensure that collaboration never ceased.
Building our Design System
Technical constraints required that I built a design system from scratch via Brad Frost's Atomic Design methodology to ensure that our designs were scalable as our project expanded. My system leverages Figma's most powerful features including components & variants, auto layout, color and text styles, variables, conditional logic, and interactive prototyping.
Designing for our users
Two examples of how I used our personas to make features are below.
Step 4
Conducting Usability Testing
I was ready to begin showing my wireframes to clients once most core requirements were satisfied. Thus I proactively took them to Product, clients, and end users to conduct 20 more usability studies to get the following feedback.
High Fidelity Desktop Designs
Step 5
Delivering in Agile
I collaborated heavily with our 40+ team members via sprint planning sessions, requirements gathering calls, daily standups, and leadership "Three Amigos" calls. I served as the point of contact for all design-related questions.
Mentorship and guidance
I also took it upon myself to teach a recent college graduate on our team UX Design in order to double the rate at which we could make designs. Additionally, I lead a two-day long design workshop with our entire team in order to educate others on UX design best practices. UX Design is a passion of mine and I’m always glad to help my colleagues understand it better.
Lessons Learned
My time at Fiserv taught me how to lead design discussions, own design-related deadlines, and think at a higher-business level. I learned some valuable lessons along the way including;
Fiserv
Leading the 0 - 1 redesign of a complex B2B2C enterprise-grade finance platform.
Overview
I led the redesign of an expense management platform that reaches over 500,000 end users and had not been updated in over 20 years. The goal was to
High Fidelity Mobile Designs
Project Summary
The problem
Our product, an expense management platform licensed to small and medium-sized banks across the NA and EMEA regions, was hemorrhaging clients due to how poor its user experience, and user interface, were. Contracts in the millions were slowly leaving to our competitors.
The solution
Overhaul the entire product from scratch. Revisit user journeys to rebuild the experience with user journeys front and center, and redesign the application with simplicity and beauty in mind.
My role
I was the sole designer until our Junior Designer joined a year into our project.
Our team
Senior Designer, Junior Designer, Tech Manager, Product Manager, 3 SMEs, Product Owner, Agile Coach, 12 UI Developers, 10 Backend Developers, 8 QA Testers. A true enterprise machine.
Step 1
User Research
I integrated clients and end users directly into the rewrite from the getgo by conducting new user research in the form of surveys, user interviews, and client roundtables. I first gained a thorough understanding of our user's thoughts on our product from a top-down level in order to understand the broad sentiments surrounding our product.
Understanding our users
I simultaneously conducted user interviews, usability studies, and gathered quantitative data to make the following personas and user journeys that guided our discussions.
Step 2
Collaborating with Product
I joined our Product team’s daily calls to gradually begin learning about the application and their vision for the product. These meetings allowed us to move the bar inch-by-inch every day. Product had never worked with a UX Designer before so these meetings also served as an opportunity for me to educate them on design best practices.
Building Information Architecture
I maintained Information Architecture to serve as the single source of truth for all requirements-gathering discussions. This allowed us to be on the same page for our vision and served as the springboard for future designs.
Step 3
Wireframing in Figma
By this point I knew who my users were, what their pain points were, and what Product's vision for the rewrite was. I also had a clear outline of what my wireframes needed to consist of. I thus began wireframing and shared my progress with Product in our daily calls to consistently source their feedback and ensure that collaboration never ceased.
Building our Design System
Technical constraints required that I built a design system from scratch via Brad Frost's Atomic Design methodology to ensure that our designs were scalable as our project expanded. My system leverages Figma's most powerful features including components & variants, auto layout, color and text styles, variables, conditional logic, and interactive prototyping.
Designing for our users
Two examples of how I used our personas to make features are below.
Step 4
Conducting Usability Testing
I was ready to begin showing my wireframes to clients once most core requirements were satisfied. Thus I proactively took them to Product, clients, and end users to conduct 20 more usability studies to get the following feedback.
High Fidelity Desktop Designs
Step 5
Delivering in Agile
I collaborated heavily with our 40+ team members via sprint planning sessions, requirements gathering calls, daily standups, and leadership "Three Amigos" calls. I served as the point of contact for all design-related questions.
Mentorship and guidance
I also took it upon myself to teach a recent college graduate on our team UX Design in order to double the rate at which we could make designs. Additionally, I lead a two-day long design workshop with our entire team in order to educate others on UX design best practices. UX Design is a passion of mine and I’m always glad to help my colleagues understand it better.
Lessons Learned
My time at Fiserv taught me how to lead design discussions, own design-related deadlines, and think at a higher-business level. I learned some valuable lessons along the way including;
Fiserv
Leading the 0 - 1 redesign of a complex B2B2C enterprise-grade finance platform.
Overview
I led the redesign of an expense management platform that reaches over 500,000 end users and had not been updated in over 20 years. The goal was to
High Fidelity Mobile Designs
Project Summary
The problem
Our product, an expense management platform licensed to small and medium-sized banks across the NA and EMEA regions, was hemorrhaging clients due to how poor its user experience, and user interface, were. Contracts in the millions were slowly leaving to our competitors.
The solution
Overhaul the entire product from scratch. Revisit user journeys to rebuild the experience with user journeys front and center, and redesign the application with simplicity and beauty in mind.
My role
I was the sole designer until our Junior Designer joined a year into our project.
Our team
Senior Designer, Junior Designer, Tech Manager, Product Manager, 3 SMEs, Product Owner, Agile Coach, 12 UI Developers, 10 Backend Developers, 8 QA Testers. A true enterprise machine.
Step 1
User Research
I integrated clients and end users directly into the rewrite from the getgo by conducting new user research in the form of surveys, user interviews, and client roundtables. I first gained a thorough understanding of our user's thoughts on our product from a top-down level in order to understand the broad sentiments surrounding our product.
Understanding our users
I simultaneously conducted user interviews, usability studies, and gathered quantitative data to make the following personas and user journeys that guided our discussions.
Step 2
Collaborating with Product
I joined our Product team’s daily calls to gradually begin learning about the application and their vision for the product. These meetings allowed us to move the bar inch-by-inch every day. Product had never worked with a UX Designer before so these meetings also served as an opportunity for me to educate them on design best practices.
Building Information Architecture
I maintained Information Architecture to serve as the single source of truth for all requirements-gathering discussions. This allowed us to be on the same page for our vision and served as the springboard for future designs.
Step 3
Wireframing in Figma
By this point I knew who my users were, what their pain points were, and what Product's vision for the rewrite was. I also had a clear outline of what my wireframes needed to consist of. I thus began wireframing and shared my progress with Product in our daily calls to consistently source their feedback and ensure that collaboration never ceased.
Building our Design System
Technical constraints required that I built a design system from scratch via Brad Frost's Atomic Design methodology to ensure that our designs were scalable as our project expanded. My system leverages Figma's most powerful features including components & variants, auto layout, color and text styles, variables, conditional logic, and interactive prototyping.
Designing for our users
Two examples of how I used our personas to make features are below.
Step 4
Conducting Usability Testing
I was ready to begin showing my wireframes to clients once most core requirements were satisfied. Thus I proactively took them to Product, clients, and end users to conduct 20 more usability studies to get the following feedback.
High Fidelity Desktop Designs
Step 5
Delivering in Agile
I collaborated heavily with our 40+ team members via sprint planning sessions, requirements gathering calls, daily standups, and leadership "Three Amigos" calls. I served as the point of contact for all design-related questions.
Mentorship and guidance
I also took it upon myself to teach a recent college graduate on our team UX Design in order to double the rate at which we could make designs. Additionally, I lead a two-day long design workshop with our entire team in order to educate others on UX design best practices. UX Design is a passion of mine and I’m always glad to help my colleagues understand it better.
Lessons Learned
My time at Fiserv taught me how to lead design discussions, own design-related deadlines, and think at a higher-business level. I learned some valuable lessons along the way including;