Design Challenge: Project Management

Posted in / 2 years ago

Another project management platform?

I’m a productivity geek. I like project/task management tools and have used plenty (Producteev, Wunderlist, Asana and Trello to name a few) for various projects and at work throughout the years. The more feature-rich tools tend to be ugly, bloated and complex, while the ones you actually enjoy using (currently Trello) feel too simple for medium-to-large team projects.

I often feel like I’m missing vital features in these platforms, especially when it comes to project management for agencies where you are working on multiple customers in parallell and need a clear overview of what’s to-do and what’s due next. Especially the times when a customer from a year ago want to build something new for the website or app we built for them, hours can be wasted on trying to get a hold of log in details to hosting, database etc. of which the non-technical customer has no idea.

Hence, I decided to take a shot at designing my own project management platform, with agencies in mind.

This is only a design challenge and not a new project of mine.

Some key features I’ve been missing:

  • Agency overview: status on the projects we have active right now, what is our monthly cashflow etc.
  • Team overview: who is working on which task right now? Easy for project managers to see who’s free.
  • (Project) Clear progress indicator: how far are we from completing the (customer) project? When is the given deadline?
  • (Project) Optional Scrum board layout: seamlessly switch between normal task list and a board layout, for those who prefer that.
  • (Project) Password manager: securely store account details for hosting, database, CMS administrator etc. for easy future access.
  • (Project) Contact details to the customer: especially important for small agencies where there is no appointed “customer relations” person.
  • (Project) Files and documentation: preferably integrate with Google Drive and Dropbox. Should be easy to write project-specific (technical) documentation. Useful for old customers that want updates to their old website or app, of which you have forgotten the technical details of the solution.

Layout exploration

I enjoy sketching my designs before diving into Photoshop, for quick iterations and greater preparatory understanding of what I am to create. I decided to sketch only two views, as this wasn’t a full scaled project. Firstly the “Project details” view, with clearly visible project progress indicators, team status and project accounts. The side menu was later replaced with a tab-menu in the project header, as in the second ‘Tasks’ sketch.

Project details sketch

Project tasks sketch

The final mockup

I’m very happy with the result, especially the top bar (which was quite inspired by Trello). I personally believe that the “scrum board” kind of layout is much better for larger projects, since you can clearly see the status of the tasks. I did however include a “List” alternative view, for if one (perhaps in a smaller project) would prefer a normal vertical to-do list kind of layout. For the “List” view, the the boards would collapse into sections, where each task has a “Status” value corresponding to the board name. That way, switching will be seamless and no information needed to be dropped in the switch.

Project management platform mockup

Like shot on Dribbble

  • yassershaikh

    Hey Jesper, amazing work. I would want to implement this mockup. Can I have your permission and more mocks if possible. Let’s work together on this and see what we can make and where we can go with it. Email me at yrshaikh.mail@gmail.com in case you have any questions.

Let's find out what I can do for you.

Get in touch