Windows Out of Box Experience

I led design and front-end engineering, partnering with at least 18 product teams across Microsoft to redesign the Windows setup experience. By creating a more personalized and inclusive journey for Windows 10X and Windows 11, I helped shape an experience that touches over a billion lives worldwide.

Windows onboarding
Year2019-2020
RoleEngineer and Designer

Windows 10 vs New

The Windows out-of-box experience on Windows 10 was outdated. Setting up a new PC felt like a checklist — long, impersonal, and disconnected from the rest of the OS. New setup experience had to be shorter, responsive, personalized, engaging and delightful compared to Windows 10 experience.

Layers

We unified these with layers of SVG Motion, material, wallpaper and a container that flexes to device form factor.

One experience, many postures

Own the front end, iterate fast

I took on front-end engineering. I shortened Engineering timelines to 1/10th of original estimates and to make it faster to iterate, I created a web replica of Setup experience that used same UI components for interoperability, I put it on various device and iterated rapidly.

Prototype I built to iterate on the experience rapidly

Real code implementation for Windows 10X

Animations

I worked with the motion designer to define strategy for seamless animation transitions from page to page, its intro, pause and outro states, worked on few animations myself, and implemented to make experience feel seamless.

Before and After

This experience is shared across multiple teams, with at least 8 different front-end tech stacks. Creating a seamless experience required creatively problem solving each constraint one by one. Here're some before and after shots of some challenges I had to creatively problem solve.

Windows Hello

Account Sign in

Network

Celebrating the announcement

Celebrating the craft and what we built together on welcome users to new Windows 11 experience, here's I, Todd, Amanda and Jens talking about Onboarding.

Thanks for viewingBack to Projects