Compra, which means “buy” in Spanish, is a shopping list app with a budgeting twist. I first created it in 2014 with the intention of learning to prototype with AngularJS.
I knew I learned best while working on a project. However, I wasn’t sure what to build yet. Taking out a pen and some paper, I began generating a list of ideas.
As a young person who was still recovering from the broke college student mindset, saving money was on my mind. Budgeting seemed like the most interesting idea on the list. I also wanted to experiment with mobile-first design.
The project goal became to make a different kind of shopping list app – one that could also estimate how much someone would spend on things they’d want to buy.
After doing some initial sketches and figuring out the logic and structure of the project, I began coding. I managed to build an almost fully-functional, responsive web app in a few days. It even had a splash screen.
The splash screen.
Compra is different from other list apps because it allows users to enter a minimum and maximum price for each item. I wanted to create an app with many meaningful interactions. Using AngularJS, I was able to build in situational effects. Information and interactions change based on the state of the list.
In the process of adding an item.
Several items have been added.
Screen recording of the app, done on a computer and placed in a phone. Wow!
I used Adobe’s PhoneGap Build to package Compra for mobile devices. After the official launch, reception was positive. The app was even featured on Product Hunt.
Compra is now available for Android via the Google Play Store.