The project aimed to create a robust project tracker tailored for Nature-Based Solutions (NBS) developers. The application is designed to streamline task management, facilitate collaboration, and provide a seamless user experience for both project stakeholders and internal teams managing these projects. This tracker integrates frontend and backend functionalities to offer a cohesive ecosystem for project planning and monitoring.

Design Goals

1. Empower stakeholders:
   Enable seamless role management ensuring that all users can effectively interact with the application within the bounds of their roles to improve work efficiency and security.

2. Simplify complexity:
   Present detailed project data, tasks and activities in an intuitive, user-friendly manner.

3. Enhance collaboration:
   Enable seamless communication and task management across all stakeholders.

4. Streamline backend operations:
   Equip the internal team with tools to manage projects, stages, and clients effectively.

Role Management

The purpose of role management in this project was simple yet critical: to ensure every user sees only what’s relevant to them, keeping the data secure. This wasn’t just about keeping things tidy—it was about making sure every user focuses on their responsibilities without distractions or unnecessary complexity.

I realized early on that the needs of admins, editors, and viewers were vastly different. Admins needed full control, editors required tools to manage tasks and collaborate, while viewers only needed a streamlined view of their responsibilities. Trying to offer the same interface to all roles would lead to confusion and inefficiency but creating different screens that aren’t streamlines will create a new set of problems. By creating role-specific experiences, I could ensure clarity and purpose for every user, regardless of their role in the project.

Key Design Elements:

• Role-Specific Dashboards: The interface dynamically adapts based on the user’s role, delivering a focused experience tailored to their needs.

• Permissions-Based Features: Viewers can only interact with tasks they’re assigned to, editors can manage task details and stakeholders, and admins get complete control.

• Quick Filters: A simple “Assigned to Me” filter ensures users can quickly focus on what’s important to them, saving time and eliminating distractions.

Challenges it Solved:

• Avoiding information overload for viewers by showing only tasks assigned to them.

• Allowing editors to have the tools they need to manage tasks without giving them unnecessary admin features.

• Equipping admins with full control over users, roles, and activity logs without making the system overwhelming.

Task management in Kanban Board

Managing tasks across multiple stages of a project can quickly become chaotic, especially with different stakeholders involved. I wanted to ensure that the system felt natural to use—where users could focus on what matters without feeling overwhelmed. By using a Kanban-style board paired with tasks as cards, users get a simple overview and also the ability to dive deep into task specifics.

The goal was to create a space where tasks could be easily organized, tracked, and updated in real time, also integrating the guardrails for different roles, no matter the stage of the project.

Key Design Elements:

• Stage-Specific Kanban Boards: Each stage of the project has its own board, ensuring clarity and focus. Tasks can be dragged and dropped between sections for effortless updates.

• Task Overlays: Clicking on a task opens a detailed overlay, offering everything from checklist management to stakeholder assignments in one place. Editors have full control over updates, while viewers are restricted to viewing and commenting.

• Dynamic Checklists: Checklists are hover able and editable, giving editors the ability to adjust items on the fly while keeping the experience clean and simple for viewers.

• Activity Log : This provides a detailed audit trail of what happened so far inside a task also providing the metadata of every action recorded and a checklist item completed

• Copy to other stages- There are multiple instances where a task can be the same in multiple stages. Instead of defining them multiple times, this will help editors to simply copy them to the other stages.

• Filtering- With filtering based on a member or “Assigned to me” helps every user to navigate the tasks easier. Might be a small design element but creates a huge impact

Challenges it Solved:

• Preventing clutter and helping track tasks by visually separating tasks into just 3 sections

• Removed constant back-and-forth communication

• Ensuring detailed task information (like checklists, attachments, and activity logs) always accessible when needed.

Admin Dashboard

The Admin Dashboard is the powerhouse behind the entire system, designed to give the internal team complete control over projects, clients, and stakeholders. It’s where all the moving parts come together—stages, tasks, logs, and members—to ensure everything runs smoothly on the frontend. The Admin Dashboard empowers the team to handle complexity with ease, enabling smoother operations and better collaboration across the board.

Managing multiple NBS projects, each with unique stages, tasks, and stakeholders, can be overwhelming without a centralized system. I wanted the internal team to have a clean, organized space to define project stages, monitor progress, and make adjustments as needed—all without digging through layers of complexity.

The goal was to simplify backend operations so the team could focus on ensuring project success rather than wrestling with constant back & forth communication with clients.

Key Design Elements:

• Dynamic Tabs: The dashboard includes tabs like Stages, Tasks, Project Logs & Members, and About the Project, giving the team easy access to all project-related information properly sorted.

• Stages: The ability to create or update project stages allows the internal team to customize workflows based on client needs.

• Mirroring Kanban Boards: Mirroring the frontend’s task management system helps the internal team track progress without switching contexts or have constant back & forth emails with clients (restricting the access to read only for internal team).

• Client Management: A dedicated view for managing clients, including active projects, service timelines, and member counts, ensures nothing slips through the cracks.

Challenges it Solved:

• Creating a seamless connection between frontend and backend workflows, ensuring real-time updates for users.

• Allowing the internal team to keep track of logs and member activities for transparency and better decision-making.

A Few Other Features

Apart from the core functionalities, I’ve designed few other features to enhance usability and project management efficiency:

• Gantt Chart Integration: The scrollable Gantt chart offers a dynamic view of project stages and timelines. With yearly, quarterly, monthly, and weekly toggles, users can track progress at any granularity and access the stage’s board directly from the dashboard. Hover functionality adds more depth by revealing details like start and end dates.

• Activity Log: Every action within the system is tracked and logged for transparency.

• Progress Indicators: Visual progress bars and numerical summaries on the main screen give users a quick sense of project health without needing to navigate deeper.

• Notifications: A dedicated section for alerts and updates ensures that no critical action or change is missed, keeping everyone in the loop.

My Role in the Project

I wore many hats to bring this project to life, handling everything from start to finish:

• User-Centric Design: Focused on making the system intuitive for all roles

• Full Ownership: Managed every part of the design process, including wireframing, prototyping, and final design Handoff.

• Collaboration with Developers: Worked closely to ensure smooth implementation of features like Gantt charts, task overlays, and backend tools.

• Iterative Improvements: Tested designs, gathered feedback, and refined the system to meet evolving requirements.

• Scalability in Mind: Designed the system to handle the complexity and scale of multiple, large NBS projects.