Design for foldable devices
Foldable devices are one of the latest trends we are seeing in mobile devices, and, in a way, they change the paradigm of how applications are used.
These devices, which can change shape by folding and unfolding, pose new challenges and opportunities for designers because we must adapt our approaches to create consistent and fluid experiences across multiple screen configurations.
Designing for foldable devices is not just about making interfaces look good on different screen sizes but about completely rethinking how interactions are structured and presented.
A device’s ability to expand and contract means that applications must be flexible enough to offer optimal functionality in both forms. This includes everything from designing adaptive layouts that can dynamically rearrange to implementing smooth transitions that maintain user context without interruptions.
Moreover, the unique nature of foldable screens allows for more ergonomic and customizable interaction. Users can enjoy devices that better adapt to their needs and lifestyles, whether they prefer a compact screen for mobility or a larger one for productive tasks and entertainment.
The flexibility of these screens opens up endless new possibilities in product design. Devices with flexible screens can bend, roll, and stretch, allowing for shapes and functionalities that would be impossible with traditional glass screens.
Advantages of foldable devices
Foldable devices offer a unique combination of portability and versatility, allowing users to enjoy a compact device that expands to a larger screen as needed.
This flexibility enhances the user experience by providing optimized viewing and facilitating multitasking, allowing multiple applications to run simultaneously. Additionally, the ergonomic and modern design is visually appealing and also improves productivity and creativity, offering more effective tools for professionals and artists.
Design challenges in foldable devices
Designing for foldable devices presents several unique challenges that must be addressed to create an optimal user experience. These challenges arise due to the devices’ ability to switch between different screen modes, requiring designers to rethink how user interfaces are structured, presented, and navigated.
- Interface adaptability: One of the biggest challenges is ensuring that the user interface is fully adaptable. This involves designing layouts that can smoothly adjust to different screen sizes and orientations. Interface elements must be reorganizable and resizable to maintain functionality and aesthetics in both folded and unfolded modes.
- Continuity of experience: Maintaining a continuous user experience is crucial when switching between screen modes. Designers must ensure that the application’s state and user context remain intact during these changes. This includes implementing smooth transitions that are visually pleasing and help users understand the change from one mode to another without feeling disoriented.
- Content optimization: Content optimization is another important challenge. The amount of information presented must be adjusted according to the available screen size. In smaller modes, it is essential to avoid information overload, while in larger modes, the content must fill the space effectively without leaving large empty areas, considering adequate white space. Additionally, text and images must scale appropriately to ensure readability and clarity in all configurations.
- Interaction and usability: Touch gestures and overall usability must be reconsidered to ensure they work consistently in both screen configurations. Users must feel that using the device is intuitive regardless of how they are holding or using it. Furthermore, it is crucial to ensure accessibility for all users, including those who rely on assistive technologies.
- Curved edges: In device design, curved edges offer innovations such as additional touch gestures and wraparound screens that can display notifications without interrupting the main activity. However, they present significant challenges, such as adapting the interface to maintain functionality and readability, repositioning elements to avoid unusable areas, and managing useful space to avoid losing important information and preventing accidental interactions that could affect the user experience.
- Flexible margins: For an adaptable and consistent design, it is essential to use flexible margins with units of measurement such as percentages or “viewport units,” which automatically adjust to screen size. Using relative units like “em” or “rem” instead of pixels allows elements to scale based on the base font size. Additionally, properly adjusting font and image sizes using relative units and size limits prevents clipping and illegibility issues.
- Features like multi-window and pop-up view on foldable devices significantly enhance multitasking and productivity. Multi-window allows users to run and view multiple applications simultaneously, optimizing screen space to perform various tasks in parallel. Pop-up view offers a floating window that can be moved and resized, providing a flexible way to interact with applications without interrupting the main activity. These functionalities enable more efficient time and resource management, facilitating a smoother workflow adaptable to the user’s needs.
In short, as UX designers, we face a series of different challenges that we must consider when designing for “normal” mobile devices or desktops. This is where the ability to translate the creative part into the technical part comes into play, making the experience fluid and ergonomic.
Visit UX Learn, our training platform, to see more about our Product Design courses (these trainings are in Spanish):
This is a translation of the following article from our corporate website:
