Google · Android

Turning a fragmented surface into an adaptive logic

Role

Project Owner
End-to-End UX & Visual Design (100%)

Scope

Started solo without a PM — from problem definition to spec

Duration

2024.03 – 2024.05 (selected works)
2024.01 – 2026.03 (full engagement)

Platform

Phone, Foldable, Tablet

The challenge. Moving Overview to a denser grid on large screens took away the space for smart action buttons, which broke accessibility and consistency across devices.

The approach. I ranked every feature on the surface by function, then tested one hypothesis: what if extraction moved to Select mode, where the same tools already lived? Usage data confirmed it and aligned the team.

The impact. I set the rule for what belongs on Overview, and that definition prepared the surface to become Android’s multitasking hub. Pixel’s premium features now stay whole on every form factor instead of disappearing on foldables and tablets. Switching off extraction that barely one percent of users touched also took redundant processing off the device, which helps battery life.

01 Context

Why it matters

A multitasking hub

Multitasking Hub

Overview is the central intersection every Android user passes through daily. As displays scale up, it grows from a simple app switcher into a hub for Desktop Windowing and the broader multitasking features.

Grid update

Scaling information density

To support emerging multitasking capabilities such as drag-and-drop split screen, the layout required a higher density grid.

Legacy layout
Single focused tile

Single focused tileGenerous space allowed a dedicated row for smart actions underneath.

Updated grid
Uniform two-row grid

Uniform two-row gridDoubled app visibility, but completely removed the space for action buttons.

Drivers

Why the grid was updated

Two forces pushed Overview to a new tile size and a new grid, and the gap this project closes opened here.

Driver 01 · User feedback
Users wanted to see more apps at once

Users wanted to see more apps at onceEven on large screens only two or three apps were visible; unifying tile size more than doubled how many fit on one screen.

Driver 02 · Platform goal

Becoming the multitasking hubDragging a tile straight into split screen was coming next, and that only works once tile size and layout rules are settled — so the grid had to change before the feature could land.

02 Problem

Spatial conflict

Where do smart actions go when the space is gone?

The denser grid forced smart actions off the screen on larger devices. Simply hiding these features to save space left three critical usability debts.

Spatial Conflict
01 · Inconsistency
Device inconsistency

Device inconsistencyFeatures present on phones disappeared entirely on foldables and tablets.

02 · Accessibility
Accessibility barrier

Accessibility barrierThe only software path for a one-handed screenshot was severed — the alternative is pressing two hardware buttons at once.

03 · Collision
Feature collision

Feature collisionImage extraction and digital wellbeing occupied the exact same coordinate, and the existing fix was to switch extraction off.

03 Approach

Feature hierarchy

Function dictates placement

P0 · Essential

App chip

App chip

P1 · High-value — unique to Overview

Screenshot

Screenshot

Select

Select

Digital wellbeing banner

Digital wellbeing banner

P2 · Contents extraction

Link extraction

Link extraction

Image extraction

Image extraction

Fitting every button into a shrinking footprint is a losing battle against finite screen space. Relying on product intuition, I changed the question: instead of asking how to arrange the buttons, I asked if they belonged here at all. I sorted every intersecting feature into a strict hierarchy: essential, high-value, and contextual.

Hypothesis

What if extraction moved to where it already lives?

Hypothesis

Link, image, and text extraction sat on the highest-priority spot of every tile. Yet Select mode already offered the same three tools, in the context where users pick content on purpose. My hypothesis: moving extraction out of the top layer would free the surface without taking any capability away.

Validation

Aligning the team with usage data

When stakeholders pushed for a “more features are better” approach, I didn’t argue from taste. I tested the hypothesis against engineering telemetry.

The data confirmed it: the P2 contents extraction features accounted for barely one percent of usage, while duplicating capabilities already housed in Select mode. That result turned the hypothesis into the core decision: relocate contextual features to their native environment, and free the surface for essential actions.

04 Decision

Feature relocation

Extraction moves into Select mode

Migrating image and link extraction into Select mode removed redundant processing, which reduced power draw, and resolved the spatial collision on the top layer.

Relocation

Before · Surface overload

Cluttering prime real estate

Low-usage features consumed critical space, forcing core actions off-screen on larger devices.

After · Contextual alignment

Consolidated mental models

Moving extraction to Select mode united related actions under a single, logical workflow.

Design iteration

Where should Screenshot sit when banners take the space?

With the surface cleared, Screenshot and Select had to stay reachable in every system state, from default to maximum banner intrusion. I evaluated three placements.

A · Centered banner
Accessibility failure

Accessibility failureUnpredictable contrast against the underlying app content.

B · Right aligned
Muscle memory break

Muscle memory breakShifting button positions severely impacts predictability.

C · Icons only
Clarity cost

Clarity costSolves the spatial constraint, but drastically increases cognitive load for first-time users.

Screenshot stays; Select moves to the chip menu

Further research showed no benefit to keeping Select and Screenshot side by side on the primary surface. I moved Select to the chip menu, leaving Screenshot as the only protected action on the main layer.

05 Result

Adaptive UI rule

The adaptive UI rule

The final rule responds to available space: a clear text label by default, compressing to an icon only when edge-case banners demand maximum space.

Default state
Optimized for clarity

Optimized for clarityA full text label leaves no ambiguity for users.

Maximum state
Graceful degradation

Graceful degradationCompresses to an icon only during rare banner intrusions, keeping the function.

Device consistency

Each tile carries only what it needs

Before
Redundant controls

Redundant controlsEvery tile surfaced extraction controls, whatever the task.

After
Contextual anchoring

Contextual anchoringOne action, anchored to the tile in use.

The same rule on phone, foldable, and tablet

Device Consistency

One rule now runs across every form factor. Features that used to vanish on foldables and tablets stay in place, with no exception layouts to maintain.

Reflection

System logic over visual noise

Good visual design isn’t about cramming every button onto a screen. It’s about understanding user intent and building the structural rules that serve it.

Users don’t read design guidelines; they experience predictability. That invisible system integrity is the true measure of design success.