Optimizing for High Resolution

With OS X and iOS, it’s easy to make apps look stunning on any display. By optimizing your graphics for high resolution and letting the system frameworks do the rest, you can ensure seamless transitions between standard resolution displays and the Retina display.

Mac Apps

iOS Apps

Safari and Web

Tips and Best Practices

Take advantage of the built-in support for high resolution. Use standard AppKit views, vector-based drawing, Cocoa text, and the most recent APIs for loading images.

Tips and Best Practices

Avoid caching textures when you initialize your app. Instead, consider a strategy that accommodates changing the texture based on the resolution of the display.

Tips and Best Practices

Create a set of icons that includes @2x and @3x versions, designing each for the target resolution. From a perceptual standpoint, a 16x16@2x version is not equivalent to a 32x32 version because high-resolution allows for greater detail.

Tips and Best Practices

Even-sized dimensions are best when it comes to designing UI elements. Even-sized artwork placed in an odd-sized box on standard resolution will be offset slightly when viewed on a high‑resolution display.

Tips and Best Practices

Make sure your code works with multiple displays. Users can drag any window of an app between low and high resolution on Macs that use external displays, projectors, and mirroring. The transition from one to the other should be smooth.

Videos

Submitting to the App Store

To ensure your apps look their best on the App Store with the Retina display, upload high resolution screenshots and icons with your app submissions. For more information on submitting your apps, read the iTunes Connect Developer Guide.