Outlook iOS & Android

Dynamic Action Bar

Design Manager & IC · 2024-2025

A design led initiative improving action consistency, customization, and Copilot integration across mobile.

Impact: Unified actions, customization, and Copilot entry across Outlook mobile & desktop; reduced design debt and set a scalable pattern for future AI-powered actions.

Status: Shipping • Format: Public skim • Date: 2025-10-05

Context

How & Why

From Hack Week to Strategic Priority

In March 2024 I started as a small design led concept that gained visibility as Outlook prioritized making Copilot more accessible and valuable for everyday users.

Supporting a Core Business Strategy

Improving how people access and use Copilot has become a key part of Microsoft's broader strategy to drive AI engagement and deliver more customer value within Outlook.

Shaping Future Patterns

The Dynamic Action Bar is beginning to roll out across Outlook mobile experiences with potential to influence how actions and Copilot are integrated across Microsoft apps.

2) Challenge

  • Fragmented action placements and behaviors across surfaces.
  • Hard to add/scale Copilot actions consistently.
  • Needed a flexible, cross-platform interaction model that preserved muscle memory.

Leadership angle. Align many teams with different priorities; make a clear, business-backed case.

IC angle. Rapid exploration, prototyping, and pattern definition to turn fuzzy AI needs into concrete UI logic.

Before/after action layouts

My Role

Leadership & Design

Manager & Leadership

  • Framed the opportunity to make Copilot more accessible through simpler, smarter actions.
  • Aligned partners and leadership on direction and business impact.
  • Managed and coached designers, ensuring craft decisions and strategic goals connected.

Individual Contributor

  • Designed and prototyped early concepts for adaptive interactions and Copilot entry points.
  • Partnered with Design, PM and Engineering to scale models.
  • Delivered interactive patterns that shaped Outlook's and Microsoft mobile experiences.

4) Approach & Process

  • Hack-week spark → design studios → multi-platform workshops.
  • Interactive prototypes to validate hierarchy, customization, and Copilot behaviors.
  • Action taxonomy mapped across endpoints; aligned with command palette and system patterns.
  • Guiding principles: clarity, adaptability, cognitive continuity.
Flows and sketches
Reflection: Which principles guided decisions here?

5) Outcome & Impact

  • DAB approved and shipping across Outlook Mobile & Desktop.
  • One unified interaction model for present and future Copilot/contextual actions.
  • Reduced design debt by consolidating multiple action systems into a flexible component.

Soft impact. Became a reference pattern for other Copilot-integrated experiences and strengthened trust in design-led framing and prototyping culture.

Final UI composite

Prototype video:

Reflection: What changed for users, the business, and the team?

6) What I Learned

  • Vision needs persistence. Good ideas can outlast the first window.
  • Prototype > deck. Interactive demos align teams faster.
  • Player/coach balance. Shape the strategy, model the craft, then let the system stand.

Visual Asset Checklist

  • [ ] Hero: composite or micro-demo (mobile + desktop)
  • [ ] Timeline: hack → prototype → funded → shipping
  • [ ] Before/after: legacy vs DAB layouts
  • [ ] Taxonomy diagram: actions across endpoints + Copilot zones
  • [ ] Final UI: annotated states and customization moments
  • [ ] Short prototype video (30–45s)

Notes: Confirm what stays public vs what moves to a private deck. Add links to related work (Copilot Reading, Fluent 2).