TaskRanger

TaskRanger

2020-2021

TaskRanger is a cross-platform gamified to-do list app I built in 2020-2021 as I taught myself React Native and Firebase.

The Story

Building a to-do list app is somewhat of a rite of passage for developers, so it seemed (humorously) like the obvious thing to make when teaching myself how to develop cross-platform apps. And so, in less than a day, I had built a functioning to-do list app with baseline features. As I continued to play around with the UI, I discovered how easy it was to design an interface I liked, and this led me to a realization: with slightly more work, I could probably put together my ideal to-do list app. From here, my "simple to-do list app" evolved into a significantly more complex project.

At the time, three of my highest priorities were theme, gamification, and simplicity/ease of use. I collect national park patches from parks I visit, so I thought it'd be fun to make the app national-park-patch themed (fun fact: I actually worked on various parts of the app in three U.S. national parks). From here emerged the "TaskRanger" name and park-patch-inspired branding. I will not deny that I continued with this project partially because offered a much-appreciated excuse for me to design a cool brand identity.

task-ranger-branding

As part of the app's gamification, users received a unique patch reward for completing their daily goal (completing a certain number of tasks, a percentage of their day's tasks, etc.), and the creation of these patch graphics evolved into a project of its own. With Illustrator and suite of carefully tuned Photoshop actions, I constructed a patch-making factory on my computer. With the help of Noto Emoji, I created a fleet of 50 unique, realistic-looking patches. When users shared patches with friends, they'd be rendered into (digital) TaskRanger-branded packaging.

TaskRanger patches

I had initially planned to release the app to the App Store and Play Store after I finished development, but the cross-device cloud synchronization features used an unsustainable level of database reads and writes — especially for a non-monetized app. I then experimented with making the app offline by default and selling a "TaskRanger Cloud" upgrade. At this point, I had actually stopped using the app for my own personal task management and began to question the point of releasing an app that I no longer found useful. Ultimately, I decided to not release the app. Cancelling the launch was a tough decision, but it allowed me to step back and see the project for its true value: an exciting introduction to cross-platform development and rewarding exercise in brand development.

Description

TaskRanger isn't your complex, feature-rich task-management system. Instead, it serves as a tool to organize your daily to-do list — the one you might scribble on a scrap sheet of paper... and then forget about a few hours later. With TaskRanger, you can visually track your progress on your daily tasks with a satisfying progress bar and complete all your assigned tasks for the day to win a beautiful digital patch for your collection. You can use TaskRanger on its own or with your existing task-management system.

Features

  • Set dates and reminders for tasks and reoccurring tasks
  • Add notes, subtasks, and links to your tasks
  • Daily task goals to track with a clear progress bar
  • Win a digital patch upon completion of your daily goal
  • Streaks for goal completion
  • Later end-of-day time options for night owls (up to 5:00am)
  • Daily national park features!
  • 10+ beautiful themes

Tools

  • React Native
  • Firebase
  • Figma
  • Illustrator
  • Photoshop