Google · Android
The challenge. Expanding a life-critical emergency app to the first Pixel Fold, where no foldable guidelines existed — against a physical hinge, and against a sign-in component owned by another team. An emergency app can be opened in a high-stress moment, so every critical string had to be readable at once, without scrolling.
The approach. Treat the hardware as a design input: the hinge shaped every layout decision. Design for both ends of use — the emergency and the everyday — so the app stays convenient and accessible either way, and test every layout in other languages. Where two system rules conflict, negotiate the alignment.
The impact. One readable experience across all four foldable screens. Approved by One Google, the sign-in sheet became a master component in Android, ready for the other pre-installed apps to adopt.
I designed the app’s whole lifecycle for its first foldable release. This page shows a few selected parts.
01 System alignment
Problem
Safety can’t hold someone’s medical data until they sign in, and the same Express Sign-in appears in two places: inside Safety, and in the setup wizard the first time someone sets up a Pixel. The component belongs to One Google and follows Google Material Design. The Pixel it runs on follows the Android system. Safety, meanwhile, had already customized its own version. One screen, three owners — and in a landscape foldable ratio, none of them had a bottom sheet to offer.
One sign-in, three looks: One Google’s component, Safety’s customized build, the Android system on Pixel
Landscape had no precedent to adopt, so Safety had built its own
Approach
Safety ships pre-installed on Pixel, and Pixel runs Android — so my goal was to give the sheet Android’s look. Buttons are what a user reads first on it, so I aligned the button system with Android’s. For the form I chose a shape Android and Google Material Design have in common: a Material shape that Android inherits and uses widely.
Reference: Android’s shapes, many of them inherited from Material
Portrait iterations: A adopts One Google’s component; B adds breathing space and Android’s buttons; C builds on B with the shape Android and Material share
Evaluation
One Google’s default full-width sheet pushed Safety’s critical disclosures below the fold. In a high-stress moment every critical string has to be readable without scrolling — so the two proposals were weighed against each other in both orientations, in front of both teams.
Negotiation
I negotiated the adjustment rather than forking the component. One Google’s identity in the flow — the account particle — stayed exactly as it was. In return Safety held Android’s chunky button style, which keeps the sheet compact enough for the disclosures to survive. Small enough for them to accept, short enough for Safety to stay readable.
The result
One Google approved it, and the sheet became a master component in Android: the default that other pre-installed apps can adopt. It reads the same in the setup wizard and inside the app.
Setup wizard and in-app, one unified experience
02 Hardware constraints
Problem
There were no foldable grid guidelines in the Android design system yet. An unfolded screen offers more room, but the hinge running down the middle of it is a physical vulnerability. Standard responsive design divides that screen evenly — which places the critical CTAs dead center, directly over the fold. In an earthquake or a crash, a damaged hinge makes those life-saving buttons unclickable. Beyond that, someone reaching for this app may not be able to unfold the device, turn it, or even scroll: tapping what is already on screen can be all they have.
Layout architecture across the four screens
Approach
I split the unfolded layout at the hinge instead of dividing it evenly, and aligned the center gutter with the gesture nav bar. That carries the critical actions off the hinge and into a column the thumb already covers. It breaks the grid on purpose, which is what keeps the life-saving features reachable even when the hardware is compromised.
The space left after the nav rail, divided evenly into two columns
The layout divides around the device’s hinge — the layout that shipped
Why not A: an even split drops the critical CTAs onto the vulnerable hinge line
The result
Every core feature follows the same split across the four screens, so the life-saving actions stay reachable even if the hinge is damaged.
Safety check
Fast emergency dialer
Emergency information
Early draft: the sign-in across the four screens
03 Home screen state
Problem
The unfolded landscape screen offers room the handheld never had. The illustration keeps a safety app from feeling clinical, but at this size it competes with the emergency tiles for the same space. Home also has two states that fill the screen very differently: a default one, and a complex one stacked with live notification cards.
Approach
Before placing anything, I ranked every feature on the home screen by how urgently someone needs it. P0 is what matters in the worst moment: the emergency actions. Everyday features such as Safety walk come next. The illustration carries the brand’s warmth, and it matters for those everyday moments — but in a crisis it comes last. I named it P9.
Not chosen: the illustration stays left. The empty space on the right looks unresolved, and with P0 actions floating over it, the illustration beside them makes the screen busier
Chosen: the left column carries only P0 tiles, and the illustration moves right
The result
The illustration moved to the right column. In the default state it sits in the right corner, keeping a clean entry point that puts the P0 tiles first. As notification cards fill that column, it moves down rather than competing with them. The layout reads like the handheld one: critical information always comes first, without losing the brand’s warmth.
Default: the illustration sits in the right corner, keeping the entry point clean
Complex: notification cards fill the right column and push the illustration to the bottom
Reflection
Cross-functional design is negotiation. The job is to find the compromise that protects the product’s core value while honoring the partner team’s intent — not to win the argument.
True quality came from optical balance and micro-detail tuned to human perception and an extreme physical constraint, not from blind obedience to a mathematical grid.