David Quinlan is a normal guy with day job and just a bit of coding experience. But he and a friend lived the dream and cranked out a simple iPhone app in a weekend. Here’s how they did it.
“Thai, salad or ramen?” It’s lunchtime on a typical Thursday and it strikes us that millions of people all over the world are pondering the same question. This question is our launchpad, making us part of the thousands of people who wanted to build an iPhone app for “that”.
I’m a product and marketing guy with some design and coding skills. Roy is a developer with some business savvy. Combined, we make a great team and complement each other’s skills well, but we only started working with Objective-C last year, like many others who are trying out iPhone development. We’ve already built an app or two, so we’re familiar with the language and frameworks. However, as with all new projects, you usually have to do a little research to understand how to approach the different challenges… especially in a world defined by 320×480 pixels.
For the longest time, we’ve played around with the idea of creating an app for fun. After discarding a couple of good ideas (because they were too complicated or a quick search in the App Store showed that someone else already does it well), lunchtime lands us on a simple, fun idea to help people stuck between decisions.
But while most people want to create a great iPhone app, my friend and I go one step further, making a pact to finish the project within a weekend – or realistically, our app would never get completed.
My homework includes determining the look, feel and interaction on each screen. Roy needs to research some of the Xcode features we haven’t had a chance to play with yet in our “real” jobs, mainly animations and randomisation.
On Saturday morning, we meet at a local coffee shop that had free Wi-Fi, claim a large table so we can sit side-by-side and grab the first of many large cups of coffee. Then we create a shared Dropbox folder for this project – a Basic account is free and comes with 2GB of storage. The Dropbox is important because it allows us to multitask on the same project with any/all changes synchronising in real time. For larger projects, you may want to consider GitHub.
We pull up a more detailed outline of what we want to accomplish for our app as well as basic wireframes. Given that we only have a weekend to complete this app, we decide to focus only on the “must have” features. A developer can always issue feature updates at a later date to include the “nice to have” features.
Going screen-by-screen, we detail the elements on the page, style treatments, layout, timing, etc. We also discuss what Roy learned about animating the card’s flip motion, since this was one of the core functionality of the app. We briefly review the Quartz 2D and Core Animation libraries, since we had not previously done any work with those. We even discuss using a UIWebView to render the animation within WebKit’s CSS. Ultimately, we find a simple solution using standard UIViews and UIButtons. The UIView class has some animation class methods, and one of the built in transitions is a flip effect. As for the randomiser, we knew most languages provide a random function, and Objective-C is no exception. For purposes of this app, all we wanted was a simple method to randomise an array. Roy found a couple of examples of this, but one that stood out was over at Dr Touch’s website. He describes an approach with which to implement a class extension method so you can easily shuffle any array.
We dive into our respective MacBook Pros with a Borg-like focus on our individual areas of expertise. I open up Photoshop and began building screens. The first screen is the default image. This is the very first screen people see when the app starts and begins loading. Apps can be built in either portrait or landscape view. If you choose to build your app in landscape view like ours, you still need to create a default image that displays in portrait view. Simply create your landscape view and rotate clockwise or counter-clockwise (depending on whether you want left or right landscape view). Now the default image loads in portrait view but since your images is rotated, the user will twist the iPhone to landscape view.
I then spend the next couple of hours creating comps, background images, buttons, card (front and back) and info page. I also spend some time focusing on the app icon. This is obviously the “face” of your app – a badge of honour – so you’ll want to put careful thought into the icon imagery. Remember, you’ll need the icon in both the 57×57 and 512×512 sizes. Once completed, I upload it to Dropbox so that Roy could start using the creative elements.
Wow, seven hours and fours large coffees later, we have a lot done, but there’s still lots more to go. What we have now is an app that fires up; displays a default loading screen; gets people to a screen that shows three cards (back of the card showing); they can select any/all of the cards and the cards flips to show the front of the card; they can click on a button labelled “Try Again” to reset the cards; they can click on a button labelled “Customize” that opens a new screen; the “Customize” screen allows you to enter text into 3 separate fields with a max of 25 characters in each field; and you can get to the Info screen. We spend the last hour of the day together cleaning up code and discussing what we have left to accomplish tomorrow.
So, I prep all the app submission information while Roy is busy coding away, first searching the App Store for similar apps and their names. We like “Stuck?” and luckily no one else is using it, so we go with that name. I create the app description, add some keywords, set the price and determine where we want to sell this app (just in the USA, certain countries or worldwide). Then I register a domain name (stuckapp.com) to be used for the application URL/support URL and linked it to a newly created Tumblr account. I also created the required support email address. The other items you’ll want to prepare in advance are: screenshots (up to five), a large icon (512×512) and, if this is your first time submitting an app, any certificates/provisioning profiles.
Things tend to take longer than you expect, and even though we’re basically finished with the app by early Sunday afternoon, we still spend a couple of more hours tweaking it and preparing everything for the App Store submission – cleaning code and fine tuning as we go along. We spend the majority of the day on one computer pushing pixels, formatting, and ensuring the timing and user interaction was exactly as we both wanted. After almost five hours of work on Sunday, we have the app that we both envisioned. We begin testing in the iPhone simulator and then on devices (both iPhone and iPod touch) for stability and functionality. Again, being a simple app, it was easy and quick to test.
After proving its stability, we decide to publish Stuck? to the App Store. My first attempt at publishing another app by myself took two days – attempt, fail, Google, attempt, fail, Google more, etc – until it finally worked. But the second time around was much easier and faster. We copy/paste all the text prepared earlier and then added the screenshots and images. All in all, we have our app uploaded in about 15 minutes. At this point, we’re excited, hungry and tired, but also quite proud that we completed a solid app over a weekend in a coffee shop.
Especially after talking about building an app together for so long, like so many people reading this article, I must say, the fulfillment is immense. We finally did it.
2. Multitask. As suggested above, working with someone who complements your own skills allows you to multitask. What do I mean? For example, in the beginning, once you scratch out a wireframe of an idea, one person can begin coding – putting placeholder buttons and blocks into place. At the same time, the other person can create comps and then cut out each element to use when they get to the right stage. Also, at the tail end of the project, one person can wrap up the project and clean the code while the other prepares all the images and marketing copy for the App Store submission process.
3. Do at least one thing well. Unlike most desktop applications or web project, you have to remember that most good mobile apps fulfil a need that can come anywhere, any time. Your app idea doesn’t have to be complicated, but good apps seem to do one or more of these things well:
– Solves a problem; – Is entertaining; – Serves a specific niche; – Engages the user; and/or – Takes advantage of the unique features of the iPhone.
4. Set goals and milestones. Whether your goal is speed to market, just to gain experience, or to build the best damn app that does (blank), clearly state your goals. Initially, it will help you focus on the areas that are important/critical for success. It will also help you later down the road as you face hard decisions about “must-have” features and “like-to-have” features. Remember, you can always issue feature updates so focus on the “must-have” items and do whatever is necessary to meet that goal.
5. Get a Dropbox account. For small- to medium-sized projects, you cannot beat Dropbox. It allows you to store, share and synchronise files with others. Stop sharing files back and forth on your USB memory stick. Get a Dropbox account and share files in real time. We abused the hell out of our free, shared Dropbox folder and it worked flawlessly. For larger projects, you might want to give GitHub a try.
6. Test. Test. Test. When you see the finish line, it’s easy to gloss over the important step of testing your app. Test in your iPhone simulator, but also try to get your hands on an iPod touch and of course on an iPhone as well. Depending on the complexity of your app, you might want to create a test plan to make sure all the use cases and functional tasks are covered. The last thing you want is to have an app in the App Store that crashes or doesn’t work as expected. You may never recover from all the ego-shattering feedback.
7. Understand the App Store submission process. Apple provides a PDF document detailing to submission process. But that document is only available for registered developers. If you’ve already registered, read that document thoroughly before you begin the upload process. It will give you a good idea of what’s involved, but also what you’ll need to prepare in advance. Apple also provides some good tips for app store submission and approval .
Thanks to David Quinlan for sharing his story and advice with us. If his narrative has compelled you to try out Stuck?, it’s $1.19 at the App Store. And, of course, share war stories of your own long weekends writing apps in the comments. [Stuck]