Many rumours are suggesting that the next iPhone, what many suspect will be known as the iPhone 6, is going to come with a much bigger screen, perhaps up to 5.6” in comparison to the 4” screen seen on the current iPhone 5S device. This extra screen space gives developers and designers the opportunity to do a lot more with their websites and applications as the larger screen space allows for more content to be displayed at once and in some cases can remove the need for users to scroll.
More often than not, when Apple releases a new operating system or device design, app designers and developers need to make changes to their own software to accommodate these introductions. Take the introduction of iOS 7 back in 2013, this bought with it a radical new design that was nothing like that we’d become use to.
Although not a requirement of Apple to change app designs, many app developers quickly updated their apps to take advantage of the new features that the operating system had to offer, complimented by improved designs to fit in with the new overall theme.
In the case of the introduction of an iPhone with a bigger screen, we are likely to see the need for app designers to make changes to accommodate the bigger screen size. Although this may sound inconvenient, it has benefits to offer including room for more features on one page and where appropriate, can help to make applications more accessible where larger icons are used for the visually impaired.
Fluid CSS designs
Where web developers have used fluid CSS designs, the increase in the screen size on an iPhone 6 is unlikely to be of much issue because such designs have been created to adapt to the size of the screen on the device that the site is being used on.
A fixed layout is no longer future proof, especially when we consider the relatively short period of time in which websites have had to make the transition from a table-based structure to CSS. However, early CSS websites also constitute a fixed layout and it is only with CSS3 and HTML5 that designers can create truly fluid designs that are able to adapt to the specifications on the device on which the web app is being rendered.
As a designer the most flexible way of creating a layout that is guaranteed to be compatible with the new iPhone and other mobile devices is to use proportional measurements as opposed to fixed measurements. A proportional measurement is measured as a percentage so for example if you assign a column the width value of 50%, whatever device it is displayed on that column will always remain 50% of the size of the screen or window. When the size of the screen or the window changes, the column will adapt to be 50% of whatever the new size is.
Whatever features Apple chooses to introduce with the iPhone 6, it is going to be inherently important for web app developers and mobile app developers to respond to these changes so that they can create products that exploit the latest technologies in order to deliver a rich end-user experience. Whilst such changes can be a pain to implement initially, they are vital if their products are to remain competitive with a solid and sustainable user base.