PwC

A digital experience as good as engaging with PwC's best people.

A digital experience as good as engaging with PwC's best people.

overview

Tension

Despite its dominant status as a "Big Four" leader, PwC faced a distinct market hurdle: gaining the same high-profile recognition for its advanced technology, data, and AI capabilities as it has for traditional consulting.

Approach

Stepping in as experience lead following an extensive discovery phase, I translated aligned vision and core requirements into design execution over six two-week sprints. Managing a cross-functional team of five designers alongside engineering, SEO, strategy, and motion partners, we worked in parallel with a full design system revamp.

Creative roles

Experience Lead: Myself
UX Designers: Sam Truong, Emilano Ocantos

Systems Lead: Lauren Blackburn
Systems Design: Gabe Moise

Design Director: Ant Goodwin
Creative Director: Jake Welsh
Visual Designers: Arjun Menon, Vern Liu
Motion Design: Matthew Grice



ideation and exploration

We began by iterating on experience flows for key entry points like paid ad campaigns versus global search tailored to the C-suite and functional buyer. We used these flows and wireframes to demonstrate a high-level, consultative, AI-driven experience.

Entry
Entry
The COO encounters a PwC marketing piece directly relevant to their current focus: gathering ideas to reduce costs and improve patient satisfaction through AI.
First Interaction (Landing Page)
First Interaction (Landing Page)
Transitioning seamlessly from LinkedIn, the landing interface replaces static navigation with a dynamic text field that lets the COO ask questions, refine content in real time, and receive tailored contextual prompts.
Refinement
Refinement
After scanning content fragments, the COO uses the chat to focus on workforce shifts in healthcare. The agent responds with tailored insights and dynamic prompts—like generating a healthcare page or case study—for instant content refinement.
Dynamic Content (Generated Page)
Dynamic Content (Generated Page)
Choosing healthcare instantly rebuilds the page with a dynamic headline and tailored fragments, like industry audio and key data. This hyper-specific context quickly drives the COO into a deeper workflow with momentum-building suggestions.
Source Content
Source Content
Selecting the perspective tile opens a source content view that turns static reading into a collaborative dialogue. Instead of passive consumption, the COO can debate, brainstorm, and prompt the agent for instant deep-dives, like asking about AI cost implications.
Conversion
Conversion
As specific tasks emerge, the agent introduces a "Next Best Action" nudge to organically bridge the gap between digital exploration and real-world collaboration. If the source content lacks specific financial details, for example, the system surfaces relevant PwC expert profiles to initiate a LinkedIn follow or formal outreach, turning ideas into actionable relationships.

Sprint Planning

During sprint planning we broke the platform into its core experiential elements: the generative card grid, the individual content cards, the deep-dive pages they open, and the consultative AI sidebar. This sidebar drives the entire experience by generating new card grids, interrogating page content, and surfacing tailored next best actions.

Sprint 1: Content Cards

Sprint 2: Prompting and Conversation

Sprint 3: Source Content (Pages)

Sprint 4: Generated Card Layout & Grid

Sprint 5: Navigation and Measurement Strategy

Sprint 6: Holistic Experience

Sprint 1: Content Cards

In the first sprint, we ran 3 design workshops to establish the pilot experience's core content cards. We iterated on their functionality and grid architecture and aligned on a few key structural principles:

Hierarchy Through Size, Not Color

We used three card sizes to imply hierarchy, while three background colors were used purely for variety. We also established that certain cards should play in-line — like videos and audio, while other cards should expand into scrollable content pages.

Cards Expand Into Scrollable Pages

Cards act as content fragments that feature content pulled from scrollable pages. Rather than taking the user to a full page takeover, the content opens as a window right above the grid, keeping the consultative chat experience in view.

Flexible Grid That Adapts to Viewport

As the device narrows, the principals of the grid must change to support natural responsive card heirarchy.

Story 1

Sprint 2: Prompting and Conversation

Sprint 2 focused on the consultative interface experience. We unpacked user expectations for this experience based on a quick user test and defined how the interface should intuitively drive the generative card grid and scrollable content. We also explored how this experience naturally scales down to mobile.

Prompt-Driven Landing

We provide clear starter prompts alongside a custom text input on the landing page, in tandem with an ease in of default cards and content.

Instant Generative Feedback

Clicking a prompt will immediately generate a new card grid to visually reinforce the relationship between the chat and the content.

Defining Chat Logic

This system maintains a persistent chat history for easy navigation while using intent profiling to map conversations to core criteria. Integrated guardrails ensure the AI stays on track, redirecting users if inquiries drift from uncovering relevant content.

Mobile Translation

Scaling the experience down for mobile required rethinking how the consultative AI chat and generated content coexist. Our solution treats them as two sides of a coin: a highly intuitive, elegant split. We paired a top-right pagination indicator with subtle UI nudges to effortlessly guide users to swipe whenever new content is ready.

Atomic Chat Elements

The "virtual assistant" chat bar comprises three main components: AI response (styled outputs, dropdowns, sources, and feedback loops), Chatbox Text Field (the interactive user input area with character limits), and User message (the styled chat bubble displayed post-submission).

Story 1Story 4Story 6

Sprint 2 focused on the consultative interface experience. We unpacked user expectations for this experience based on a quick user test and defined how the interface should intuitively drive the generative card grid and scrollable content. We also explored how this experience naturally scales down to mobile.

Prompt-Driven Landing

We provide clear starter prompts alongside a custom text input on the landing page, in tandem with an ease in of default cards and content.

Instant Generative Feedback

Clicking a prompt will immediately generate a new card grid to visually reinforce the relationship between the chat and the content.

Defining Chat Logic

This system maintains a persistent chat history for easy navigation while using intent profiling to map conversations to core criteria. Integrated guardrails ensure the AI stays on track, redirecting users if inquiries drift from uncovering relevant content.

Mobile Translation

Scaling the experience down for mobile required rethinking how the consultative AI chat and generated content coexist. Our solution treats them as two sides of a coin: a highly intuitive, elegant split. We paired a top-right pagination indicator with subtle UI nudges to effortlessly guide users to swipe whenever new content is ready.

Story 1Story 4

Sprint 3: Source Content (Pages)

In Sprint 3, we focused on the deep-dive content experience. Partnering with the client, content, and SEO teams, we mapped existing long-form content into a new information architecture. Through layout testing and category consolidation, we established a clear, repeatable framework for the site.

Long-form Page UX

We introduced a persistent header bar to anchor long-form pages, making it easy for users to quickly see authors, jump to relevant content sections, or interact with the chat. We also implemented scroll based motion to introduce moments of delight throughout the page.

Content Migration & Page Layouts

We translated legacy information architecture into four clean, card-friendly buckets: Our Thinking, Our Impact, Expertise, and Bios.

Slot Based Module Library

We built a responsive, slot-based module library built from design system primitives. This atomic approach ensures proper scaling and allows for intuitive content and module swapping.

Essential Annotation

We annotated heavily for developers, CMS editors, and A11y standards across all viewports.

Story 1Story 3Story 4Story 5

Sprint 4-6: Grid Layout, Navigation & Backlog

Sprints 4 through 6 focused on translating our core AI logic into a scalable, production-ready interface. We established a responsive layout engine to display generated content, designed a parallel navigation framework to secure SEO viability, and worked in lockstep with PwC engineering to balance design integrity with technical MVP constraints.

Variable-Driven Slot Systems

We built a flexible, slot-based row component supporting multiple layout splits (like 75/25 or 50/50). Using Figma variables, card slots automatically snap to the correct size variant upon component swapping, accelerating dev handoff.

Dual-State UX for SEO/GEO

Because search bots cannot interact with generative chat, we designed a parallel, topic-based index page and nav. This ensures all content remains permanent, crawlable, and fully accessible via standard mouse or keyboard navigation.


Story 1

Sprints 4 through 6 focused on translating our core AI logic into a scalable, production-ready interface. We established a responsive layout engine to display generated content, designed a parallel navigation framework to secure SEO viability, and worked in lockstep with PwC engineering to balance design integrity with technical MVP constraints.

Variable-Driven Slot Systems

We built a flexible, slot-based row component supporting multiple layout splits (like 75/25 or 50/50). Using Figma variables, card slots automatically snap to the correct size variant upon component swapping, accelerating dev handoff.

Dual-State UX for SEO/GEO

Because search bots cannot interact with generative chat, we designed a parallel, topic-based index page and nav. This ensures all content remains permanent, crawlable, and fully accessible via standard mouse or keyboard navigation.


Dual-State UX for SEO/GEO

Because search bots cannot interact with generative chat, we designed a parallel, topic-based index page and nav. This ensures all content remains permanent, crawlable, and fully accessible via standard mouse or keyboard navigation.


System-Led Dev Alignment

Shipping a fast-paced AI experience requires tight alignment with engineering. We minimized dev friction by leaning heavily on design system primitives, making compromises for MVP, and introducing clear accessibility annotations.

Story 1Story 4Story 5

Clickable Protoype (Expand for Best Experience)

Please enter password