Designing for foldables

Samsung unveiled the Galaxy Fold in 2019, the first foldable device with One UI. Since then, we've partnered with companies around the world to optimize user experiences for foldable devices.
Galaxy Z Fold and Z Flip devices provide a seamless experience while users open and close their device.

Apps should provide an optimized experience for all situations, including when the device is open, when it is closed, or when it is partially folded. These guidelines can help you deliver enjoyable and productive experiences on foldable devices.

undefined

App continuity and responsive layouts

Galaxy Z Fold and Z Flip devices have two screens on the same device. The cover screen is visible when the device is closed, and the main screen is visible when the device is open.



Since users open and close their devices frequently, continuity between the two screens is important. Transitions between the cover screen and main screen should be seamless and intuitive. When users open their device, your app should appear on the main screen, right where the user left off.



1

Apps should be resizable

2

Apps should support landscape

3

Apps should provide a large screen layout

Find out more on

App continuity

Android Developers

App continuity

Samsung Developers

  1. When the user switches to a different screen, your app should fill the entire screen.
  2. If the user is viewing scrollable content, keep the scroll position the same when switching to a different screen.
  3. If the user was entering text before switching screens, the text input and keyboard should remain when switching to a different screen.

A responsive layout is also important for continuity between screens. Since Z Fold users open and close their devices frequently, your app should provide an optimized layout for each screen.



Different screen sizes

Android Developers

Responsive UI

undefined

  1. Make sure your app displays correctly on screens with various sizes, widths, and aspect ratios.
  2. Make sure your app supports landscape orientation.
  3. Make sure your app displays correctly on both the cover screen and main screen.
  4. Make sure your app fills the entire screen without letterboxing.

Flex mode

Partially folding the phone allows comfortable use while the device is on a flat surface, such as a table. Content is shown on the top of the screen, which is angled up. Controls and buttons are shown on the bottom of the screen, which lays flat. Apps should automatically adjust when the device is partially folded.

Camera & photo taking



Video playing



Video call



Find out more on

Flex mode

Samsung Developers

Support New Form factors

Medium

  1. Show content on the top and provide controls on the bottom.
  2. Show a visual transition effect when changing into or out of Flex mode.
  3. Avoid positioning interactive elements near the crease in the middle of the screen.
  4. Some apps or screens may not need to change their layout when the device is partially folded. For example, a list of settings.