background preloader

Mobile

Facebook Twitter

Starter's Guide to iOS Design. As someone who does work on both the development and design side of iOS apps I find that many designers struggle with the transition to UI work, or with the different processes involved in iPhone and iPad app design.

Starter's Guide to iOS Design

In this guide I'll describe the deliverables you'll be expected to produce, outline the constraints of the medium and introduce fundamental iOS and UI design concepts. The Medium Knowing your medium and its quirks is an important part of being a good designer. I'm sure you've been witness to large print-outs with horrible pixelation artefacts - the result of misunderstanding print media. Similarly misunderstanding the role of pixels on screen can result in blurry, squished, or pixellated designs. iOS devices come in two main form factors, the iPhone and the iPad[…] For simplicity I'll be leaving the iPod Touch range out.

Retina Most recent iPhones and iPads are fitted with Retina screens, a high resolution screen intended to make pixels invisible. Pixels Points Storyboards Segues. Android Asset Studio. Teehan+Lax Density Converter. Android Photoshop actions to export to mdpi hdpi xhdpi xxhdpi and xxxhdpi - Stéphanie Walter: Webdesigner - UX-UI designer. In 2012 I created a Photoshop quick action to export Android assets in different formats.

Android Photoshop actions to export to mdpi hdpi xhdpi xxhdpi and xxxhdpi - Stéphanie Walter: Webdesigner - UX-UI designer

The devices have changed a lot since 2012, and so did the Android assets formats. Ldpi (low dpi) is gone, and we have new formats like xxhdpi and even xxxhdpi. I updated the script and now my Android export action can export to xxhdpi and xxxdhpi as well. To know a little bit about Android icon formats you can read the iconography part. The action set still works the same way as the previous ones. This means that you can use them for any drawables, not only icons. In the .zip file, I included the folder structure.

Finally note that the script works using “save for the web”, so you can basically export all your assets in one click if you are using slices. You can download the script here : Android Photoshop V2 Looking for a Web or UI designer, for a site or mobile application ?

Apps

The iOS Design Cheat Sheet Volume 2 - Ivo Mynttinen / User Interface Designer. The iOS Design Cheat Sheet - Ivo Mynttinen / User Interface Designer. Great tips to improve your iOS design workflow.

The iOS Design Cheat Sheet - Ivo Mynttinen / User Interface Designer

This article is outdated. The current version of this article includes data for newer iOS devices such as iPhone 5 and the new iPad. Check out the iOS Design Cheat Sheet Volume 2. When you are designing a lot of applications for Apple’s touch devices like the iPhone or iPad you often have to follow some conventions regarding sizes or radii of Icons, Buttons or Tables. Because it is always a big time loss if you have to search on the Web for this information again and again, I’ve put the most important specifications into a nice iOS Design Cheat Sheet. Download the iOS Design Cheat Sheet You can download the Cheat Sheet as printable (300dpi) PDF or as normal sized PNG. While I’ve found out some information on my own, these guys provided some very helpful details via Forrst or Twitter too: Sean Nicholls and Fabio Basile.

Some Tips that can be useful The Help Sheet offers the most important information but the devil is in the detail. Any additions? iPhone Drawer Navigation Screenshots.

Kits

Guidelines. Articles.