Embeddable Pages

Atlassian

Users constantly juggle multiple screens and tabs just to complete a single task—taking notes during a Zoom call, referencing an article to reply to a client, or uploading files just to share a single link. Multitasking is essential, but it often leads to fragmented workflows and siloed experiences, making it hard to maintain a single source of truth. With Embeddable Pages, deep collaboration across products is now possible while maintaining a centralized source of truth. Since its initial release, Embeddable Pages has enabled Confluence to scale beyond beyond Atlassian’s suite of products and into third-party products, including:

Atlassian Smart Link Embeds: Displaying Confluence pages in any Atlassian product (Jira, Atlas, Trello, JSM, etc.)
Jira Service Management: Knowledge Base powered by Confluence
Jira Software: Project Pages
Atlassian: Notifications Central
Microsoft Teams: Confluence Pages Integration
Miro: Embedded Confluence Pages

Overview

As the lead designer on Confluence’s Better Together team, I spearheaded the creation of Embeddable Pages. With this feature, Confluence can integrate directly into other products while maintaining a familiar editing experience while keeping users in their primary workflow. This reduces cognitive overload by eliminating the need to switch apps mid-task. Users get the full power of Confluence—collaboration tools, editing features, and content management—right where they need it, ensuring a smooth, uninterrupted workflow.

Stakeholders

Michael Cannon-Brooks, Founder
Head of Design, Confluence
Head of Product, Confluence
Head of Engineering, Confluence
Head of Design, Team Money
Head of Product, Team Money
Head of Engineering, Team Money
ITSM cross-functional triads
Confluence cross-functional triads

Key outcomes

US Patent awarded

O N E

Exploring our MVP
use case

Starting with Jira Service Management

Overview
After evaluating the market and Atlassian’s product positioning, we prioritized Jira Service Management (JSM) for the first Embeddable Pages implementation, creating an out-of-the-box (OOTB) Knowledge Base experience. We hypothesized that this would strengthen our ITSM offering against competitors like ServiceNow and Zendesk, all while leveraging the native Confluence integration as a key advantage.

User problem
To effectively manage a knowledge base, ITSM agents need licenses for both Confluence and Jira Service Management (JSM), forcing them to switch between applications just to create and access documentation.

Desired outcome
Design a seamless, integrated experience that boosts agent efficiency by reducing or eliminating context switching. At the same time, drive growth in Monthly Active Users (MAU) and Pay-Enabled Users (PEU) for Confluence by embedding its powerful collaboration tools directly into agent workflows.

Current experience audit

We observed that the initial JSM experience required an additional 20+ screens to set up a knowledge base after signing up for a Confluence account. Data showed us that this often lead high-friction/drop-off due to mandatory app switching in order to create and collaborate on documents.

Mapping out the product experience

Over six months, I worked closely with Confluence leadership and JSM product teams to explore optimized user flows. Given the differences in JSM and Confluence’s information architecture, we explored various permission models to ensure a smooth user experience while maintaining Confluence’s revenue model. We also accounted for every user type—Admins, agents with standard licenses, and “Nth” users with paywalled seats—ensuring a seamless and scalable cross-product experience.

I explored optimization opportunities across the entire E2E journey

After initial alignment, began exploring key screens

Advocating for holistic messaging

As explorations evolved, I brought in our product marketing partners early to align on messaging and support the rebranding of Jira Service Desk to Jira Service Management. While my main focus was the in-product experience, I also took the opportunity to educate my team and cross-functional partners on holistic user messaging—ensuring a seamless experience that fosters ongoing engagement.

I crafted a POV of new messaging triggers.

With new messaging needs, I also identified notifications that need to be updated.

T W O

Exploring the architecture

Cross-product alignment hurdles

The biggest challenge was reconciling the differences in subscription models—JSM allows up to three free users, while Confluence includes 10 seats. My product partners aimed to use feature gates within JSM to drive Confluence upgrades, which was feasible but carried a high risk of user drop-off due to forced paywalls.

From my initial explorations, I advocated for consistent transition messaging, emphasizing that every ingress into a paywall scenario should assessed and revised as needed to ensure the experience was as frictionless as possible. In order to gain cross-functional and leadership alignment, I executed across three levels of fidelity to navigate the complexities of this pivot.

1) Cross-product user flows

With numerous infrastructure dependencies and parallel team efforts, I created a detailed flow diagram mapping out every decision point in the user experience. The goal was to highlight the complexity we were inheriting and ensure we addressed technical dependencies upfront to prevent roadblocks in development.

Outcome
This visual guide brought clarity around team ownership of specific product areas, ultimately helping to facilitate discussions with engineering and product leads. Using these flows, my PM and I were able to influence the roadmap with unlicensed access—an architectural change that allows users to engage with embedded features without restrictive licensing barriers to the users, and preserving the integrity of Atlassian’s proven revenue model.

Exploring all “cross-flow” touch points

Journey mapping across all user segments

2) Persona mapping

To illustrate the potential impact of these structural changes from a user’s perspective, I mapped one of Confluence’s user personas new experience.

Outcome
By showcasing the progressive value for agents without relying on forced technical barriers, we successfully demonstrated how a seamless experience could drive adoption and engagement.This helped secure further alignment with leadership team, reinforcing the necessity of these changes for an effective design.

Overview of persona mapping across Confluence and JSM.

Exploration of funneling cross-product access requests.

3) Qualitative user research

Finally, I designed a high-fidelity prototype for our UXR partners to conduct qualitative user testing and evaluate how the embedded experience would impact knowledge bases.

Outcome
The majority of users responded positively to our solution, and interestingly, they did not share many of the concerns our team initially anticipated.

They experienced overall less cognitive load from context switching
High-perceived value from a streamlined workflow
All were delighted by the new access point and familiar embedded experience
Admins were delighted by the streamlined licensing
All users were adverse to forced pay gates to access what’s presented as a standard feature
All users mentioned the criticality of messaging

T H R E E

Delivering impact across Atlassian

Ecosystem-wide influence

Our work quickly caught the attention of teams across the Confluence product and the broader Atlassian ecosystem. This system-wide effort underscored the importance of our cross-functional partnerships, which were essential to the success of all experiences across Atlassian’s suite and third-party offerings.

More than components—an entire framework

To drive adoption and scalability, I approached Embeddable Pages as a platform rather than a single-product feature. After partnering with JSM and implementing our components, I began developing guidelines to support future integrations, ensuring consistency and efficiency in upcoming partnerships.