valencerina website design logo

Fingage

Financial Company Website

Fingage

Overview

In June 2021 I began working alongside the C.E.O. and design team at Fingage, a technology-based retirement and investing company, to add new features and functionality to their existing products. Following the requirements of the C.E.O. and input from the developer and the lead designer, I worked on solutions for three separate projects.
View Live Project
Process

I approached my project with Fingage using the basic design process I typically follow for every project. I use four basic steps: Product Definition, Concept Exploration, Iteration & Improvement, and Execution.

Process Steps

Product Definition: Define the challenge and goals. Interview experts and users. Create a journey map.

  • Interview Fingage C.E.O. to learn about the company and its needs.
  • Create a journeymap in collaboration with the C.E.O. to reinvent the client and advisor journey for the better.

Concept Exploration: Perform competitive analysis. Come up with ideas for solutions based on a variety of research methods. Create wireframes, storyboards, and mockups.

  • Research competing financial management companies and other related businesses to discover solutions that work best for Fingage.
  • Create wireframes, storyboards, and mockups of potential solutions based on information gathered from previous research.

Iteration & Improvement: Design and build prototypes using Figma. Test prototypes with real users and stakeholders. Reiterate and improve prototypes based on user and stakeholder feedback.

  • Design working prototypes of the solutions based on previous research.
  • Test prototypes with Fingage C.E.O., other stakeholders, clients, and advisors.
  • Reiterate and improve prototypes based on the feedback and data gathered from previous tests.

Execution: Create and launch the live product in close collaboration with the developer.

Project 1

The main focus for the first project was to simplify and add a few important charts and graphs in the form of widgets to the client's account dashboard. The "Your Expected Wealth" chart, "Your Portfolio Allocation" graph, and "Glide Path Chart" needed to be added to the dashboard and also be expandable to their original full-sized versions.

Dashboard
Widget Version - Portfolio Allocation
New Expanded Version - Portfolio Allocation
Original Expanded Version - Portfolio Allocation
Project 2

For the second project, I needed to create a way for users to download a large document comparing different kinds of financial reports. According to the developer, the reports required unpredictably long download times so I had to find a way to handle that issue. I came up with two options for the C.E.O. to choose from. In the end, he went with Option 1.

Option 1 - "Download in progress"
Option 1 - "File ready"
Option 2 - "Download in progress"
Option 2 - "File ready"
Project 3

The third project mainly dealt with changing icons and adding additional actions to certain items on a list page. Initially, the C.E.O. wanted to add a third icon in order to add one new option to the "Actions" section but we came to the realization that in the future we would need to add more and more actions so instead of more icons, we decided on a "more/ellipsis" icon and a drop down so we would be able to add an infinite number of actions in the future.

Before - Only two "actions" options

After - Infinite "actions" items

next
Project