How to make an iPhone app for dailymile

electric miles logo

Download ElectricMiles iPhone app for dailymile (It’s Free!)

The dailymile community is filled with talent that isn’t limited to athletic ability. We’ve got runners, swimmers, and cyclists: real people from all walks of life doing amazing things. Over the past year one member in particular has been hard at work building a free iPhone app for dailymile called Electric Miles. Stephen R. lives in Chicago and has been a part of dailymile since the early days. Stephen has literally dedicated hundreds of hours to building his application using the dailymile API. Lucky for me, he also documented his experience, and he let me poke and prod so I could understand it too.

(KS) What made you want to build an iPhone app for dailymile?
(SR) I was part of the dailymile beta before it went public, and at the time I was traveling quite a bit. The mobile version of the web site wasn’t ready back then, and it was really hard to enter workouts with an iPhone. After a year of waiting patiently I approached Ben and Kelly about writing an iPhone app for dailymile. They had an API in place by then, so we were good to go.

(KS) From start to finish, how long did it take you?
(SR) I met with Kelly on one of my trips to San Francisco and we talked about it a dailymile meetup on Friday, November 6. That was last year. I wrote the first code on November 23rd, and submitted the app to Apple on December 1, 2010. It was accepted and available in the App Store on December 17th. So basically a year from start to 1.0. A year of nights, weekends, holidays, and vacations coding in hotel lobbies.

(KS) What is your background and how did you start coding mobile apps?
(SR) I’ve been programming since I was in 4th grade. My dad bought an Apple computer, and I’ve been drawn to visual programs and user interfaces ever since. I’ve been writing software for cell phones at Motorola for six years now, using Java, JavaScript, C, C++ and now Objective-C for iPhone. I work with the Chicago design studio for Motorola, helping designers implement and ship their designs with the software teams. I occasionally get to do small things like a boot
animation or one of the live wallpapers for the R2D2 Droid, but Eclectic Miles was a nice chance to write something from scratch by myself without involving an army of people.

(KS) Can you tell me a little bit about your process for building the app?
How did you work with the dailymile co-founders, Ben and Kelly?
(SR) We had some skype calls and mailed designs back and forth. They knew early on what they wanted from an iPhone app, so I worked from their designs at first. We did work for a few days in San Francisco towards the end to hammer out some details and tighten up some things, but otherwise it was just email back and forth as work progressed. I’m note sure how Ben does it, but he would respond to my questions and problems in a remarkably short time. More than once I’d find a problem with the server or the API, write Ben, and return to my computer after a run or something to find he had already pushed a fix to the site. That was awesome.

How did you test the app without letting the cat out of the bag?
John Hegstrom. He handled everything so nobody knew I had volunteered to work on an iPhone app. This let me focus on coding, and reduced my stress since I wasn’t in the spotlight. I had already come up with the name “Electric Miles” before approaching Ben and Kelly, and we used that as the code name. A few people noticed, but by and large it didn’t draw as much attention as I had feared.

How did you know which features you wanted to include?
Kelly had an idea for an app that really focused on the feeds, commenting and liking and following people. There were some sketches for entering a workout and and tracking your run via GPS but there was lots of focus and detail on taking that core dailymile web experience and trimming it down and simplifying for a small screen. We agreed early on some features would probably not make it: motivations, the forums, inboxes, push notifications, etc. Some are very complex, others just require more time for the dailymile API to grow and develop to support those features.

Can give some insight into the story of how you got from initial sketches to final design?
I love paper. I printed out Kelly’s designs and drew all over them on paper, then scanned the sketches and scribbles back in and emailed them. We would Skype back and forth to work through the initial flow and design. I was lucky to be able to meet with an Apple developer in Toronto during the iPhone Tech Talks immediately after starting the project. He had a lot of very helpful suggestions and helped me figure out how to translate what was initially kind of a web-centric design into something more iPhone-like. I didn’t spend a lot of time in PhotoShop mocking things up. It was quicker for me to simply code up the screens and tweak them as they developed. I kept notes and screenshots as I work, so you can see the design evolve from an initial orange color to a more aqua color and finally the medium-blue color it has today.

sketch of the home screen for the application

What was it like waiting for the apple store to approve the app?
I actually made a short movie about that!

[VIDEO]
(KS) What’s your favorite feature on your new dailymile app?
(SR)Infinite scrolling of the feeds and tapping an entry to see the in-line “detail view” with all the comments and likes. I’m really happy with the way it turned out. There’s a lot going on so it doesn’t scroll as smoothly as I’d like, but it gets the job done. The dailymile site has some sophisticated CSS and AJAX tricks to make the interactions really smooth, and I tried to match that in a way that would be familiar to iPhone users.

snapshot of the CSS editor

(KS) Who was involved in helping build the app?
(SR) Ben and Kelly, the dailymile founders were incredibly supportive and helpful. John Hegstrom handled all the beta testing and fielded questions and comments and helped people test the application so I could focus on coding. Friends from work gave design advice, iPhone programmers I met through Twitter kept me up-to-date, and a small army of open-source developers made the whole thing possible.

working at the coffee shop with kelly k

(KS) What are you going to do now that you’re done?
(SR) There was quite a bit of sleep to catch up on! I made a huge push over Thanksgiving break to finish the app and get it submitted to Apple so it would be approved and available in the app store by Christmas. Once it was “done” I enjoyed not firing up Xcode every evening and spent a couple of guilt-free weekends just hanging out with my family.
Now that a few hundred people have started using the app, some initial bug reports are rolling in. After the holidays I plan a 1.1 release to fix the most obvious bugs and introduce some performance fixes.
I’m also going to explore an Android version of Electric Miles.

(KS) If you could do it all again, what would you have done differently?
(SR) I could easily write the entire app in half the time, knowing what I know now. In hindsight, I spent too much time on features that were cut from the initial version. It would have been best to put a very simple app that did very little as well as possible up on the app store as quickly as possible, so more people could use it and shape the outcome.
I’d also like to do something about the “home screen” which I basically threw together in a weekend. I’d like something… nicer.
This was just something that worked and wasn’t utterly dreadful.

(KS) Are there more iPhone apps in your future?
(SR) I hope so! Apple has provided a very exciting platform for building and distributing applications. I’ve just barely started scratching the surface. It’s been a nice change of pace from rooting through Android internals. I may write a few very small and simple apps to learn some more, but I have a long-term project in mind that’s best suited a tablet format like the iPad offers.

(KS) If you could add one thing to app in the next 6 months, what would it be?
(SR) GPS tracking. That’s pretty much the first thing people assume a “dailymile iPhone app” will do for them. I had started working on it last summer, but quickly realized it would take a lot of work to get the interface right and strike the correct balance between accuracy and battery life. Since I was so far along with the social aspect, I set GPS tracking aside to finish what I had started.

This entry was posted in commuting, features and tagged , , . Bookmark the permalink.

facebook comments:

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>