Wireframes
Mobile Application
Introduction
In the past few years, monthly and annual subscriptions have become increasingly popular. With the arrival of subscription culture, many are signing up for subscriptions without necessarily keeping track of what they have previously signed up for. Trace is a mobile application whose goal is to manage subscriptions for users, making them more aware of their financial spending. In turn, helping their financial health by educating users on where their money is going.
As the Lead Designer for this project, I spearheaded the design process from initial concept through to the final working prototype. I conducted user surveys and interviews to gather valuable insights, ensuring that user needs and preferences were at the forefront of our design decisions. The result was a user-centered solution that not only met project goals but also enhanced user experience.
Who is our user?
The target persona for Trace is an individual seeking to enhance their financial literacy and learn more about their spending habits to make informed monetary decisions. This user struggles to keep track of monthly subscriptions and bills that are automatically deducted from their bank accounts. Currently, they manage their finances either mentally or by periodically reviewing their banking application for current expenditures. The primary challenge they face is the lack of a centralized view of their bills, which hinders their ability to understand their monthly spending patterns. By addressing this need, Trace aims to alleviate the cognitive load associated with tracking subscriptions and bills, enabling users to focus on making informed financial choices.
Insert user persona graphic
Brand Guide
Since green is the color that typically comes to mind when discussing money or finances, the primary color for Trace is green. The rest of the color palette follows a grayscale to ensure clear call to actions, reduce interface clutter, and maintain a reliable feel.
The primary color for Trace is green, as it is commonly associated with money and financial matters. To complement this, the color palette incorporates a grayscale framework, which enhances the clarity of call-to-action elements, minimizes interface clutter, and fosters a sense of reliability by not allowing many colors to compete against each other on the interface.
Insert brand guide graphic
User surveys and Lightning Demos
To better understand user knowledge regarding monthly spending habits, an initial set of user surveys was conducted. A significant finding from this research revealed that 100% of respondents lacked an effective method for tracking their spending.
Subsequently, a competitive analysis was performed on existing financial tracking applications, specifically Rocket Money, Trackmysubs, and Trim. The following insights were gathered:
Rocket Money
The onboarding questionnaire fosters trust between users and the application, suggesting a personalized experience. However, the inclusion of various gamification elements may create a social dynamic that could deter users, given the sensitive nature of financial information.Trackmysubs
The option to manually add subscriptions offers users the flexibility to customize their experience. However, the use of bright colors for many different action items can lead to interface clutter, as multiple call-to-action elements compete for attention.Trim
Trim features a streamlined interface centered around a single primary color, enhancing navigation by reducing distractions. Since the menu tab presents many options—incorporating icons could improve usability by visually guiding users toward the application’s primary functions, rather than relying solely on text.
Red Routes
Based on the insights gathered from market research and user surveys, I identified the three most critical red routes for Trace. These routes are essential to the user's initial experience with the application. Given the sensitive nature of financial information, I prioritized credibility and trust throughout the design process of these red routes, ensuring that users feel secure and supported while navigating their financial data.
The Onboarding Questionnaire
Adding a Subscription
Accessing Historical Data
Onboarding Questionnaire
Adding a Subscription
Accessing Historical Information
Usability Testing and Insights
Two rounds of usability testing were conducted to validate design decisions and ensure that Trace effectively meets user needs as a financial management application.
In the first round of testing, two key insights emerged. Firstly, one participant expressed that while she saw Trace as a potential budgeting tool, she felt the onboarding questionnaire lacked personalization related to her financial goals. Secondly, both participants encountered difficulties accessing historical reports. Although they eventually located the calendar icon for this feature, they noted that its significance became clear only after discovery. Despite this challenge, both users successfully completed the three assigned tasks, highlighting an area for improvement in icon visibility.
The second round of usability testing focused on the overall fluidity of the interface and the intuitiveness of the design. Feedback indicated that the application could benefit from additional buttons to clarify user actions. Participants also suggested incorporating more brand colors in the onboarding questionnaire to enhance visual interest.
These findings will inform the final iteration of Trace. A lower-contrast background will be implemented in the onboarding questionnaire to create a more fluid experience while preserving the application's professional aesthetic. Additionally, buttons will be enlarged and strategically added to main screens to clarify primary actions, ensuring that screens remain uncluttered to avoid user distraction and potential abandonment.
Final Designs
Onboarding Questionnaire
Adding a Subscription
Accessing Historical Information
Conclusion
In summary, the first round of usability testing validated the key user flows of the application. The second round provided deeper insights into the clarity and visibility of screen elements, particularly icons. Notably, 100% of participants successfully completed the key red routes: (1) completing the onboarding questionnaire, (2) adding a subscription, and (3) accessing historical reports. Additionally, all users indicated that they would utilize Trace to track their spending and enhance their financial literacy.
Looking to the Future
For a financial management application like Trace, establishing and maintaining user trust is paramount. This principle must be preserved throughout all design iterations. Given that users envision themselves utilizing Trace for effective financial tracking, I would incorporate a feature where users can use the application to track their financial goals— such as investing, saving for a home, or reducing debt. This feature can be added to the Goals icon on the navigation bar.
Additionally, implementing a "Discover" feature would be beneficial. Many users expressed a lack of knowledge regarding financial topics, including investments, high-yield savings accounts, and Roth IRAs. By integrating a learning module that allows users to explore topics of interest, Trace can further its mission of educating users about their finances, ultimately enhancing their financial literacy and decision-making capabilities.