Skip to main content

​
Overview

Kanban boards let you visualize work as cards in columns. Drag cards between columns to update their status. Gainable makes it easy to add kanban boards to any app.

​
Requesting a kanban board

Simply describe what you want: 
"Add a kanban board for tasks with columns: To Do, In Progress, Done"
"Show deals as a pipeline board"
"Create a task board where I can drag cards between columns"

​
What you get

When you request a kanban board, Gainable creates:
  • Columns based on your status options
  • Cards for each item showing key information
  • Drag-and-drop to move cards between columns
  • Real-time sync so all users see changes
  • Column counts showing how many items are in each column

​
Defining columns

Columns typically correspond to status values. Be explicit: 
"Kanban board with columns:
- Backlog
- In Progress
- Review
- Done"

​
Card content

Specify what information appears on each card: 
"Cards show:
- Task title
- Assignee name
- Due date
- Priority badge"
Default card content usually includes:
  • Primary field (name/title)
  • Status or category badge
  • Key details (date, assignee, etc.)

​
Common patterns

​
Task board

Build a task tracker with:
- Tasks: title, description, assignee, due date
- Status: to do, in progress, review, done

Add a kanban board where:
- Each column is a status
- Cards show title, assignee, and due date
- Dragging updates the task status

​
Deal pipeline

Build a CRM with:
- Deals: name, company, amount, stage
- Stages: lead, qualified, proposal, negotiation, closed

Show deals as a pipeline board where:
- Each column is a stage
- Cards show deal name, company, and amount
- Dragging moves the deal to that stage

​
Hiring tracker

Track candidates with:
- Name, position, source
- Status: applied, phone screen, interview, offer, hired

Kanban board with:
- Columns for each status
- Cards showing name and position
- Drag to advance candidates through the pipeline

​
Customization

​
Column colors

"Color the columns:
- To Do: purple
- In Progress: blue
- Done: green"

​
Column actions

"Add a + button in each column header to create a new item in that status"

​
Card actions

"Click a card to open an edit modal"
"Add a delete button to cards"

​
Sublabels

"Show the total deal value in each column header"
"Display task count below each column name"

​
Sorting within columns

By default, cards maintain their order. You can request ordering: 
"Sort cards by due date within each column"
"Order cards by priority (high first)"
"Let users drag to reorder cards within a column"

​
Real-time updates

Kanban boards update in real-time:
  • Card moves appear instantly for all users
  • New cards show up when created
  • Edited cards refresh with new content
  • Deleted cards disappear
When you drag a card, the change is saved immediately and all connected users see the move in real-time.

​
Filtering

Add filters to focus on specific cards: 
"Filter the board by assignee"
"Add a priority filter"
"Search cards by title"

​
Multiple boards

You can have multiple kanban views: 
"One board for my tasks (filtered to my assignments)"
"Team board showing all tasks"
"Archive board for completed items"

​
Best practices

Too many columns make the board hard to use. Combine similar statuses if needed.
Show only essential info on cards. Details can go in a detail view on click.
“In Progress” is clearer than “Stage 2”
Colors help users quickly identify stages. Green for done, yellow for in progress, etc.

​
Combining with other features

​
Charts

"Above the kanban board, show a bar chart of task counts by status"

​
List view toggle

"Let users switch between kanban view and list view"

​
Filters

"Add assignee and priority filters above the board"

​
Example: Complete task board

Build a task management app:

Tasks have:
- Title, description
- Status: backlog, to do, in progress, review, done
- Priority: low, medium, high
- Assignee (user)
- Due date

Show a kanban board where:
- Columns: Backlog, To Do, In Progress, Review, Done
- Column colors: gray, purple, blue, orange, green
- Cards show: title, priority badge, assignee avatar, due date
- Drag to move between columns
- Click card to edit details
- + button in each column header to add new task

Filters above the board:
- Filter by assignee
- Filter by priority

​
Learn more

Real-time updates

How sync works

Views

Other view types