The main design goal of HockeyTweet was to create a fast Tweet creation interface for Hockey, specifically the NHL. This was born from the desire to allow people to quickly tweet their thoughts about the game without missing the action.
This desire stems from my youth, watching Hockey with my Dad. When there was a play we did not agree with we shouted out our protests. When there was an awesome save, there were shouts of joy.
So how do you bring this experience to the iPhone?
First I thought about how to speed up tweet entry. To do that let's save the user time by giving them the list of teams, players, penalties, and games. What did I need to consider for each?
Teams
- Full name or abbreviation? Abbreviation wins out by far, we are only working with 140 characters in a tweet afterall.
- Do we need to update this? Not if we limit our scope to the NHL (teams are pretty static, name changes are not common.)
- Full name or abbreviated? After some testing and consideration for length, I went with full last name and first initial.
- Numbers? Extraneous info, if you are a not a big fan you know the star's names but not necessarily their numbers. No numbers.
- Do we need to update this? Yes, team rosters change often due to injuries, trades, retirement, new players, etc. This will need to updated regularly - need to consider this in how to perform updates.
- Full name of abbreviated? For clarity and since I expect some of the long ones will not be used often I went with full name for each. Where the penalty had a common name that was shorter I used that.
- Do these change often? No, no need to build in updating for penalties.
- How to handle showing a game? Use abbreviated team name with vs.
- Games change often so this definitely needs to be updated on a regular basis.
- Do we need time of the game? No, this app is for tweeting about the game while it is happening. Also, want to consider the day before and after since people may want to tweet about an upcoming game or yesterdays game. Time can be dropped.
- Ok, we are showing yesterday, today and tomorrow. How are we showing that? I went with the 3 letter month and the date only.
- Why no year? Don't need it, we are only showing current games, not previous years.
- Numeric month would be shorter, why not use numerical month? You save 1 character for less clarity. Then you have to decide on a format MM/DD or DD/MM. I feel the 3 letter month provides more clarity, another decision done.
- Why no year? Don't need it, we are only showing current games, not previous years.
During my design I identified that players and schedules had to be updated regularly. How to handle that? This was something new for me since I had to figure out how to do regular updates to my app without impacting the user experience in a negative way.
After some research I settled on web services as the solution. I first designed a web service with Perl SOAP::XML. What did I learn besides new tech (I had never programmed a web service before so this was all new)?
- I know Perl well so writing the prototype web service took about 1.5 hours. Good references through The Perl Bookshelf and Google certainly helped.
- Integrating the web service using asynchronous URL requests with asynchronous XML parsing was a mess. There was a lot of code to handle what was a simply a problem of go get some data and populate this array for display in the UIPicker. Trust me, the first pass of this code was ugly and hairy.
- Where would I host this? My home system was out of bounds, I did not want to re-enter the world of IT and server maintenance to host my own web service. A hosted solution would work but that would cost money for an app that would likely have a limited customer base (iPhone Fans who are Hockey fans, that watch the NHL, and use Twitter). The total earnings for the app would probably not cover the cost of one year of hosting, so I needed something free.
- How will this web service scale? Not sure, probably not well without lots or testing and more research to make sure I wrote a good web service.
- How would I cache the web service data? In memory? On disk? If on disk how would I do that on the hosting service? What about Perl version? Which would the hosting service support? Could I install my own custom Perl modules? Many questions here to answer.
Google App Engine
I started researching hosting solutions that offered the ability to run my own Perl services. All the hosting services seemed more expensive than I wanted to pay. Through the searching I kept coming back to Google App Engine. The pricing model is generous and I use lots of Google services which I find sometimes limited but get the job done 90% of the time.
How does Google App Engine work when hosting from it? My summary would be, unless you write something that is very successful, it's free. Once it starts to cost money (nothing for me yet) you should be already monetizing your product. If you are not making enough money to pay the generous hosting with Google App Engine then why are you offering the product?
Google App Engine had a kink though, I had to convert the already written (though prototype) service in Python or Java. Python was just poking it's head up at my day job so I figured why not go that route. At this time I enlisted a friend who was interested in the project. He signed on to rewrite the prototype Perl SOAP::XML web service using Google's App Engine and in Python. This relieved me of some work so I could concentrate on the app.
JSON 2.2 Framework for iPhone
Around the same time, I came across JSON 2.2 Framework for iPhone. Let me just say, that this is an awesome framework. It let me remove a lot of the hairy XML parsing code from my app and replace it with a clean implementation that effectively lets me pass Python Dictionaries of arbitrary complexity from the Python web service to HockeyTweet where the JSON string is cast to a Cocoa NSDictionary. The ease of using this library can not be said enough.
If you need to write a web service to work with the iPhone, look at Google App Engine, use Python, and the JSON 2.2 Framework for iPhone.
Ok, so time passed, my partner came and went; he had other pressing projects to work on. I finally finished version 1.0 of the app near the end of November. I submitted the app about November 28, 2009. Then it was time to wait.
iPhone Tech Talk Toronto
A week later I was off to Toronto for the iPhone Tech Talk World Tour. This is a one day conference where Apple Evangelists run 1 hour sessions (courses/tech previews/tech tricks) and provide services such as UX (User Experience) reviews. It is effectively a pep rally + course + feedback + networking session with Apple's face to the development community.
It was AWESOME!
The UX Review and The Redesign
At the Tech Talk, as soon as I heard that there would be UX reviews I signed up for one. The review went well. I received valuable feedback from the Apple team which resulted in 10 new features they felt would polish the app and give it a Wow factor.
So began The Redesign. The list of features were:
- Improve the Info button (it was not very responsive)
- Change the text buttons to icons
- Add Arenas to the pre-loaded UIPickers
- Add a UIPicker for pre-loaded Hockey Phrases to give the app a more positive spin (the app had a negative spin with just the Penalties that could be combined with Players or Games)
- Make the Hockey Phrases user customizable
- Change the colour of the Add button from white to the same colour as the other buttons on the main view (the one different button made the view look unfinished)
- Indicate using colour (red) to the user when they typed a Tweet over the 140 character limit for a Tweet
- Make the fact that a Tweet was successfully sent clearer
- The buttons on the flipside view (Settings) could be retouched to make the app look finished
- (My own) Add pre-loaded Team rosters and Schedules so that if the user bought the app and ran it without an internet connection, there was data in the app from day one. The original design was to get the first load of data from the web service.
Not so Fast
But first, I got feedback that the icons could use more polish. Eck! I hired a graphic designer online and he went to work on new icons. I received 5 of the 7 icons and had good ideas on the other two which I implemented in the tight deadline I gave him.
Phew! Now it was time to ship.
I uploaded again and on Monday HockeyTweet hit the App Store.
What would I do differently?
- Hire graphic help earlier in the process. Work with them to turn my paper/sketch prototypes into the UI which I code on the back end.
- Work longer on pinning down the design and the requirements before I start. I let feature creep push the app in a direction I had to reverse early in the process.
- Solicit more early UI design feedback.
No comments:
Post a Comment