In designing the user interface for an iOS application, we're lucky that very few tools are required during the production process. That being said, this does mean that the tools we do need are that much more important when it comes to producing a quality application.
Let's look at what hardware and software we're going to need in order to develop the best interface possible for our application.
The first thing we need to do is pick up a capable computer for design work. Since we're developing for iOS, a Macintosh is definitely preferable if not required. If we're not going to be doing any programming, it could be possible to get away with a PC that runs Adobe Photoshop, but this is not recommended. Without a Macintosh, we will not have access to the iOS Simulator and other tools that Apple provides for design.
All other things being equal, a quality monitor of significant size may be the most important attribute when picking up a computer for design work. The iMac or a Mac Pro with Cinema Display may be the best option, but a Macbook or Macbook Pro is certainly sufficient. Given the Retina display of the iPhone or large display of the iPad, we'll want to have as much room for high-resolution art on our monitor as possible.
Currently, the Mac Pro is the only Apple computer that is easily upgradable after initial purchase. With a slight bit of tinkering, it's easy to add more RAM or install a new hard drive on the professional grade machine, so it should be our first choice if we're looking for a device to build upon in the future.
In comparison, it is relatively difficult to upgrade an iMac, Mac Mini, Macbook Pro, Macbook, or Macbook Air. Any Apple computer should be more than capable of producing exceptional UI design, but this lack of expandability should be something to keep in mind in case we plan on upgrading our machine down the road.
Pick up a copy of Adobe Photoshop and if possible, Adobe Illustrator. Adobe offers a variety of packages on software, which can all vary greatly in price depending on our needs and circumstances. When it comes to design and graphic production, Adobe is the gold standard and we can never go wrong by having their design suite on hand. Ultimately, Photoshop is really the only application we will need, but it never hurts to have Adobe's entire design suite just in case.
Many designers like working in Illustrator because it makes it easy to do vector drawings, which are resolution independent and work well if we ever need art for a magazine ad or promotional banner. We also never know when Apple will increase the resolution on iOS devices, as they did in 2010 with the Retina Display, and it is much easier to upscale artwork for higher resolution screens when resource files are easily available in vector format.
If Photoshop is out of our price range, fear not, as there are several other raster graphic programs that can help in the design process. Acorn by Flying Meat Software, found online at http://flyingmeat.com/acorn/, is an extremely capable image editor that can be purchased for only $50. Acorn is fundamentally similar to Photoshop, so moving between the two is quite easy.
We'll also want to make sure that we've downloaded the latest version of Apple's iOS SDK tools as well. The iOS SDK can be downloaded for free from Apple's Developer Center, regardless of whether we are registered in the iOS developer program or not. When we're ready to download the SDK, we can visit http://developer.apple.com/devcenter/ios/index.action.
If we're not performing any of the programming for our application, we could get away without using or learning how to use the iOS SDK, but this is not preferable. The iOS SDK, along with XCode, allows us to change art resource files quickly and then launch the iOS Simulator to see how resources look when running in our application.
While this seems like a fairly limited tool set, we should be able to compete with nearly any user interface in the App Store once we have these items. Anything we can't build in code can be produced in Photoshop, which gives us the flexibility of only needing one application for the majority of our work. The negative side to this is that we're going to be spending a lot of time in one application, so we need to be comfortable in the image manipulation program.
We won't dive too deep into Photoshop in this book, so you may find yourself struggling a bit at first if you've never used the application. Luckily, there are many resources available to help teach Photoshop, written by individuals who are extremely talented with the application. A simple web search of the Photoshop technique you're looking to learn or a stop by a bookstore should provide more than enough information on improving our Photoshop skills.
Many websites and blogs focus primarily on the design of iOS applications. Here are a few handy resources that can help inspire and educate.
iDev101 offers a great breakdown of the exact sizing requirements of different iOS UI elements, which can be found at http://www.idev101.com/code/User_Interface/sizes.html.
The iPhone GUI PSD http://www.teehanlax.com/blog/2010/08/12/iphone-4-gui-psd-retina-display/ is an extremely handy Photoshop file compiled by Teehan+Lax. The file typically sees an update whenever Apple makes changes to UI elements, making this an extremely valuable resource for any designer.
365PSD is an extremely useful site by Dutch designer Jonno Riekwel, which releases a new Photoshop file per day as a free resource. A good deal of the posts focus on iOS and the files can be a great way to learn first hand how a specific UI effect was performed in Photoshop. To download files from 365PSD, we should visit http://365psd.com/.