muser is an iOS app I designed and developed in 2011 and released on the App store on Feb 7, 2012. Its like a free association game to help writers come up with story ideas.
muser product page
iTunes Store Link
Making the App
The idea for it first came to me while I was in a year long sketch comedy writing program at The Second City – Los Angeles Training Center. During the program, we would use improv games and techniques to free associate story ideas. I though it would be fun to have an app that created a similar experience where you had to justify how random elements might fit together as story.
Being totally new to App development, I first tried jumping in the deep end and taking a 3 day Objective-C iOS workshop in April of 2011. I was able to keep up, but most of it flew over my head. So I took a few steps back. After much searching I found a App development environment called Corona SDK that let you code in Lua, a simpler language for a beginner, but still robust enough for my purposes. I worked through the first half of Stanford’s introductory programming class – CS106 Programming Methodology until I felt like I had enough of a grounding to get started, and then I dove into the Corona SDK.
I wanted the UX to be beautiful, simple and unobtrusive, so I settled on a design that would hide elements until they were needed… such as bringing up the help menu with a three finger tap on the photograph. I included a short (and skippable) tutorial that only runs the first time the user launches the App to explain how to use it. After that, there’s a simple reminder on the launch screen that shows them how to get to the menu and how to shuffle the cards. If they get stuck, there are more detailed instructions available from within the help menu.
In addition to programming it and writing the ideas, I did the graphic design and interaction sound effects for it. The only thing I didn’t create was the photographs, which I licensed from 6 different photographers. I wrote the code from scratch, except for an API I used to save and retrieve data (specifically so that the tutorial only showed on first-run, and not after… even after updating the App).
Lessons Learned
In real world user testing I found that people were able to navigate it pretty intuitively, but it wasn’t perfect. One thing I would change is to make the idea cards respond visually to a swipe in/out gesture instead of just a tap. I found that some users naturally want to swipe any elements that come into or move out of the screen. Thankfully those users quickly realized that wasn’t a valid interaction after the first swipe or two, and I decided that it wasn’t a big enough of an issue to warrant re-factoring the code. Even though I kind of lucked out this time, I really see the value in conducting extensive user testing starting early on, just to see if people use your UI they way you THINK they’re going to use it.
It took me about 8 months start-to-finish and was an amazing learning experience. Besides basic programming competancy, some of the things I learned: how to isolate code to debug it, how to look for and read documentation (and other developer’s code), and commenting… ALWAYS comment your code well! When you jump back into code after not looking at it for a while, you’ll wonder “Why the heck did I do this…?”, that’s where commenting will save your butt. I look at the code now and am aghast by the repetition and see so many ways to do things better (welcome to the world of Software Development). At the same time I am extremely proud of having been able to ship something I’m happy with and that people like!
Here’s a introduction / interaction video I made: