Pocket Pie

Project Progress Summary: Pocket Pie Budgeting App Josh:

1. User Interface Design:

• Developed the main (possible) graphical UI layouts for the app, including three key screens:
  • Calculator Input Page: Allows users to input their monthly income and expenses across various categories, with a pie chart visualization of their spending.
  • Comparison Page (continuation of the Calculator page): Displays user-entered expenses alongside recommended budget values, including visual comparisons and suggestions to help students reduce overspending, gamifying the experience by adding a score based on how close the students are to their projected budget.
  • Achievements Page: Designed a badge system to gamify the user experience, with various achievements such as "Getting Started," "1 Month Streak," and savings milestones.

2. Functional Features:

• Implemented interactive elements, including data input fields for income and expenses.
• Added visual representations using pie charts to help users understand their spending habits. Navigation Structure:
• Set up a basic navigation menu with key sections: Home, Calculate, Tips, and Badges.

3. Gamification Elements:

• Designed the badges system to reward users for reaching specific financial goals, with placeholders for locked and unlocked achievements.

4. Next Steps:

• Continue refining the app's functionality by integrating personalized recommendations.
• Enhance the user interface based on feedback, adding more detailed visualizations and interactive elements. Develop the onboarding process and explore security measures for data handling

Polly:

1. React Development: I was responsible for building the React portion of the PocketPie webpage, which serves as a London student budget calculator. My main focus was developing the core functionality that allows users to input their budget details and visualize their spending through an interactive pie chart.

2. Pie Chart Component: The primary tool I built was the dynamic pie chart, which serves as the main feature of our budget calculator. I used the react-chartjs-2 library to implement the pie chart which allows users to see a visual breakdown of their monthly spending in different categories (rent, food, transport, etc.). The pie chart updates in real-time based on the user's inputs, making it easy for students to understand how their budget is allocated.

3. Popup Components: I also build the two popups (WelcomePopup and BudgetFormPopup). The WelcomePopup component, which appears when the user first opens the application, serves as an introduction to the tool, displaying a welcome message, the logo and a "Start" button to proceed. The BudgetFormPopup component is then shown. This form allows users to enter their income and spending for different categories. The form was pre-filled with average values to provide a reference point, making it user-friendly for first-time users.

Dami:

Designed and built a web platform with information intended to help students navigated through university and financial challenges. Pocket Pie is a digital platform developed by students for students, specifically designed to provide financial education and resources for those in London. Our mission is to empower students with financial literacy, enabling them to make informed decisions and access valuable resources, such as housing options and discounts.

Main Features

1. Financial Education: We offer a variety of resources on money management, saving, and investing, all presented in an accessible, student-friendly format.
2. Discount Finder: A link to our partners website containing discounts and deals specifically for students in London, making it easier to save on everyday essentials.
3. Housing Search: This section addresses a common challenge faced by students—finding reliable accommodation. Many students struggle with locating suitable housing, often ending up in places with issues like mold or noisy neighbors. Our platform includes reviews from fellow students, ensuring prospective renters have access to valuable insights about the accommodations before making a decision.
4. Budgeting Tool: A link that direct users to our primary tool helps students track expenses and manage their monthly budgets effectively.