Projects
Microsoft Outsource Leysi Piton Three Pillars Access Direct Giga Graphic Design
Resume

Client

Microsoft Shopping

Role

Product Designer — interaction, visual, and cross-platform design

Timeline

Multi-quarter program

Platform

Web / Edge / Mobile

Bringing clarity to cashback across Microsoft Shopping and Edge

Overview

The Cashback Hub lets users track, manage, and redeem cashback rewards across Microsoft Shopping surfaces. I led end-to-end design — interaction, visual, and cross-platform layouts — for the full hub, stores search, interstitial pages, and the Edge Shoreline companion pane. The goal was a clear, trustworthy, and engaging experience that aligned with Microsoft branding and the constraints of every surface it appeared on.

Problem

Users struggled to understand the cashback journey. They didn't always know whether rewards were activated, pending, or redeemable, and the delayed payout system of up to sixty days caused confusion. Existing dashboards were unclear, lacked hierarchy, and didn't surface actionable next steps.

Role & Collaboration

I owned design end-to-end and partnered with PMs, engineers, and researchers across Microsoft Shopping, Edge, and Windows. The work spanned interaction patterns, motion, copy, iconography, and visual language — bringing the hub, stores search, the Edge Shoreline pane, and seasonal campaigns under one consistent system.

Joining the program

Onboarding had to set expectations about how cashback actually works — rewards activate when users shop through Microsoft Shopping and pay out after a confirmation window. Light and dark variants were tuned for Windows, Edge, and web surfaces.

Activated rewards, clearer status

Status hierarchy was the core of the redesign. The hub surfaces activated, pending, and redeemable rewards with consistent terminology and color so users always know where each reward sits — and what to do next.

From pending to redeemed

A delayed-payout system of up to sixty days needed careful interstitial design. Awaiting and redemption states explain what's happening, why, and when funds will be available — without burying users in fine print.

Awaiting confirmation state for pending cashback

Edge Shoreline companion pane — cashback tab

Edge Shoreline pane

A compact companion view for browsing sessions shows activation status and guides users to merchants without leaving the page they're shopping on. Designed to feel native to Edge while keeping the full hub one click away.

Stores search page

Search results balance dense merchant data with scannable hierarchy. Cards surface percentage, category, and activation state — and the layout adapts cleanly between light and dark modes.

Triple Cashback Tuesday

Campaign banners had to read as exciting without breaking trust. Triple Cashback Tuesday uses bold typography, focused color, and clear value props — translating cleanly across desktop and mobile entry points.

Process, impact & takeaways

Research clarified pain points around delayed cashback awareness, and close collaboration with engineering kept the design scalable and responsive across multiple form factors. Iconography, color, and interaction patterns were aligned with Windows and Edge while preserving Microsoft Shopping's brand integrity.

The redesign improved user understanding of the cashback journey, reduced confusion around activation, pending, and redeemable states, and increased trust and engagement with featured promotions. The patterns we built around status, terminology, and next-step guidance now travel with cashback wherever it shows up across Microsoft Shopping — including the upcoming Copilot integration.

The biggest takeaway: clarity in financial interactions is non-negotiable. Balancing platform constraints while designing cross-surface experiences that scale from compact panes to full-page hubs forced a tighter design language, and that language is what makes the program feel coherent today.