User Interface Design of Apple’s Latest Release iPhone 6 and 6 plus

iphone_6_plus_vs_iphone_6s_plus_thumb800

Apple’s recent release of the new revised version of iPhone as well as branching into completely a new product category- Apple Watch. There are many interesting aspects related to these new devices. Lets have a look at the characteristics and technologies related to UI design.

iPhone 6 and 6 plus

2014-09-09_22-38-02The new iPhones namely iPhone 6 and iPhone 6 plus comes with bigger display size than the current generation: 4.7 and 5.5 inches respectively. iPhone 6 has a resolution of 750* 1334 at 326 dpi. Whereas iPhone 6 plus has a display size of 1920* 1080 at 401 ppi density. The screen is hardware downsampled from internally rendered resolution of 1242*2208. This indicates the desire to throw photoshop out of the window. The two new phones has different characteristics such as different UI size elements, layout compositions, proportions, etc..with 6 plus additionally the new @3x asset size together.

Hardware resampling indicates that there will be no 1x lines that will be visible on the screen. Because of the flexible nature of iPhone displays the Auto-Layout concept in iOS 7 is further strengthened. Adobe photoshop is quickly becoming more and more obsolete than ever. It is going to be hard to work with the new resolutions . Additionally it is completely hard to predict how the designs work on the displays , even though it is projected live using tools such as Skala Preview, Xscope and LivePreview. On top of that because of such higher resolutions computer hardware requirements keep on increasing as it is needed to process them.

Auto layout and design

With iOS 7 the new concepts of flexible, dynamically adjusting and resolution independent UI were introduced. Earlier the same functionality was provided by Apple interface builder. The interesting feature associated with auto layout design is that it removes all the frustration that comes from working with classical design apps, constraints of raster graphics, time spend on adjusting faulty pixel grids, the nightmare of defining topography rules, performance inefficiencies, inappropriate UI design workflow, etc..

Auto layout removes all the complexities by provision of two major factors namely,

  • Providing strong foundation to iOS design language, applied to UI building in real time.
  • Allowing the developers to add strong , logical rules with which the interface will adhere.

With iPhone 6 plus as well as iOS 8 , we need to start thinking about the split view , the feature which was earlier available only in iPad. A completely new challenge was put forth by the small and more dense screen, different usage contexts and UI element sizes. But how to use split views? What are the creative ways of splitting the content on the phone into two panes?In order to hierarchize the content we stay with the constraints of Fitt’s law? Auto layout helps us in resolving many problems providing vital solutions.

Auto layout is not completely a design tool. The design of Auto layout is limited to a specific area. However as designers we still need to have the creative power of photoshop, sketch and firework to experiment and to go beyond iOS design framework. The following techniques can be used,

  1. Attain a mindset where singular pixels, pixel perfect accuracy and microscopic details doesn’t matter.
  2. When your canvas is large and dense users will not look at your pixels. More attention should be given to typography and interesting layouts.
  3. Pay attention to typography and interesting layouts.
  4. More time should be spend on creating behaviors and responses to user actions.
  5. Obsess over transformation and speed curves.
  6. Prototype the hell of it.
Reachability

use-reachability-iphoneBoth the iPhone 6 models fail to satisfy the Fitt’s law and the reachability feature compromises that. The screen contents move down or shrinks with the users hand by double tapping the home screen. Though this may not be elegant in theory, but big screen and the functional one finger operation requirement?

Large screen invokes new innovation design solutions. Since the version one iOS has been sticking to  the paradigm of keeping the linear navigation elements at the top of the screen. With iPhone 6 this doesn’t matter anymore. Apple introduced swipe to go back in iOS 7 to resolve the usability problems of iOS6. All these clearly demonstrates the different features and functionality of iPhone 6 and 6 plus. For ios application development contact sales@veltrod.in.


About Author

Madhumitha Srinivas

I am an avid reader. My ultimate goal is to convey complex information in a much more simple and interesting form.

For business enquiry, please contact us

TOP BLOGGER

© Copyright 2013 Veltrod Scroll Top