Begin of the insertion# User Problem

## User

_What persona, persona segment, or customer type experiences the problem most acutely?_

* Project manager
* Project member
* Team lead

## Problem

_What problem or job does the user have?_

* InEnd of the insertion Begin of the deletion **As a**End of the deletion project Begin of the insertionorganizations users oftenEnd of the insertion Begin of the deletion member,
**I want to** be able to visualiseEnd of the deletion work Begin of the deletion packagesEnd of the deletion in Begin of the insertiondifferent projects in parallel.
* Larger project organizations are often organized inEnd of the insertion a Begin of the insertionmatrix structure. So teams might provide their expertise in several projects.
* Projects itself need multiple teams from different organization units to deliver on their project goals.
* Gantt charts do allow for operational planningEnd of the insertion Begin of the deletion weekly calendar viewEnd of the deletion across multiple Begin of the insertionprojects.
* It is not possible to schedule tasks in boards view (list are not connected to dates).
* The daily activities are not aligned with strategic goals. It is hard to see the "big picture" in daily operations.

## Pain

_What is the primary workaround that users perform that we could remove or replace? Why is it painful?_

* There are many organization thatEnd of the insertion Begin of the deletion sub-projects, and order them by assignee
**so that** IEnd of the deletion have Begin of the insertionphysical planning boards in their office.
* People spentEnd of the insertion a Begin of the insertionlotEnd of the insertion Begin of the deletion clear visionEnd of the deletion of Begin of the insertiontime in lengthy status meetings to keep everybody on the same page.
* For team leads it is hard to understandEnd of the insertion Begin of the deletion who doesEnd of the deletion what Begin of the insertiontheir team members are currently working onEnd of the insertion and Begin of the insertionto communicate priorities.
* ItEnd of the insertion Begin of the deletion when, and have a clear view of resource availability.

**Note**
The Team plannerEnd of the deletion is Begin of the insertionalso hard for team members to show their supervisors what they are currently working on.
* It is almost impossible to limitEnd of the insertion Begin of the deletion an initial (first stage) implementation a larger evolutionEnd of the deletion the Begin of the insertionnumber of work-in-progress-items. Working on too many thingsEnd of the insertion Begin of the deletion planning that will be implementedEnd of the deletion in Begin of the insertionparallel harms the team's productivity.
* Project plans (Gantt charts) are not linked to operational activities.
* Project plans are outdated most of the time.

# Business Case

## Reach

_About how many users, customers or potential customers currently have this problem? (Low / Worst Case)_

* Significant reach because basically all project organizations are faced with the same problem.

## Impact

_Among relevant customers or prospects, how much value do they get fromEnd of the insertion a Begin of the insertioncomprehensive solution toEnd of the insertion Begin of the deletion multi-step process. AtEnd of the deletion this Begin of the insertionproblem? (Conservative case)_

* High-impact since focussing the team's capacity on the right things increase the results significantly (working on the right things). AdditionallyEnd of the insertion Begin of the deletion stage,End of the deletion it Begin of the insertionmakes daily operations and alignment more efficient (doing it right).

## Confidence

_What areEnd of the insertion Begin of the deletion will only displayEnd of the deletion the Begin of the insertiontop risk factors that could inhibit our ability to deliver this solution? Please consider how we can mitigate these risks._

* High confidence since we have seen this patternEnd of the insertion Begin of the deletion plannerEnd of the deletion in Begin of the insertionvery many organizations.
* Sponsoring organizations.End of the insertion Begin of the deletion a weekly view.End of the deletion

Begin of the insertion## Urgency and Priority

_WhatEnd of the insertion Begin of the deletion _This work packageEnd of the deletion is Begin of the insertionthe relative priority of this opportunityEnd of the insertion Begin of the deletion a workEnd of the deletion in Begin of the insertionyour backlog? What tradeoffs must you make? Is there a hard deadline or could this wait?_

* ThereEnd of the insertion Begin of the deletion progress, specificationEnd of the deletion is Begin of the insertionno external deadline such as a change of legal requirements.End of the insertion Begin of the deletion not yet complete._End of the deletion

Begin of the insertion## SolutionEnd of the insertion Begin of the deletion ####

#### **Acceptance Criteria**End of the deletion

Begin of the insertion### The moduleEnd of the insertion Begin of the deletion **The module**End of the deletion

There is a new module called "Team planner". It also has a new module icon (available in a range of formats including SVG in Figma).

* This has to be enabled and has three permissions:
* "View team planner"
* "Manage team planner" and
* Make it public/private (phrasing to be confirmed)
* The work package module will have to be active for the team planner to be active.
* Is also based on fullcalendar.io but is separate from the Calendar module.

This new module, once enabled, is visible in the sidebar as "Team planner":

* Clicking on "Team planner" in the project sidebar drills into the "Team planner" sub-menu.
* The first item is a back button with the title "Team planner"
* In this sub-menu, there are four possible headers in the sidebars:
* "Favorite team planners" visible only if there are team planners that have been favourited
* "Public team planners" lists all saved team planners that are public
* "Private team planners" lists all team planners that are marked as not public
* The "Create team planner" only ever has on item (New team planner)
* The "first" team planner (so the first of either the favorited ones, public ones or the private ones, in that order) will the one that will be automatically loaded.
* If there are no existing team planners, the 'New team planner' item under "Create team planner" is loaded automatically.
* Within each view, the list of team planners is arranged alphabetically, allowing users to also prepend numbers to govern this
* To navigate to other saved planners, the user has to pick a different planner from the sidebar.
* The last header "Create new planner" has only one item, "New team planner". This is essentially the "Create" function (now that we don't have an index/list view for this v1).

Begin of the insertion### AEnd of the insertion Begin of the deletion **AEnd of the deletion basic (empty Begin of the insertioncalendar)End of the insertion Begin of the deletion calendar)**End of the deletion

Clicking on "Create new planner" loads an empty planner.

* The top header is by default in edit mode, much like when the user creates a new board; the user is able to type a name for the calendar and click on the save icon to save the calendar.
* _Note: there is no back button at the level of this top header (unlike when a new board is created; this should eventually also be changed in the boards)._
* The right side of the top header has three buttons:
* The standard "filter" action, with two specifities
* The assignee attribute is disabled/not available
* The time frame attribute is disabled/not available
* The full-screen icon.
* The "more" action with three vertically-stacked dots, with these functions (that exist already today in the context of work package list/table view).
* Rename
* Save
* Save as
* Delete
* Visibility settings
* The secondary toolbar has these elements, and is common to new and existing calendars:
* On the left edge:
* Nothing (for now; post-12.1, we will have the "Add existing button here).
* Centered:
* The current date range visible, either the month ("August 2021") or a week ("6–10 August 2021")
* On the right edge:
* A "today" button to return to today
* Left/right buttons to go forwards and backwards in time (in increments of week or month, depending on the current view)
* No filters are enabled by default in a new team planner
* The calendar area is empty in a new team planner (no work packages are visible since no assignees are added yet)
* There is a message on the calendar that says "Add assignees to set up your team planner."
* An "Add assignee" button allows users to add assignees to get started (this button is described below).

Begin of the insertion###End of the insertion **Main view**

The calendar week view is the main view:

* There is an "Assignee" column on the left edge.
* The other columns are dates, displayed as "{day name} - {date number}", as in "Monday - 9".
* This is shortened to "Mon - 9" in smaller windows when the cell is not wide enough to display the full version.
* The team planner, when opened, will always show the current week by default.
* If a user changes the dates (week) displayed by going forward or backwards, a refresh of the current page should fetch this same same modified date range, and not the current one. (**Open:** is this possible?)
* The current date is highlighted also in the column header, with the same yellow highlight as in the current calendar.
* As soon as assignees are added (and filters optionally enabled), work packages are displayed as strips (as they are currently in the Calendar module),
* Please see next section "Work package strips" for details.
* There is no upper limit to how many strips are displayed per assignee row. (**Open:** there should probably be a technical upper limit).
* There is an "Add assignee" button at the bottom, on the left edge.
* **Open** what is the loading animation while:
* Loading the work packages for the current week upon initially visiting the team planner
* Loading the work packages for the switched to week when browsing between weeks via the calendar buttons (next/previous week)

Begin of the insertion### WorkEnd of the insertion Begin of the deletion **WorkEnd of the deletion package Begin of the insertionstripsEnd of the insertion Begin of the deletion strips**End of the deletion

* A work package strip is a visual representation of the work package in the calendar part of the team planner.
* A basic strip is almost identical to a work package strip in the current Calendar view.
* It starts on the start date and extends till the end date (either of which can be out of view)
* There is one line of text that represents the work package name
* The background colour represents the work package type
* A milestone is displayed:
* As a strip spanning a single day, that can be dragged around to change date or assignee, but does not have the drag edges (and thus cannot be resized; the duration is always 1 day).
* This strip has additional features not yet available in calendar view:
* Small "drag handles" on either end are always visible and allow the user to extend the work package to the left or to the  right, in order to to change start/end.
* The ability to drag a work package strip horizontally, to adjust the start and end dates (whilst keeping the duration constant)
* The ability to drag a work package from one row to another to assign it to another user (can also be done simulaneously with a horizotal scroll, ie., one can move the start date and change assignee in one drag-and-drop movement).
* Clicking on a work package strip opens it in a classic split screen view (see below).

Begin of the insertion###End of the insertion **Split screen view**

The split screen view is invoked either when:

* the user drag-selections a range of dates to create a new work package (described below)
* a work package strip is clicked to view its details.

The split screen behaves like it does in a work package list view:

* It anchors itself to the right.
* It pushes the main view (secondary header + calendar) to the left, and introduces a horizontal scroll
* Allows the user to change any attributes that they have the permission to change
* Any changes to the start/end dates or assignee are reflected immediately (**Open:** how immediately?) on the calendar view.

Begin of the insertion###End of the insertion **Add assignee button**

Clicking on this button adds a row to the calendar, with focus on the the assignee name search input (or if focus is not possible, an empty drop-down field with an "-"). This dropdown is the same as when one clicks on the "Assignee" drop-down in a work package full view or in a work package list.

* As the user starts typing, a list of users who correspond to the search terms displayed as:
* An avatar and
* Their full name
* Clicking on a particular user assigns the newly added row to the assignee, keeping its position (last row).
* On refresh, the assignee rows are re-organised alphabetically? **To discuss:** Or shall we display the assignees in the order in which assignees were added?
* It is possible to add a group as an assignee. (This allows the user to take a work package assigned to a group and assign it to a particular member of that group).
* Individuals in that group can nevertheless be added separately.
* The work packages in the group row then only show those explicitly assigned to the group, not those assigned to members of that group

Begin of the insertion###End of the insertion **Creating new work packages directly via the team planner**

In 12.1, adding existing work packages is not possible. This will be done in the next release via an "Add existing" pane to the left. Nevertheless, it is possible to create a new work package:

* A new work package is created by using fullcalendar.io's native drag-select functionality to allow the user to select a date range, which will trigger a "create work package" split screen. In this new work package split screen, these attributes are pre-filled based on the user's drag-select:
* the start date,
* the end date and
* the assignee
* If the user clicks on another work package whilst editing a new work package (without saving it), the behaviour is the same as when this happens in a work package list; a browser-native dialogue overlay asks them: _"Are you sure you want to cancel editing the work package?"._

Begin of the insertion### RemovingEnd of the insertion Begin of the deletion **RemovingEnd of the deletion work Begin of the insertionpackagesEnd of the insertion Begin of the deletion packages**End of the deletion

Given that the team planner is merely a view, a user wishing to remove a particular work package (or a series of work packages) has three options:

* Filter the current view in such a way as to not display those work packages.
* Click on the work package strip to open the split screen view and remove the assignee, or stard/end dates so they are outside of the visible date range.
* Delete the work package (which will of course delete it from everywhere, and not just the team planner).

Begin of the insertion### FeaturesEnd of the insertion Begin of the deletion **FeaturesEnd of the deletion specific to planning Begin of the insertionviewEnd of the insertion Begin of the deletion view**End of the deletion

Planning view, once assignees have been added, affords the users more functionalities than is available in month view:

* Hovering on the cell with the name and avatar of the assignee displays a "remove" icon, that allows users to remove that assignee from the current view.
* The row will have a min height of x (by default the space needed to display the assignee name and icon + spacing), but can grow almost arbitrarily (see Open in "Error handing").
* To make sure this drag-select functionality is available even in cells that are particularly full (i.e, with lots of work packages on the same day), we will leave a +12px bottom padding on each assignee row. This is to ensure the user always has some whitespace available to drag-select to create a new work package.
* If the height of taken up by the assignee rows is more than the available screen height, scrolling is to be applied to entire page (or, if the split screen is open, the main area not including the split screen). **To discuss:** is this technically feasible?
* **To discuss -** When dragging a work package that spans more than the week, so that the start and end date is not displayed, we can display an overlay above the work package strip, on the edge that is cut-off, indicating the start date (see [Figma prototype for demo](https://www.figma.com/file/409d6qR685SzZLXez4TPl7/Planning-Calendar?node-id=923%3A38919)).

Begin of the insertion### Enterprise editionEnd of the insertion Begin of the deletion **Enterprise edition**End of the deletion

* The team planner will be an enterprise only feature. Begin of the deletion _(**Note:** Challenged by comment by <mention class="mention" data-id="9177" data-type="user" data-text="@Oliver Günther">@Oliver Günther</mention> on <mention class="mention" data-id="40038" data-type="work_package" data-text="#40038">#40038</mention>)._End of the deletion
* The calendar module will be kept non enterprise with all improvements carried over from team planner included (e.g. persisting filters)

Begin of the insertion###End of the insertion Begin of the deletion ####End of the deletion **Error handling and exceptions**

Begin of the insertion#### Error managementEnd of the insertion Begin of the deletion **Error management**End of the deletion

* **When dragging or extending work packages**
* In this, first version, as I understand it, it is not possible to know in advance which work packages have relations or are read-only for any number of reasons (see list below). This means that we will not be able to communicate to the user that that work package isn&#39;t extendable or draggable _before_ they try modifying it, or _during._
* In any of the following cases, our (very imperfect but pragmatic) proposition for this v1 is to simply throw an error with a snackbar after the &quot;offending&quot; action is executed. An [example of the error in Figma is here](https://www.figma.com/file/409d6qR685SzZLXez4TPl7/Team-Planner?node-id=1178%3A56096).
* Some cases where we might need to do this are:
* The work package has been invalid before, e.g. a required custom field is not set
* Moving the work package would violate a constraint (e.g. a preceding work package limiting the start date)
* For work packages with follows/precedes relationships.
* In case two work packages displayed on the same planning calendar at the same time are in a follows/precedes relationship _(for now treated the same as when they aren&#39;t on the same view; we&#39;ll need to make a distinction later when we&#39;re able to drag/drop work packages with relations)._
* the user not having the permission to edit work packages (the permissions might be different for two work packages within the same team planner if they are in different projects)
* the work package being a parent
* the work package having a locked status
* a constraint imposed by relationships on the start date is violated Begin of the deletion
* ~~**When adding existing work packages by right-clicking on a certain day cell** (which is naturally also associated with an assignee), we might have certain attributes that might already exist and would be replaced with new values:~~
* ~~**Assignee already set**: if an assignee has already been set (but date fields are empty), but the work package is being added to another assignee row, show dialogue with the following error message:~~
* ~~Title: &quot;Change work package assignee?&quot;~~
* ~~Text: &quot;The work package you are adding is already assigned to~~ _~~{current assignee}~~_~~. Would you like to change the assignee to~~ _~~{new assignee}~~_~~?&quot;~~
* ~~Primary button: &quot;Change assignee&quot;~~
* ~~Secondary button: &quot;Cancel&quot;~~
* ~~**Dates already set: i**f the start date has already been set (regardless of assignee), but the work package is being added to a different date show, show dialogue with the following error message:~~
* ~~Title: &quot;Change start/end dates?&quot;~~
* ~~Text: &quot;The work package you have selected already has a start date set to~~ _~~{current start date}~~_~~. Would you like to change it to~~ _~~{date}~~_~~?&quot;~~
* ~~Primary button: &quot;Change dates&quot;~~
* ~~Secondary button: &quot;Cancel&quot;~~
* ~~**Assignee/dates already set**: if both the assignee and start/end dates have already been set, but the work package is being added to a different assignee and start/end dates, show dialogue with the following error message:~~
* ~~Title: &quot;Change assignee and dates?&quot;~~
* ~~Text: &quot;The work package you have selected is currently assigneed to~~ _~~{current assignee}~~_ ~~and is scheduled for~~ _~~{current date range}~~_~~. Would you like to change the assignee to~~ _~~{new assignee}~~_ ~~and the dates to~~ _~~{new date range}~~_~~?&quot;~~
* ~~Primary button: &quot;Change assignee and start date&quot;~~
* ~~Secondary button: &quot;Cancel&quot;~~
* ~~**Open -** The work package has been invalid before, e.g. a required custom field is not set~~End of the deletion

Begin of the deletion **Mobile**

* **To discuss -** There will not be support for this on mobile. How do we hide the feature?
**Product team:** Let&#39;s wait to see, once we have basic implementation, how it is in mobile (hard to tell with the current Calendar module without the assignees rows). If it&#39;s still possible for the user to glean _some_ useful information by accessing the planner on mobile, albeit with a lot of scrolling, it might still be worth not hiding the feature.

**Visuals**

_(**Nota bene:** Please note that the icons in these mockups represent an evolution of our iconography that remains a work in progress; for now, they should be implemented in the current style)_

_**Addition of &quot;Team planner&quot; to the side menu**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/23649/content"></div></figure>

End of the deletion _**An empty, Begin of the insertioninitializedEnd of the insertion Begin of the deletion initialisedEnd of the deletion team planner**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24065/content"></div></figure>

_**A populated team planner with four assignees**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24064/content"></div></figure>

_**Hovering on a work package strip**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24066/content"></div></figure>

_**Split screen view of a work package strip**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24067/content"></div></figure>

_**Drag-select a date range to create a new work package**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24068/content"></div></figure>

_**An error message when a work package is moved, extended or shortened but the user does not have the necessary permissions**_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24069/content"></div></figure>

Other screens are visible in the [Figma prototype](https://www.figma.com/file/409d6qR685SzZLXez4TPl7/?node-id=614%3A26487).

Begin of the insertion**Mockups in Figma**
Figma prototype can be accessed at: https://www.figma.com/file/409d6qR685SzZLXez4TPl7/?node-id=614%3A26487

_(Please note that the relevant screens are on the &quot;Team planner&quot; page; the above links takes you to the correct page)._

## OutEnd of the insertion Begin of the deletion **OutEnd of the deletion of Begin of the insertionScope for the MVCEnd of the insertion Begin of the deletion scope**End of the deletion

Begin of the insertion_What should NOT be in the minimal viable change, and can be considered for future iterations? Why? Please order them by importance._

End of the insertion * Begin of the insertionContributions to the fullcalendar-library
* End of the insertion Views other than weekly (including the two-week view)
* The ability to identify assignees with overdue work packages (and view those in an overlay)
* More detailed work package strips that display important attributes without needing a hover
* Work package planning stages (done, planned, overdue)
* Altering the order of assignees by dragging-and-dropping entire assignees rows
* A shortlist of work packages form which the user can drag and drop work packages to the calendar (and a way to filter this shortlist)
* Any form of automation (associating certain work package status with certain planning stages) Begin of the insertion
* **Mobile views**End of the insertion

Begin of the insertion## DifferentiationEnd of the insertion Begin of the deletion **Mockups in Figma**
Figma prototype can be accessed at: https://www.figma.com/file/409d6qR685SzZLXez4TPl7/?node-id=614%3A26487End of the deletion

Begin of the insertion_What do you believe will differentiate us fromEnd of the insertion Begin of the deletion _(Please note thatEnd of the deletion the Begin of the insertioncurrent experience or competitive experiences?_

* Redmine does not have Boards
* Jira does not support Gantt charts.
* MS Project (desktop) does not have a collaborative environment.

## Next iteration

_What isEnd of the insertion Begin of the deletion relevant screens are onEnd of the deletion the Begin of the insertionnext solution that would allow usEnd of the insertion Begin of the deletion &quot;Team planner&quot; page; the above links takes youEnd of the deletion to Begin of the insertionrelease meaningful customer value quickly?_

* Show planning iterations inEnd of the insertion the Begin of the insertionGantt charts.
* Set work package type by hierarchy level
* Example 1: Epic -&gt; User Story -&gt; Task
* Example 2: Deliverables -&gt; Work package -&gt; Activities
* Coding schemes: 1.1.1, 1.1.2, 1.2.1, ....End of the insertion Begin of the deletion correct page)._End of the deletion