VisualBoardUX - IEEE-Team-3/map GitHub Wiki
The visual UX of the Kanban board should be user-friendly, visually distinct, and intuitive. The board will be a drag-and-drop interface, where users can quickly move tasks between columns and interact with them.
- Drag-and-Drop: Users can drag tasks from one column to another.
- Responsive Layout: The board will be fully responsive, adapting to different screen sizes.
- Color-Coding: Tasks will be color-coded based on priority, completion status, or other factors.
- Task Details: Hovering over a task will show brief details like title, assignee, and due date.
- Simplicity: The board should have a clean design with minimal distractions.
- Feedback: Users should receive visual feedback when interacting with tasks (e.g., task moves, completion).
- Intuitiveness: The layout should be easy to understand, even for new users.
+-------------------------------------------+
| To Do | In Progress | Review | Done |
+-------------------------------------------+
| Task 1 | Task 4 | Task 5 | Task 6 |
| Task 2 | Task 7 | Task 8 | Task 9 |
+-------------------------------------------+
function updateTaskStatus(taskId, newStatus) {
const task = Task.findById(taskId);
task.status = newStatus;
task.save();
}
// Frontend logic to move task in the UI
function onDragEnd(result) {
const { destination, source } = result;
if (destination.droppableId !== source.droppableId) {
updateTaskStatus(result.draggableId, destination.droppableId);
}
}