Planning the App
The idea for GoalChamp started when I couldn’t find a good place to track my goals. Existing tools focused on project or task management instead of personal goals. I started by figuring out how I could solve that problem for myself and then interviewed others to see how they tracked their goals. I used those ideas to make some sketches and then wireframed a possible experience in Balsamiq.
Logo Design & Branding
I wanted to add a little fun to the interface and designed the logo, icons, and colors with a boxing theme (think Nintendo Punchout).
App Development
I designed and coded the interface for the app using Photoshop, PHP, & MySQL. To make it all work, I taught myself how to develop a login system and run database queries. I ended up using a card-based interface to give a quick view of current goals which can be rearranged by dragging.
Tracking Goals on Mobile
GoalChamp is a responsive site that works great on phones, tablets, and desktops. Once you’ve got some goals setup, there is a quick edit option to let you make updates to your progress. Goals include the ability to set a primary task to encourage focusing on the next step. I also added tracking features such as a date countdown and a progress meter.
Creating the Homepage
Finally, I designed a homepage to show off the product’s features and let people sign up. (The site is currently offline as I’ve been focusing on other projects.)
