Global App Interface

Last updated:

The Board Studio app consists of four main areas: Header Bar, Left Sidebar, Working Area, and Overlay Menus.

Interface Overview

Header Bar

The header bar provides data source selection, configuration management, and global actions.Header Components

Element Description
Tour button (🎯) Opens interactive guided tour for new users
Data source type Choose between Space (project) or Filter
Data source selector Choose the specific space or filter to display
Refresh button (↻) Reload the list of available sources
Configuration selector Select or switch between saved board configurations
Create button (+) Create a new board configuration (enabled when changes exist)
Cancel button (✕) Cancel name editing (visible when editing)
Save button (💾) Save the board configuration (visible when editing)
Actions menu (⋮) Rename, Save As, Share, or Delete board
Update button Refresh issue data from Jira
Settings button (⚙️) Opens settings panel

Actions Dropdown Menu

Available via the ⋮ button:

  • Rename – Change configuration name
  • Save As – Create a copy with new name
  • Share – Share configuration with others
  • Delete – Remove configuration (author only)

Left Sidebar

The collapsible left sidebar contains all configuration sections.

Sidebar Structure

┌──────────────────┐
│   HEADER         │  ← Collapse toggle, sidebar title
├──────────────────┤
│   OVERVIEW       │  ← Statistics display
├──────────────────┤
│   GENERAL        │  ← Separate linked cards toggle
│   SETTINGS       │    + Order/Sorting subsection
├──────────────────┤
│   BOARD          │  ← Vertical swimlanes
│   STRUCTURE      │    Horizontal swimlanes
│                  │    Grouping
├──────────────────┤
│   LINKS          │  ← Style subsection
│                  │    Display subsection
├──────────────────┤
│   FOOTER         │  ← Feedback button
└──────────────────┘

Sidebar Sections

Section Purpose
Overview Work item count, link count, external links count
General Settings Separate linked cards toggle + sorting/order configuration
Board Structure Vertical swimlanes, horizontal swimlanes, grouping
Links Style and Display subsections for dependency customization
Footer Feedback button linking to JSM support portal

Sidebar Features

  • Resizable – Drag the right edge to resize (240px–480px)
  • Collapsible – Click toggle to minimize to icons only
  • Scrollable – Sections scroll independently, footer stays fixed
  • Persistent – Width and collapsed state saved across sessions

Working Area

The main interactive canvas where the board visualization is displayed.

Canvas Features

Feature Description
Pan Click and drag to move the view
Zoom Scroll wheel or pinch to zoom
Select Click a card to select/focus
Multi-select Ctrl+click or drag selection box
Focus Mode Selected card highlights, unrelated cards dim

Visual Elements

  • Issue Cards – Jira issues with key, summary, status, priority, and avatars
  • Dependency Links – Arrows connecting related issues with customizable styles
  • Headers – Row and column headers for swimlanes (multi-level supported)

Overlay Menus

Floating controls that appear over the working area.

Zoom Controls

Located in the bottom-right corner:

Button Action
− Zoom out
⊞ Fit all content in view
+ Zoom in
⟲ Reset to default zoom

Zoom level displayed as percentage (10%–400% range).

Related Documentation