Designing for Different Screen Sizes and Notches
Phones come in a huge variety of shapes, with different heights, widths, rounded corners, notches and camera cut-outs. An app that looks perfect on one device can look broken on another if it is not designed to adapt.
Responsive, flexible layouts make sure your app looks intentional everywhere, from a compact handset to a large flagship phone.
Why One Layout Is Never Enough
There is no longer a single 'phone screen' to design for. Handsets vary in height, width, aspect ratio and the shape of their edges, and the same device can be held in portrait or landscape. Designing for one exact size guarantees that the app will look cramped or broken elsewhere, so we build flexible layouts that adapt gracefully to whatever space the device provides.
What We Account For
- Variable screen heights and widths across devices.
- Safe areas: avoiding notches, the status bar and home indicators.
- Different pixel densities so images stay sharp.
- Text that may grow when users increase font size.
How We Build for It
Rather than fixed pixel positions, we use flexible layouts that respond to the available space, and we respect each platform's safe-area guidance so nothing important hides behind a notch or rounded corner.
If you need a hand with any of this, your Progressive Robot delivery team is ready to help. Raise a ticket from the Support area of your client portal or speak to your account manager and we will guide you through the next steps.