How to Build a Simple Kanban Using Creation Wizard Abilities

In this tutorial we will create a simple, but actual working Kanban that will allow to manage Cases.

Case is a standard Salesforce object that offers a set of necessary properties.

Note: links in this article are going to other parts of this documentation, that are very useful. Read them to know more about mentioned things.

Some Terminology

Standard kanban consists of the following parts:

Header (where filter selector, buttons and kanban name are shown)
Body (where columns and sidebars)
Columns (that represent some conditions which cards should match)
Cards (each card represents one record)

Kanban header can contain:

Buttons (and menus that are buttons that show dropdown list with menu items)
Statistics (set of cells with some information)

Columns consist of:

Header (where column name and cards counter are shown)
Body (where cards are displayed)
Footer (optional, by default it is absent)

Column header and footer can contain cells with some information. Column footer allows to display cells in several rows.

Card has the following parts:

Compact layout (actually elements that are on the card)
Layout (information, form or something else that will be shown in the sidebar or modal popup when card is clicked)

Card compact layout consists of cells with some information.

Start Kanban Creation

Let's Start with Kanban Creation Wizard and give your Kanban a name and look.

First, open a Flexi Kanban Application and go to "Kanbans" tab. Click "New" button to start "New Kanban Dashboard" wizard:

Let's call your new Kanban "Cases Management Dashboard". Type this in the "Name" field.
Leave Type = "Standard" to get a simple (standard) kanban created.
"Description" is not mandatory and affects nothing - it is used just to show something useful in the list of kanbans at the "Kanbans" tab.
Click "Next" button.

At the following wizard step select a Kanban "Theme" (pre-defined design). Default is "White" and typical look of the kanban will be shown in preview. Let's leave it as is (6).
Click "Next" button.

Set What your Kanban will Work With

At the next step select "Use SObject" option - this will turn on a wizard form that will allow you to pre-configure most of kanban features in a simple way:

After you select "Use SObject" you will be prompted to select a Source Object - the object, which records will be represented by your kanban as cards:

Select "Case". After this two new sections will appear - "Columns Configuration" and "Card Configuration":

Specify what Columns do You Need in your Kanban

Click a "Group By" picklist in the "Columns Configuration" section. You will see a list of Case object fields:

Fields you see now are properties (standard and custom) of Case object.
Only fields that are restricted with a set of values (picklists and multi-selects) are only allowed here.

Now the main idea of your kanban should be specified: what should be done when you drag a card from one column to another. This can be made by selecting a field, which values will be represented by future columns. Card in columns will be shown matching this value, and when card is dragged to another column, the value will be automatically updated.

Let's select "Status". The column selector will appear.
Left side of this selector contains a list of values (that are available for the field selected above) named "Available Values".
Right side will contain list of values (named "Columns") that will be represented by future columns.

Select necessary values from "Available Values" and add them to the "Columns" list:

Add all available values.
Then re-arrange future columns in desired order (first value in the list will be leftmost column, last value - rightmost one). Set order to "New, Working, Escalated, Closed":

Congratulations! Columns are now configured. Your kanban will have 4 columns with column names equal to selected values. These columns will have equal widths.

Specify what Fields do You want to See in a Card

Now go to "Card Configuration" section to specify what should be displayed on the card.

The fields selector is shown there.
Left side of this selector contains a list of source object fields named "Available Fields".
Right side will contain list of fields (named "Card Fields") that will be shown on the card.
Select the following fields from "Available Fields" and add them to the "Card Fields" list in this order:

Case Number
Subject
Created Date
Case type

Congratulations! Card compact layout is now configured.

You must add at least one field, but no more than 12. If you want more fields to be shown at the card, you can add them in card builder later.

Click "Next" button.

Save Your New Kanban

At the last step of Creation Wizard you can review kanban main properties and still go back to change something:

If everything is correct, click "Save" button. You will go to Kanban Builder where your new kanban will be opened:

If you open Kanbans page now and click on a newly created kanban, you will see what you have created. This kanban will show cards in columns they corresponding to, but nothing will happen when you drag these cards. Now you need to configure your kanban basic actions.

Configuring Kanban Action

The main idea of kanban is Card Dragging. When you drag a card from one column to another, something must happen (to make kanban have a sense). To make something happen some Action must be triggered. Action can be triggered by:

Dragging cards between columns
Clicking cells
Clicking buttons
Selecting menu items

Before specifying what should happen on card dragging you should specify which columns card can be dragged from and to. To set this do the following:

click on the card frame in the "New" column to open Column Junction Settings in the right sidebar
check all checkboxes in a "Drag-n-drop allowed to these columns" section

Now card is allowed to be dragged from column "New" to all other columns. Do the same for other columns ("Working", "Escalated" and "Closed").

Congratulations! You have allowed card to be dragged from any source column to any target column.

Let's configure what should happen on card dragging:

Click a Card frame in the "Kanban Cards" section of builder to open card properties in the sidebar
Go to "Actions" section and click "add" link

Select "Add Action" and "New" option in the popup appeared and click "OK" button:

A "Create New Action" form will be shown in the new popup.

Dragging card means that record (represented by this card) should be changed to stop matching source column conditions and become matching target column conditions. After this card should disappear from the source column and appear in the target one. An action that allows do this, has the "Update Records" type. Let's go:

Select "Update Records" action type. Additional fields will appear
Check conditions that record should match to become updated

By default new action has one condition that corresponds to current card Source Object. It says that all records that should be updated, must have "Case ID" field equal to ID of the current record. This value is specified as special code called "Merge Field".

Merge Fields will be substituted to values of particular record by system on the fly.

In this example the value ({case.id}) means "System will take value of id field from the record of Case object, that is represented by card being dragged".

This is not mandatory to give this action a name, but it has sense if you plan to use this action in other places. Actions are re-usable and are stored in the application independently.

Now we should specify a record field to be changed, and set a new value for it. Let's go:

Click "Add Field" button to show additional form elements
Select a field to be updated. In our example it is a "Status" - the same field we have used to generate columns (see above)

When you select a "Status" field, system will offer a picklist with available values:

If you select one of them, the proper record will be updated to this value in spite of which column card be dragged to. This is not good, we need to set a value dynamically, depending on target column. And this is not so hard:

switch "Update Record Settings" to Advanced mode - a value of field selected to update will be changed to text input
type {$TargetColumn.Name} Merge Field there

Why do we use {$TargetColumn.Name} merge field?

As you remember, we have selected "Status" field to distribute records in columns, and each column automatically have got a name, which is equal to one of available values of "Status" field. Also each column have got own conditions (that records must match to be shown in that column), which include one of "Status" field values. So, each column name can be used as a value for action we're working on. And system will take this name automatically for each column where we will drag card to (a target column).

Click "Save" button on action builder to save the new action
You can see this action now in the card properties, as far as proper icon in the card frame:

Look at Your New Kanban

Click "Save" button on the Kanban Builder:

Click "Close" button to go out from kanban Builder.

Now go to Kanbans tab, find your kanban and click it's name to open it. Try to drag a card:

Congratulations! You have created your first working Kanban, that really can be used to manage Cases.

Of course, this Kanban is quite simple, and some of things can be done better (but in some more complex way). We recommend you to study this documentation, especially "howtos" and "best practices".

Thank you!

Last updated 2 months ago