CheckMates
Front-End Development | Back-End Development
2023
Functionality
This web application is targeted towards college students that are often splitting reciepts for groceries and restaraurant bills. The goal is to make reciept splitting fun and efficient!
This web application is targeted towards college students that are often splitting reciepts for groceries and restaraurant bills. The goal is to make reciept splitting fun and efficient!
My Role
This code was worked on with 2 other engineers. I worked on coding the Front-End, which connects the session database and Tesseract OCR API that allows the receipt to be read.
This code was worked on with 2 other engineers. I worked on coding the Front-End, which connects the session database and Tesseract OCR API that allows the receipt to be read.
Computing Skills💻: HTML, Next.JS, TypeScript, JavaScript, Tailwind CSS, Python, SQL
Open Source Resources: Tesseract OCR
Deployed using Vercel and Github
Design Process
Development Process
Challenges
Confidentiality - Threats to confidentiality may include unauthorized access to the data uploaded for processing.
Privacy Policy High-Level Description - Users have the option to delete their uploaded files and any processed data by simply closing the application.
Confidentiality - Threats to confidentiality may include unauthorized access to the data uploaded for processing.
To mitigate:
- Instant Deletion:
- Data encryption
Privacy Policy High-Level Description - Users have the option to delete their uploaded files and any processed data by simply closing the application.
- Data Collection: We collect images files in JPEG or PNG format that users upload to our web application for immediate OCR-based processing.
- Data Storage: We do not store uploaded image files or any user data.
- Data Usage: We will only use the data extracted via OCR for immediate processing during the user's current session.
- Data Sharing: We do not share our data with any third parties.
Metrics
- Receipt Reading Correctness: tracks feedback to determine how well our app is working at accurately scanning receipts
- Receipt Upload Ability: tracks how many users are successfully able to upload their receipts
- Ease of Customer Use: ensure users intuitively understand how to split items using the app
- Creating Itemized Lists: ensures user and splitters are able to understand their expenses and total
- Percentage of Failed Deployments: will track percentage of failed deployments in order to highlight any potential issues with testing or release
- Percentage Increase in Customer Numbers: will track how many users are joining the app
Component Diagram ︎︎︎
Container Diagram ︎︎︎
System Context Diagram ︎︎︎
Optical Character Recognition Testing
Test how applying saturation, brightness, and contrast affects the OCR accuracy.
︎ In order to create a MVP product, we decided to use a slightly adjusted filter to improve the OCR. While not completely accurate, the receipt is able to be scanned if the text is visible and paper is flat.
Final Design
Takeaways
I found that working with a software engineering team and splitting up the roles was a difficult task that needed to be catered to everyone’s strengths.
In writing the actual code, I wish that I had more time to research and try different OCR libraries to create an optimized receipt output.
@Lydia Kim 2023