An expense tracking app mobile app using React Native

Motivation We want to make a finance tracking app to allow users to easily keep track of their personal spending and savings. We want our app to narrow in on just revolving around simply helping the user have a good handle on their finances, with no complicated features to potentially confuse the user.

UI concept We want a clean and simple interface so that users will be able to just focus on their finance tracking without any redundant fluff. UI elements and tabs should be neat and intuitive to navigate around, with the most important details front and center, and additional details will be found in expandable menus or after scrolling down the page.

The UI elements will be made following the guidelines of Material Design 2.0 (or Material You if we manage to learn enough to implement it), with tabs and buttons mostly located at the bottom of the screen to easily reach them with our fingers, since smartphone displays are getting taller and taller, making buttons located at the top of the screen hard to reach.

For widgets, we want them to display the most important statistics, for example your remaining amount of budget left for the week, and some simple percentages on your spendings. The widgets will be following the guidelines for Material You on Android and that for widgets introduced in iOS 14.

User Stories Target audience: Teen/Young Adult As a teen, I often make purchases without realizing the quantity of payments I have made. This app should be able to give me a statistical and graphical representation of my spendings. As a young adult, I often go out on work meetings with colleagues and friends. I would like a clean and clear representation , hassle free way of looking at and managing my group payments.

Features Easy Scheduled Alerts Timeline of spendage/charts Create an account Planned budget vs actual spending

Medium Recurring expenses (e.g. spotify, netflix …) Receipt scanner

Hard Currency Converter (USD,MYR,SGD) Payment to friends and logging of group payments

Timeline 24-25 ReadMe + set up development environments 26-28 Learn ReactNative (books/ videos) 29-10July Proof of concept 11-25 Working prototype 25-31 Testing, Debugging and publishing

TechStack: ReactNative (Javascript) Git & Github (version control) MongoDB GraphQL


View Github