The iOS is considered to be the most expensive mobile operating system in the world. The reason was that apple created iOS only for their devices, which are very expensive. Apple mobile devices started evolving with the introduction of the first smartphone (iPhone) back in 2007. There after apple started innovating new line of mobile devices and they were created according to the user needs in different sizes.
Apple iPhones were their first mobile devices. In year 2010, apple introduced a new product called iPad. Apples started making billions with these products and developers started making mobile applications that fits the user’s needs. Developers had to make apps that fit the screen size of these different devices. The iPhone’s had different screen sizes while iPads were completely different. Below are the iPhone devices with corresponding resolutions.
Pixels are the smallest physical element that we can control on a digital display. The more pixels can be fitted into a specific screen size, the higher the PPI and the clearer the rendered content becomes. Points are a resolution-independent measurement. Depending on the screens pixel density, a point can contain multiple.
When you are designing for various display types, you should think in points, but design in pixels. This means you will still need to export all your assets in 3 different resolutions, no matter in which resolution you are designing your app.
People are currently using iPhone 4S to the latest iPhone model iPhone 6 plus. Apps are to be created for these models to display correctly according to the correct resolutions. When designing a mobile application for apple devices there are few things to consider.
Things to Consder
- Are things visible at different screen sizes?
Just like in responsive website designing, you need to check whether the content that you put on a specific app is visible correctly. After determining the size, the very next step will be to correctly display it to the user.
- Can fingers touch these things effectively? Are they too small?
When you make the components bigger or smaller to match a specific resolution, you need to determine whether the user can touch these components correctly. If you made changes to a certain button make sure it’s clickable by the user. If that button was placed in iPhone 4, you will probably need to change it to look good in iPhone 6 plus with a screen size for 5.5 inches. To support high-resolution graphics on devices with retina displays, create two versions of the image: a standard size image, and a double-sized image with added to the name.
- Is there too much white-space in larger screen sizes
Having too much white space in a design is not acceptable at all. That doesn’t mean that you have to stuff your background with lot of details. Add what is needed and as mentioned earlier create at least 2 versions from each. You don’t want to custom design for multiple form factors as it makes the app complex. Try to reduce the complexity and avoid using incompatible components for each.
How to design properly
When designing iPhone apps it is recommended to make prototypes prior to the final version of the application. By creating iPhone mockups you can easily create a working prototype. It is important to design mockups for various sizes and functionality. By doing so you can make sure that your design will fit any screen.
Do wireframes with actual images, put them on the phones and see if you can work with them. Then you’ll know how each screen works and how it appeals to the user. Change accordingly and make a final version that is compatible with all screen sizes.
Example: Edit Profile
When implementing, use responsive components where possible or use different layouts for different sizes. Using apple predefined font packs can reduce the amount of risk your text not being displayed. You can check the colors with the retina version of the MacBook as they pretty much share the same screen panels.
The more specific and detailed you create your app, the more likely users are to get it right. Creating something like this seems like a momentous job, but it reduces significantly the amount of time you’ll need going over your designs with a developer. Plus you’re much less likely to be annoyed by incorrectly implemented UI. Make sure that you always think as a designer than a developer when creating iPhone apps. Always follow your iPhone mockup software to get an idea about your apps right.