Side Project - Mapping out the dashboard

As I am working on this solo I plan to create a rough flat plan of the key workspaces to get an overview of everything that is involved in each space. I can then review and adjust in stages to make sure I have covered the key tasks and that the workflow for users is easy to understand.

I will start with the dashboard as this will be the starting point for users. So what does the user need to access globally?

  • Projects (via the grid due to having multiple projects)

  • Team (a directory of users who can be added to projects)

  • Resources (any assets attached to a task, grouped into projects)

  • Account settings

  • Logout functionality

The primary goal of the dashboard is to give the user an overview of their workload and progress. Alongside this they need to access projects quickly.

My initial thoughts for the global navigation are to have a fixed sidebar (A) that can be added to contextually. Additional functionality can then be added to this main navigation depending on what they are doing within the app.

To help users manage their workload a list of priority tasks (B) could be shown with a deadline indicator. My initial thoughts were to display the five most urgent tasks to avoid overwhelming the user. These would link to the respective projects, and have the associated side panel displaying once accessed in the project page, so that the user can quickly access any further information about the task. I will also use colour coding to show whether a task is overdue or approaching. This system will run throughout the app for consistency.

Alongside this a notification bar could be used to display daily events (C) to alert users to any meetings etc they have planned. It would also be useful to have the option to be able to access a full calendar view from here so users can get an overview. A modal or full screen overlay could work well, especially if any further functionality is needed such as adding more events or changing dates.

Alongside the time management tools I would like to give users an overview of their business (D). Hopefully giving them insights into their earnings, time allocations etc can help them manage their time and money.  There could be multiple statistics to show here so having the option to customise the information shown may be helpful. This could be managed from the settings page, however it may be more useful if there is a contextual menu that allows them to change the displayed information directly.

For the information they could access initially:

  • Monthly earnings (total of time added to all projects for the current month)

  • Total time worked (hours)

  • Time per project (based on actual time recorded)

  • Tasks completed (based on users marking a project as complete)

  • Monthly comparison (total earnings for the previous 6 months to see progress)

This list could increase but these will provide a good starting point. A second option for these stats could be to have groups of statistics that could be swapped out within the panel. For example a money group displaying earnings etc or a time panel to break down time management.

The project grid (E) is intended to give users a birds eye view of all current projects. Each project will be displayed as a card which displays high level information about the project. Initially this would display, the project name and client details. A deadline would also be shown, showing the final deadline for the project, which would be added when the user initially creates the project.

Alongside this the hours worked and remaining tasks would also be displayed. It would also be helpful to continue the colour indication system through the project grid to help users spot deadlines that are approaching etc. An additional notification (F) could be shown if a user has completed all projects and their deadline has passed to remind to invoice their clients. Invoicing or marking the whole project as complete would archive the project so it is out of the way of open projects but still available for reference.

It would be interesting to have some external input as to the best way to organise the project grid? My initial thoughts were to have them ordered by deadline date with the closest deadline being first. Another option would be to allow the user to reorder them. Depending on the workload of a user there may also be a requirement for search / filter functionality which could be something to include.

As the dashboard is to help users manage their workload it may also be worth having a contextual menu available here that would allow users to manage their projects. This could include tasks such as marking projects complete / invoicing etc?

I think the dashboard is in a good place to start out with, although I do plan on reviewing it in detail once I have a more complete project page as creating an initial layout for the project page may highlight additional functionalities that could be useful for the user.

As I mentioned earlier, there is also a number of secondary tasks that could be useful on the dashboard that could be displayed contextually to avoid bloating the design which will need to be included. I plan to revisit each workspace and expand on all the individual functionalities to create a complete flat plan of available actions and states required before designing the interface.