> ## Documentation Index
> Fetch the complete documentation index at: https://learn.nextedy.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Basic Board Interactions

> Learn the core interactions that make up day-to-day planning work in Nextedy PLANNINGBOARD: navigating the layout, moving cards between Plans, reviewing work item details, and using the toolbar controls.

## What you will achieve

By the end of this tutorial you will be able to:

* Orient yourself in the Planningboard layout (board area and unplanned section)
* Drag cards from the unplanned backlog onto a Plan
* Click a card to open and edit its details in the sidebar
* Use card quick actions (Show Links, Add Link, Unplan)
* Control board display with the toolbar (collapse swimlanes, refresh, toggle views)
* Read a capacity bar tooltip to check a Plan's load

***

## Prerequisites

* Planningboard is installed and a Planningboard page exists in your Polarion project. If not, follow [Installation](/planningboard/getting-started/installation) and [Create Your First Planningboard](/planningboard/getting-started/first-planning-board).
* You have a valid Planningboard license. Unlicensed users can view the board but cannot drag cards, open the sidebar, or access the unplanned section.
* At least one Plan and some unplanned work items are visible on the board.

***

## The board layout

When you open the Planningboard page, the screen is divided into two sections:

<Frame>
  <img src="https://mintcdn.com/none-17b4493f/f2B5Oj-k4j8GirhH/planningboard/assets/images/article-planningboard-interface-basic-in-64db29d1.gif?s=029ffcfe0766b549a6c04d4364038a49" alt="Planningboard showing Iteration 3 and Iteration 4 columns with planned work item cards in swimlane rows, and the Unplanned section with a filtered backlog on the right" width="1116" height="416" data-path="planningboard/assets/images/article-planningboard-interface-basic-in-64db29d1.gif" />
</Frame>

<Frame>
  <img src="https://mintcdn.com/none-17b4493f/zUlmOSLBIQ0HyaAX/planningboard/diagrams/getting-started/basic-interactions/diagram-1.svg?fit=max&auto=format&n=zUlmOSLBIQ0HyaAX&q=85&s=0ef1fc9721b698989223d871c5eba39a" alt="Planningboard layout diagram showing the toolbar with collapse, expand, refresh, resource load, unplanned, and dependency controls, the board area on the left with Plan: Sprint 1 and Plan: Sprint 2 columns split into Swimlane: Alice and Swimlane: Bob rows containing cards, and the unplanned section with funnel and filter icons on the right" width="760" height="330" data-path="planningboard/diagrams/getting-started/basic-interactions/diagram-1.svg" />
</Frame>

* **Board area (left):** Cards are arranged in a grid of columns (Plans) and rows (swimlanes). In a typical setup, columns are iterations or sprints and rows are assignees or teams — this is configurable via widget parameters.
* **Unplanned section (right):** Cards here are not yet assigned to any Plan. This is your backlog.

***

<Steps>
  <Step title="Filter the unplanned section">
    Before moving cards, narrow the unplanned list to the items relevant to you.

    1. Click the **funnel icon** in the upper area of the unplanned section.
    2. A filter panel opens. You can filter by assignee, by team, or by a predefined Query configured in the widget parameters.
    3. Select the filter that matches your focus (for example, your own name as assignee).

    **What you see:** The unplanned section refreshes and shows only the matching cards. Cards that do not match are hidden but not deleted.

    <Tip>
      To hide work items with status **Verified** from the unplanned list, click the upper-right button in the unplanned section header. A separate **Filter columns** option hides Verified work items that are already planned from the board area as well.
    </Tip>

    ***
  </Step>

  <Step title="Drag a card onto a Plan">
    1. Locate a card in the unplanned section.
    2. Click and hold the card, then drag it to the target cell in the board area — the intersection of the Plan (column) and swimlane (row) where you want to schedule it.
    3. Release the card. Planningboard saves the assignment immediately.

    **What you see:** The card disappears from the unplanned section and appears in the Plan column under the correct swimlane row. The capacity bar for that Plan updates to reflect the new load (if capacity tracking is enabled).

    <Warning>
      Cards whose status is **Verified** are locked in place. You cannot drag or unplan them once placed. This protects completed work from accidental re-scheduling.
    </Warning>

    ***
  </Step>

  <Step title="Open a card and edit work item fields">
    1. **Click** any card on the board (not drag — just a single click).
    2. The **Work Item Properties** sidebar opens on the right side of the screen.
    3. Review the fields shown. The set of fields is configured by the board administrator via widget parameters (Sidebar Fields).
    4. Edit any editable field and click **Save**.

    **What you see:** After saving, Planningboard preserves your current swimlane and scroll position. The board does not jump back to the top, so you can continue working on nearby cards.

    <Tip>
      You can personalise the sidebar fields shown to you without affecting other users. Click the **gear icon** (Select Fields) in the sidebar header. Fields you add this way apply only to your session and affect all work items of the same type.
    </Tip>

    ***
  </Step>

  <Step title="Use card quick actions">
    When you hover over any card, three quick-action icons appear in its upper-right corner.

    | Icon       | Action                                                                                                                                                                                                       | What it does |
    | ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------ |
    | Show Links | Reveals all work items linked to this card. All other cards are hidden, leaving only the selected card and its linked cards visible.                                                                         |              |
    | Add Link   | Enter link-creation mode. The same icon appears on every other card. Click a second card to create a link between them. A **red** icon on a card means a link already exists — clicking it removes the link. |              |
    | Unplan     | Moves the card back to the unplanned section, removing its Plan assignment.                                                                                                                                  |              |

    **What you see after Show Links:** The board dims all unrelated cards. Only the selected card and its directly linked cards remain visible, making dependencies easy to trace.

    ***
  </Step>

  <Step title="Use the toolbar">
    The toolbar sits in the upper-left corner of the board area. Use it to control the overall board display.

    | Button                   | What it does                                                                                            |
    | ------------------------ | ------------------------------------------------------------------------------------------------------- |
    | **Collapse all**         | Collapses all swimlane rows to their header bar                                                         |
    | **Expand all**           | Expands all swimlane rows to show their cards                                                           |
    | **Refresh data**         | Reloads the board from the server — use this after external changes in Polarion                         |
    | **Toggle Resource Load** | Shows the current capacity load of each assignee in the swimlane summary cells                          |
    | **Show Unplanned**       | Toggles visibility of the unplanned section (hide it to gain screen space)                              |
    | **Prioritize**           | Enables the Prioritization feature for reordering items within a Plan                                   |
    | **Show Dependencies**    | Displays all links between all cards on the board simultaneously (must be enabled in widget parameters) |

    You can also collapse or expand a **single swimlane** by clicking its row header directly.

    <Note>
      **Show Dependencies** (toolbar) and **Show Links** (card hover) serve different purposes. Show Links is scoped to one card; Show Dependencies reveals all inter-card links across the entire board at once. Show Dependencies requires the feature to be enabled via widget parameters.
    </Note>

    ***
  </Step>

  <Step title="Read a capacity bar tooltip">
    If capacity tracking is configured on your board, each Plan column shows a **capacity bar** below its header.

    1. Hover over the capacity bar of any Plan column.
    2. A tooltip appears with a detailed capacity breakdown for that Plan.

    **What you see:** The tooltip shows allocated capacity, total available capacity, and remaining capacity per assignee (when user-level capacity tracking is enabled). Negative available capacity indicates overallocation.

    <Info title="Verify in application">
      Capacity tooltip content depends on your widget parameter configuration. If the tooltip does not appear, capacity tracking may not be configured for this board. Ask your board administrator to check the `capacityLoad` and related parameters.
    </Info>

    ***
  </Step>
</Steps>

## Next steps

You can now perform the fundamental planning interactions on a Planningboard. To go deeper:

* **[Concepts](/planningboard/concepts/index)** — Understand Plans, swimlanes, capacity bars, and how Planningboard maps Polarion data to the board view.
* **[Guides](/planningboard/guides/index)** — Task-oriented guides for swimlane configuration, capacity setup, card customization, and prioritization.
* **[Reference](/planningboard/reference/index)** — Complete widget parameter reference with default values and configuration examples.
* **[FAQ](/planningboard/faq/index)** — Answers to common questions about board behavior and configuration.

<Accordion title="Sources">
  **KB Articles**

  * Planningboard interface & basic interactions
  * How to setup Planningboard into existing projects (based on E-library template)
  * Introduction to Planningboard

  **Support Tickets**

  * [#6174](https://support.nextedy.com/helpdesk/tickets/6174)
  * [#6425](https://support.nextedy.com/helpdesk/tickets/6425)
  * [#6679](https://support.nextedy.com/helpdesk/tickets/6679)

  **Source Code**

  * `Config.java`
  * `PlanningBoardWidgetRenderer.java`
  * `perUserCapacity.cy.ts`
  * `capacityHelperData.cy.ts`
  * `licenseReadonly.cy.ts`
</Accordion>