Role: UX & UI Designer • Timeline: 1 day • Scope: Hackathon
The app was built as part of the 2015 STRV Hackathon in San Francisco and won the runner-up prize. I did mockups featured in this post and my teammate coded the app to make it work.
Budget lets you record daily spendings and incomes on the go. For example, if you stop by a coffee shop or pick up clothes at dry cleaners, you can quickly enter amounts spent at each place. The same logic applies to incoming money, such as receiving a payment at work. The app totals the amounts you enter so that you have a clear picture of your finances at the end of the day.
Income totals are green and expenses are red. You can compare the numbers using the toggle buttons. If you want to see individual amounts entered, they are available in a scrolling list.
The app’s biggest advantage is that it simplifies the process of tracking money. Recording expenses and incomes is effortless and can be done immediately without having to pull the phone out of the pocket.
One of the biggest challenges of designing for the watch was finding the right way to input information. The ability to enter numeric data was important to making our app work and we had to select a method appropriate for the device. We considered the following options.
One of the biggest challenges of designing for the watch was finding the right way to input information. The ability to enter numeric data was important to making our app work and we had to select a method appropriate for the device. We considered the following options.
Digital Crown offers a new way to interact with the watch. It is used for scrolling and for input on some of the native watch apps. It seemed to be an ideal solution, but we ran into limitations as to how third-party developers can incorporate the crown functionality into their apps.
We chose to let the user add enter the number in the increments of 25¢. Pressing the Plus button once adds one increment, and holding the button speeds up the adding process. In the long run, inputting large numbers in such a way might become cumbersome, but for the purpose of the demo, this solution was the best.
To make the user experience complete, we also prototyped an iPhone counterpart of the app. The iPhone app would extend Budget’s features so that the user can:
Should the user choose to enter the information on their phone, this option will also be available. The watch will sync with the phone so that all of the information is immediately visible on both devices.
All | PPP Loan Application | Path-to-Purchase Redesign | Shopping Preferences | Account Registration | Object-Oriented UX | Apple Watch App