In 2019, when Samsung introduced the Galaxy Z fold everyone understood that a new trend had come to the market. Experts believe that these foldable devices will change the market scenario. These devices can replace mobile phones, tablets, and even laptops also. These devices are very much sufficient in technology and their portability is a given advantage. If you want your app development to be ahead of time then choosing app development for foldable devices is a must-pick option. Let’s dig deeper into what are foldable devices.

What are foldable devices?

In foldable devices generally, there is a fold or hinge in the display. This device has the capability of extending the display behind the fold or hinge. It’s similar to using the old Nokia mobile phones where there was a fold. The term foldable devices came into existence first in 2008 when Nokia released the morph concept. The first foldable device was launched in 2018 by Royal Flexi.

The most amazing feature of this phone is its display. These devices have an OLED flexible display that can be folded or extended with a double-size full-screen display. Users can curate the content in a more immersive way. The most recent example is Galaxy Fold Z3. However, this technology is predicted to become more popular with the advantage of time. According to Statista, there will be 55 million devices available for the ship in 2025.

What are the impacts of foldable devices on app development?

While this technology is pretty much exciting from the user’s point of view. There is no clarification on how foldable devices will impact app development, however, there are many significant changes that are discussed below:

• Extra screen estate: The main idea behind this device is an extended display. Users will get an immersive experience because of the large screen size. Thanks to foldable devices you can convert a single screen into a large two-screen display.
• Small size: Today people are confused about buying mobile phones with a small screen or buying a tablet with a large screen. Well, this confusion is sorted with the help of foldable devices.
• New content types: Thanks to foldable devices content creators can create their content straightaway on their smartphones and the large screen will create many immersive contents.
• More features: Traditional smartphones have a limitation in the screen display. You cannot have multiple apps on a single display. In foldable devices, you can operate multiple apps on the same screen. This will help users to access a lot of features on a single screen.

Requirements for apps for foldable devices

Constant changing screen size and accessibility of multiple apps on a single screen require a different app development approach. Here are the key requirements for apps for foldable devices:

• The main thing users want is a continuous experience. Application development for foldable devices should cater to the different screen interfaces. Users should not lose any progress or functionality as a result of the resizing. Apps should be seamless, no matter the size of the screen.
• Developers need to develop a desktop-like version due to the large screen but the app’s experience should be according to the native application. This requires multiple approaches of desktop and mobile phones. The apps should have the functionality of operating multiple apps on a single screen.
• Developing different interfaces for different screens. Developers and designers should develop the application keeping in mind both small screens and foldable screens. The unfolded app should provide additional features.

Types of applications for foldable devices

Foldable devices are just not technology for gimmicks there is more to it. This technology comes with multiple benefits and a multi-screen approach. Here are the examples of apps that can be innovated for foldable devices:

This technology is perfect for multi-taskers so the first ones to be benefited from this technology will be social media creators and news applications. While developing an application it is good to track your code and to see it perform. This technology is beneficial for app testers and app developers for testing applications on the go. Multi-taskers will be benefited from productive apps like Canva, and Adobe Photoshop even web applications can be accessible on foldable devices.

Now let’s dig deeper into a step-by-step guide for developing apps for foldable devices.

Step-by-step guide for developing applications for foldable devices:

So far the applications are only available for Android devices because Apple has not yet launched any foldable devices and there are no immediate plans for launching any foldable devices. The process of app development is the same however there are certain things to keep in mind. The main differences in this application are ratio, screen size, and density. The process is boiled out into 3 simple steps:

• Resizing the app

For enabling a seamless experience focus on providing seamless resizing. You can do that by adding resizableactivity= true, by allowing this your application will adapt to the interface you are accessing. Use a foldable emulation for seeing how your application will look on foldable devices.

For some apps with complex functionalities or complex graphic interfaces, it might be possible to keep the code as resizableactivity= false. For that type of application set the resolution at max aspect ratio. This will keep the app running in its original dimensions and deliver the same experience.

• Setting up multi-windows user experience

On foldable devices, you can have multiple apps open and running at the same time. These apps can be interacted with each other with drag and drop, receive updates and send alerts. To make this feature you need to set the activity to “ true “ as demonstrated above.

The next step is enabling Android support by placing the code like this android:supportsPictureInPicture=[“true” | “false”]. This will support interaction between tabs and keep both apps in an active state. For controlling interface display, editing layout, and setting up dimensions for Windows.

<!-- res/layout/main_activity.xml --><androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- content view(s) -->

    <com.google.android.material.bottomappbar.BottomAppBar
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        ... /></androidx.constraintlayout.widget.ConstraintLayout><!-- res/layout-w600dp/main_activity.xml --><androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        ... />

    <!-- content view(s) --></androidx.constraintlayout.widget.ConstraintLayout>

With the use of foldable devices, it is a procrastinator that in the near future, these devices might integrate with multiple devices allowing functions like sharing or split-screen, connecting two devices at a single time. This activity can be enabled by setting a secondary display. The changes are enabled in the configuration panel. The developers need to set up a secondary display version and test it on emulators.

• App testing for multiple devices on emulators

For testing the foldable apps you need to check their configuration changes, check out layouts of multiple windows, control screen ratios, and run interface changes. For getting a fresh perspective on in-app interactions you need to connect emulators.

Like it   

Share it   

16 Feb

6 min

455

33

What Others Are Reading

22 Sep

4 min

1.5K

507

People ManagementArt of Storytelling in Technical Project Management

21 Feb

3 min

740

562

UI/UX DesignDifference Between Wireframes, Mockups and Prototypes