FinTrack Mobile Wallet App
Designed FinTrack, a mobile wallet app aimed at helping users efficiently manage their personal finances.
Key Features and Wireframes
Overview of Transactions: Offers a quick visual representation of the user’s financial status, while the transaction list gives detailed information about recent expenditures.
Spending and Savings Insights: The graphical representation of income and expenses helps users visualize their financial trends. The inclusion of savings plans encourages better financial management. The app also offers feedback on spending patterns, motivating users to save more and spend wisely.
Wallet Section: The wallet section displays the user’s added cards and allows for the easy addition of new credit or debit cards.
User Information: A clean and straightforward layout for the profile section ensures users can easily update their information.
Wireframing:
Created low-fidelity wireframes for the proposed features.
Conducted initial user testing to gather feedback and iterate on designs.
UI Design and Prototypes
The UI design was developed using the wireframes as a foundation. The design aimed to be visually appealing and align with modern design trends.
Color Scheme
Dark Blue (#2C2C54): Used for the background, this color provides a strong, modern foundation that ensures high contrast with text and icons, making them easily readable.
Teal (#00BCD4): Used for interactive elements like buttons and highlights, teal stands out against the dark background, guiding the user's attention to actionable areas.
Purple (#673AB7): Applied in gradients and graphical elements, purple adds a touch of vibrancy and dynamism to the interface, making it visually engaging.
White (#FFFFFF): Used for text and icons to ensure clarity and readability against the darker background.
Typography: Poppins
Clean, modern fonts enhance readability and provide a professional look.
Used different weights and font sizes to create a clear hierarchy in the design, making it easier for users to scan information quickly.
Headings: Bold or semi-bold weights: This creates a clear hierarchy, guiding users' eyes to the most important information first.
Body Text: Medium or regular weights: Ensuring that information is easy to read without causing visual fatigue.
Reflections
Working on the FinTrack mobile wallet app was a rewarding experience, offering valuable insights into designing for the fintech industry. This project emphasized the importance of balancing aesthetic appeal with functional clarity, ensuring that users can easily navigate and manage their finances.