Tools Of The Trade

So, what are the best tools for designing app interfaces?

Sketch

The #1 app that we use at Tapity is Sketch by Bohemian Coding. Photoshop used to be the clear leader for user interface design, but Sketch is starting to overtake it in the circle of designers that I know and respect. I like Sketch better than Photoshop because it was built from the ground up for building user interfaces, whereas Photoshop was built for modifying photos and has features that allow for app design. You can tell the people who built Sketch have designed a lot of apps and understand the unique challenges app designers face.

If you want to learn how to use Sketch to design iOS apps, I would highly recommend the Design + Code ebook by Meng To. He also has some free materials to get you started.

Photoshop

Photoshop has long been the tool of choice for UI designers, and Adobe does seem to be updating it to be more and more friendly towards UI designers. I think Photoshop has a higher learning curve than Sketch, so I would recommend Sketch for those just starting out, but a lot of designers still use Photoshop and it has its own advantages. For example, Photoshop tends to be slightly more stable than Sketch and there are a lot more resources for learning and using Photoshop since it has been around longer.

Supplementary tools

  • Teehan + Lax have the definitive iOS UI template for both Photoshop and Sketch, and it's free! This means you can drag over pixel perfect replicas of common iOS UI elements straight into your own designs.
  • Glyphish is the gold standard for iOS glyphs and icons. You often finding yourself needing a settings icon or just a good looking checkmark. Chances are, Glyphish has you covered. The good news is that Glyphish is giving my students a $45 discount! Just use this link to buy.
  • If you are looking to show off your app UI in a nice looking stock photo or background, Place.it is a great paid service for that and you can find some free templates easily on Dribbble. Speaking of which, Dribbble is a great place to find Sketch and Photoshop samples and templates. For example, just hours after the Apple Watch was announced, designers had posted templates that you can use to design your Apple Watch apps.
  • xScope is an excellent collection of tools to help with alignment, colors, and a ton of other things.
  • If you use Photoshop, you will want to use Slicy to export your designs into the format programmers will use them: PNGS.