OneUI - Design | Samsung Developers

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.

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.

①Apps should be resizable

②Apps should support landscape

③Apps should provide a large screen layout

Find out more on

  • App continuity

    Android Developers

  • App continuity

    Samsung Developers

Things to check
  • 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.
    Find out more on

    • Different screen sizes

      Android Developers

    • Responsive UI

      Material design

    Things to check
  • 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

    Things to check
  • 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.
    • Layout design for large screens