← Back to Work
Software / B2B

Release managers couldn't see what was actually in their release — so blockers stayed hidden until it was too late.

Redesigning the release portfolio view to give release managers full pipeline visibility across triggered, sub-release, and attached associations.

Role

UX/UI Designer

Methods

Heuristic evaluation, cognitive walkthrough, proto-persona, task scenarios

Tools

Figma

Constraints

No access to end users during this iteration

Background

The product supports three association types between pipelines and releases: Triggered (pipelines trigger other pipelines via tasks), Sub-release (releases manually added under a parent), and Attached (pipeline runs attached to a release).

The existing portfolio view only showed Triggered pipelines — obscuring the full picture. Release managers had no single view of everything associated with their release, making it impossible to identify blockers quickly.

Key UX Issues

Original portfolio view showing limited pipeline visibility
Original portfolio view — only Triggered pipelines visible
Second view of original portfolio limitations
Original portfolio view — missing sub-releases and attached pipelines

Approach

01

Conducted heuristic evaluation (Nielsen's 10) and cognitive walkthrough with internal stakeholders

02

Built proto-persona and task scenarios to frame design decisions

03

Researched common DevOps portfolio patterns for prior art

04

Designed solutions addressing each identified issue, iterated with stakeholder feedback

Proto-persona for release manager
Proto-persona — Release Manager

Design Solutions

01 Visibility of System Status

Unified coding keys for all association types

What it does

Portfolio now renders Triggered, Sub-release, and Attached items together. A legend with badges identifies each type: Triggered (solid line), Sub-release (badge), Attached (dotted line).

Why it matters

Release managers can finally see the full scope of their release in one view without guessing what's missing.

Updated coding keys showing all pipeline types
02 Flexibility & Efficiency

Snapshot dropdown for pipeline run context

What it does

Provides full visibility of the workflow process inline. Users can see at what point something went wrong without leaving the page.

Why it matters

Eliminates the need to context-switch to a different section of the app to check on pipeline runs — faster blocker discovery.

Snapshot dropdown showing pipeline run details
03 Recognition over Recall

Type chips and contextual info for every item

What it does

Each item shows a chip indicating its type (pipeline, sub-release). An info icon reveals full details — including what entity called it and which task triggered it.

Why it matters

Users can search and scan faster. No more guessing the relationship between items in the graph.

Updated release information with type chips
04 Aesthetic & Minimalist Design

Collapse/expand for noise reduction

What it does

Branches in the graph can be collapsed when only a certain part of the release needs attention.

Why it matters

Complex releases with many branches become manageable. Users focus on what matters without visual overload.

Collapsed branches reducing visual noise

Outcome

By making scope explicit, unifying association types in both graph and list views, and introducing collapse/expand patterns, the release portfolio becomes a trustworthy control panel rather than a static diagram.

For users Clearer mental models, faster blocker discovery, less context switching
For business Reduced risk at release time, quicker status reporting
For product Consistent IA that scales to complex portfolios without losing information

What's Next

Given the absence of external user testing, outcomes are framed as hypotheses. The next step is to validate through lightweight usability studies and product analytics, then iterate on areas with highest impact — such as blocker panel effectiveness and saved views adoption.