Designing For Device Orientation: From Portrait To Landscape

The accelerometer embedded in your smart devices is typically used to align the screen depending on the orientation of the device, i.e. when switching between portrait and landscape modes. This capability provides great opportunities to create better user experiences because it offers an additional layout with a simple turn of a device, and without pressing any buttons. However, designing for device orientation brings various challenges and requires careful thinking. The experience must be as unobtrusive and transparent as possible, and you must understand the context of use for this functionality.

YouTube’s mobile application is a great example of device orientation design. Portrait mode offers a feature-rich interface for video discovery and the user’s account. Landscape mode provides an immersive experience with a full-screen video player and playback controls. When the video ends, the display switches back to portrait mode, prompting users to quickly tilt the device back and browse for additional videos. To help UX professionals and developers, Avi Itzkovitch has categorized four main patterns of device orientation design. Fluid - this interface simply adjusts to the new orientation’s size. Extended interface adjusts to the screen’s size, adding or subtracting layout components according to the dimensions of the chosen orientation.