Visor: View Orientation

Overview

A pattern in research became a product initiative that reshaped the product.

Visor is a project and roadmap management platform built around syncing with tools like Jira and Asana.

While working across views like Table, Gantt, Board, and Timeline, users would frequently lose track of what they were looking at. Filters, sorting, grouping, and field visibility changed between views, but nothing made that state clear.

This was not a feature request. It was a pattern I saw repeatedly in research.

I turned that pattern into an initiative that ultimately reshaped how the product was structured.

Problem

Users struggled to understand what they were looking at.

Users struggled because:

• There was no clear starting point or orientation
• View state was hidden across filters, fields, and configurations
• Switching views caused users to lose context

The result was slower onboarding, confusion, and delayed time to value.

Before and after — VOB makes view state immediately visible

Insight

The issue was not missing features.

Users did not understand the current state of the product. They could not answer a simple question: what am I looking at right now?

Approach

A persistent orientation layer that kept growing.

I introduced the View Orientation Bar, a persistent layer that made the current state of the product visible and actionable.

It started small, then expanded as its value became clear.

Phase 1: Surface state

The first version showed:

• Active filters
• Hierarchy depth
• Record count

A key early insight was that simple summaries like "3 filters applied" were more effective than exposing raw configuration controls.

View Orientation Bar across Board and Gantt — configuration state always visible

Phase 2: Centralize configuration

As the pattern proved useful, it became a control surface:

• View settings moved out of scattered menus into one place
• Configuration became visible and editable in context
• Users no longer had to search for how to change what they were seeing

Phase 3: Become a navigation layer

The orientation bar evolved into a core navigation system:

• View creation and switching moved into the bar
• A Views and Folders panel provided access to all views across collaborators
• The view name became a navigational entry point

What started as a status bar became a structural layer in the product.

Views and Folders panel — all views across collaborators, accessible from the bar

What changed

Final Product

One consistent pattern across five view types.

The View Orientation Bar adapted to each view type while maintaining a consistent interaction pattern.

• Table: filters, rows, groups
• Gantt: date fields, filters, bars
• Board: columns, lanes, card settings
• Timeline: date fields, filters, edge cases
• Dashboard: intentionally excluded as a reporting surface

This balance kept the experience consistent while respecting the needs of each view.

System Work

Built and scaled the Visor design system from the ground up.

Alongside this work, I built and scaled the Visor design system from near-zero using atomic design principles.

• 200+ components with over 1,000 variants
• 60+ patterns
• 50 page templates across breakpoints
• Hundreds of icons and brand assets

The system supported both Visor and later MCP Manager, allowing the team to move quickly without rebuilding foundations.

Evolution Beyond Visor

A concept from this project shipped in a different product.

A breadcrumb navigation concept explored during this project did not ship in Visor but later became a core pattern in MCP Manager.

This reflects how the work extended beyond a single feature and influenced multiple products.

Outcome

4x increase in sign-up conversion and workspace invitations.

• 4x increase in sign-up conversion and workspace invitations, a key retention signal
• Faster time to "aha" moment during onboarding

Beyond metrics, the project changed how the team approached product design.

What started as a small, self-initiated fix became:

• A new product layer
• A shift in how the interface was structured
• A measurable improvement in activation and retention