When an ankle monitor just won’t do
In a bout of professional ambition (masochism?) I enrolled in an eight-class certificate program in Interaction Design through Coursera, a massive open online course (MOOC). After 54 weeks of online lectures, arts, crafts, and “light R,” I am now ready to present my capstone project to the world. Are you ready? Since part of the homework assignment requires creating a blog post on this topic, one of us doesn’t have a choice in the matter.
The capstone project had the design prompt glance: how can we provide someone with highly relevant information, all in one spot, without being overwhelmed? After conducting some (hopefully not creepy) observations of people juggling multiple data sources and struggling with mental math, I developed the rough idea of creating an app that would help someone keep track of hotel, car, and schedule logistics while traveling. However, any perusal of the app store will show you that there are hundreds of travel apps. How would mine be different? I needed a target audience and a point of view that was informed by understanding this audience’s needs.
While many inventors claim their “killer app” is going to save the world, I had no such delusions. I wanted to make something that would help me pass my class and maybe make life marginally easier for someone. So why not make that someone my husband? As a rowing coach of high school and college-aged athletes, he frequently travels with large groups and has to keep track of everything from the locations of 80+ children and a dozen coaches, to hotel rooms, to van rentals, to race schedules, to dinner reservations. After peppering him with questions, I came to the earth-shattering conclusion (“point of view” in the parlance of my homework assignment) that situational awareness can be automated thoughtfully. Slow clap.
But there was still much work to do! I started with a mood board to collect concepts showcasing what I’d like to do with the app. Since I had two members of the target audience within walking distance (my husband and his assistant coach, who is our neighbor), I was able to garner lots of useful feedback. For example, the image that they both liked the best for inspiration was that of an ankle monitor for prisoners on parole, which notifies the authorities if they try to leave the local area. Apparently, a big concern for coaches is athletes wandering away from the race site or hotel without telling anyone. While that heavy-handed option probably wouldn’t go over well with athletes (or their parents), perhaps the app could provide simple situational awareness of everyone in the group?
Before I started coding anything, I broke out the paper and sharpie. Why? For starters, I don’t know how to code. But it’s also good design practice to start with the quickest possible way to make the idea real enough to elicit feedback. In this case, I drew out a storyboard sequence showing how a coach would use the app, which I dubbed “Ath-LERT” (athlete + alert, get it?). Was I on the right track? Audience members said yes, and offered a few tweaks to make the sequence flow more logical for their needs. They also recommended that the app keep track of athletes and coaches, not just the athletes. Ok then.
Next came a series of paper prototypes. When a user pressed a “button” on the paper “screen,” I put down another piece of paper showing the next “screen.” If I never have to hand draw another iPhone wireframe, I will be happy. (In retrospect, I should have drawn a basic outline once and then photocopied it.) To broaden my feedback pool, I conducted a test session with a classmate via Skype. He pointed out some areas where the user would be stuck in an endless screen loop and I needed a few well-placed cancel buttons. Good point.
And suddenly, we were off to the races with online prototypes! For my next homework assignment, I had to learn to use Sketch (to create a prototype) and InVision (to make it clickable). Both tools are great and probably easy to learn if you have even the least bit of instruction. I, on the other hand, suffered through hours of trial and (mostly) error and painstaking workarounds. Case in point, the plugin that was supposed to fill in my circles with stock photo avatars didn’t work; rather than creepily searching Google Images for pictures of teenagers in athletic clothing, I opted to use Simpsons characters. (Disclaimer: my project is not a Simpsons app, nor am I trying to imply any endorsement or affiliation with this television program.) After many hours, I had a clickable prototype to use to elicit feedback from people outside my household and class.
And feedback I received! In addition to asking friends and family to click around and tell me what annoyed them, I also used the site usertesting.com to see how total strangers were able to navigate the site. To make matters more complicated (and fulfill a homework requirement, let’s be honest), some users saw a version with black text, and some users saw a version with some text in blue. I wanted to see if people were more apt to click on blue text, since hyperlinks are usually blue. (Answer: yes.) I also learned that the button sequence for editing calendar events was laborious and needed to be redone. Sigh. While I tried to suppress my thoughts of “it takes you 10 extra seconds but will take me three hours to redesign,” I eventually cleaned up the editing sequence, made some final touches, et voila! Here is the app itself, plus a cheesy (required) video about it.
The main purpose of the app is simple: help coaches keep track of their athletes, co-coaches, and schedule.
You can check the team’s status:
Text or call the stragglers:
See where people are located (assuming they also have the app running):
View your daily schedule:
And make changes as needed, triggering an alert to affected parties:
Nifty, right? So what’s next? Since I don’t know how to do any of the back end coding, probably nothing. I will finish my class, earn my certificate, and enjoy the extra free time…or maybe take this class next and finish the job.