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 wizard:

Select "Standard Kanban" first. Then click "Next" button:

  • Let's call your new Kanban "Cases Management Dashboard". Type this in the "Name" field.

  • Select a Color Theme (pre-defined design). Default is "White" and typical look of the kanban will be shown in preview. Let's leave it as is.

  • 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.

Set What your Kanban will Work With

  • At the next step select "Case" in Source Object picklist.

  • The "Group By" picklist will be populated with fields of Case object.

  • Leave "Summarize By" empty (by default cases do not have any countable fiels suitable for adding totals):

Specify what Columns do You Need in your Kanban

  • Fields you see in "Group By" picklist are properties (standard and custom) of Case object.

  • Only fields that are restricted with a set of values (picklists and multi-selects) are only shown 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" in the "Group By" picklist and click "Next" button. The next step of wizard will be shown.

  • An "Available Values" section (left side) contains a list of values (that are available for the field selected above). Select necessary and then click "β–Ί" button to add selected. Let's select all values.

  • An "Add Columns For" (right side) section will contain list of values that will be represented by future columns:

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

Add Dragging

By default an "Allow users to move cards between columns" toggelr is turned on. This means system will automatically configure the following things:

  • Allow dragging cards between columns

  • Create an action that will triggered on drag and will update "Status" field of record represented by dragged card

  • "Status" field of that record will be updated to value that is represented by target column

So, just leave this toggler on:

Specify what Fields do You want to See in a Card

Now click "Next" button to go to step of wizard where you can 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:

  1. Case Number

  2. Subject

  3. Account ID -> Account Name

  4. Created Date

  5. Case type

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.

  • If you want to see card with labels (in "Field name | Field value" format, e.g. "Case Type Mechanical"), leave "Display field labels on Kanban cards" toggler on. Turn it off to show only record properties (field values) on the card.

  • Click "Next" button.

At the following wizard step you have the ability to ask AI for some card coloring. Of course, this is not mandatory.

  • If you interested, click "Generate Color Coding Ideas" button:

  • After a small time AI will suggest several (usually 3) options:

  • Offered ideas can touch card background, left border or some field text color:

  • You can select none, one, several or even all coloring ideas and Card/Card element(s) will take proper formulas in proper CSS rules.

  • You can not select more than one idea for the same card/card element. E.g., if AI suggests 2 ideas for a card background, system will allow you to select only one of them.

  • If you are not satisfied with suggested ideas, you can click "Generate Color Coding Ideas Again" button to give AI one more chance.

Please note that AI is not ideal and can generate (very rarely) incorrect formulas, so, if newly created kanban shows something incorrect, just temporary remove generated formulas from card CSS.

We're working on prompts improvement, but sometimes AI makes us surprised.

  • Select ideas (if you want) and click "Next" button.

Congratulations! Card compact layout is now configured.

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 "Finish" button. If you want just to see results, turn "Launch Advanced Kanban Builder After Wizard Completion" toggler off. If you leave it on (default), 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.

Look at Your New Kanban

  • If you have made any changes (e.g., edited a kanban description), do not forget to 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