Since the iPhone app frenzy started back in 2008, we’ve had a number of people ask our advice for user interface designers designing their first iPhone app. The arrival of the iPad earlier this year pushed even more people to start thinking about designing for mobile devices.
As expected in any design process for new platforms, a number of interesting challenges appear everyday. Below we share with you a list of the most remarkable ones so you can anticipate and be well prepared when the time comes for your first iPhone or iPad app design.
A New Vocabulary
At Yu Centrik we have done a lot of design for the web, interactive TV and vocal interfaces. For each one of them we developed a vocabulary of terms we’ve gotten used to applying to our conversations with project stakeholders, project managers, designers, and developers. A common set of words that makes technical communication easier is important. Words like “layers”, “pop-up windows”, “drop-down menus” and others quickly become a shared dialect. If you are a long time user experience designer, you have likely used similar vocabularies in your projects without even knowing it.
When designing for the iPhone, you will quickly notice that none of these existing vocabularies is adequate. You will find yourselves looking for words to describe familliar-yet-unnamed interface elements. You will get e-mails from developers asking about behaviour and elements that you will barely understand, forcing you to spend time researching terminology before being able to respond.
In a short period of time, we were able to familliarize ourselves with terms like “Tab Bar”, “Segmented Control” and “Date Picker”, terms that are iPhone and iPad specific and are not used in other platforms. If you want an effective design process, I would highly recommend getting used to such terms as well.
Obviously, the biggest change in the iPhone and iPad interaction model is the fact that input comes from the user’s fingers. We can not only tap, but also use multiple-finger gestures (what Apple calls multitouch). You will not only have to learn which gestures are possible, but also test which ones are the most appropriate for your application, its usage context and its users. The next step will be to determine new ways to communicate the expected gestures (images, for example) effectively to developers.
Different User Interface Standards
Sometimes we may take it for granted that basic interface elements move from platform to platform as they evolve. We don’t typically expect them to change or disappear completely when new interaction models are created. One example is the checkbox. Checkboxes have been present in desktop software, web sites and interactive TV for a long time now. Even if you have used the iPhone for two or more years, you might not realize that checkboxes are not standard elements on iPhone interfaces: switches are used instead. Knowing simple things like this can save some precious design and development time.
What’s Included and What’s Not
Some hot discussions might take place when developers ask you for multiple images of button states when you specify that you want beautiful, embossed buttons like those we see in most iPhone apps. What you might not know is that the only button format available in the iPhone SDK is the simple flat ugly rounded rectangle button. If you want those beautiful glossy green buttons to confirm an action you have to provide images to the developer. This situation is parallel to that of the tab bar icons. There are only 12 of them, and not all the icons you see in Apple’s own applications are available by default; you have to produce them yourself.
Prototyping is crucial for any project. Without prototyping, it’s really hard to test different design solutions and see which one best solves your design challenges. But prototyping and testing for a mobile phone is not the same as prototyping for the web, where your prototyping platform is the same as the testing platform. We went through several prototyping stages, from paper to Keynote to Axure until we finally found an iPhone mock-up application called “Interface”, available at the App Store, where we can quickly check how our products will work in the real world.
The final challenge is to learn how to deploy the real application in test phones in order to both have people check for bugs and to show a realistic final product to your client. You will have to learn Apple’s processes for becoming a registered developer, for creating security certificates, for registering development devices and for installing the app. And let me tell you from experience: they are not as simple as you might think.
The more you learn before your first project starts the better. Learn your platform vocabulary: read the UI Guidelines more then once and write down the terms that are new for you, effectively creating a personal dictionary that you can refer to as needed. Get used to the gestures available in your device and use it in multiple contexts (standing under the sun, on the bus, in the office) until you are comfortable with the way you interact with it. Learn its strengths and weaknesses. Become a registered developer (US$ 99 / year) and use XCode (if you have a Mac) to learn what interface elements are available. Also, try different prototyping tools to see which one better matches your needs. I also highly recommend talking to an experienced iPhone developer to understand the development process, with a focus on which tasks are the most time consuming.. Don’t forget to ask for a quick overview of Apple’s processes so you can better understand them when it’s your turn to go through the steps of submitting your finished application.
Designing for a new platform is extremely exciting. While it requires a lot of research to understand the new interaction models and usage contexts, it also opens up a whole new world of possibilities to apply your user research, interface design and testing skills. With the right preparation, you can make a clear and problem-free step forward.