Context

"Workflow", Invision's design-driven management tool lets you easily view and organize screens within your project. You can assign screens to any collaborator on the prototype, and project managers, can assign a due date and time, and color code the change for added attention. You can drag and drop screens between project status columns to manage progress and keep your projects up to date.

"Spaces", also by Invision are the working groups for your design projects. Spaces aren’t just documents; they are the place for groups of people rallying around particular design challenges. Spaces let you create standards, structure, and order to encourage effective design processes. Spaces also provide windows into the status and progress of design initiatives for your teammates.

The project below is my representation of how I would combine both features. This was a design test for Invision, as part of the interview process.

Problem

The Invision team had requested an exploration from my own personal perspective, and show how "Workflow" could live inside of "Spaces". For this test challenge, there was very limited information to work off of, and an extremely limited time frame to explore, test and iterate.

Solution

Iterate, iterate, iterate. Once I gathered all the information I could, and dove deep into Invision's style while looking for inspiration, my next step was to exhaust all potential solutions via countless iterations prior to producing final deliverables and interactive prototypes on my ideas for the team.

Sketches

Below are a few fragments of my sketches from this project, which I later turned into high-fidelity mock-ups and animations. 

Showcasing designs via animations

Workflow tab inside Spaces (view #1):
Here's "Workflow" as a tab inside "Spaces" and how it would display all projects in four common states: On hold, In progress, needs reviews, and approved.

Workflow inside Spaces (view #2):

This bird's eye view allows for a sneak preview on the status of each project upon hover, while maintaining each projects title and date.

Workflow inside Spaces (view #3):

This bird's eye view allows you a sneak preview of the status of each project upon hover, plus a detailed list of each task and the respective status column.

Filtering the States (view #4):

This view allows you to view all projects as a list, and also shows how you could potentially filter all projects that have the majority of its tasks held up in one particular state of the process.

Final thoughts

Although I didn't get the job at Invision, I am proud of what I accomplished. I made the most of the limited resources, explored numerous solutions in just a few days, and presented valuable ideas for discussion with their team.

LINKEDIN ○: HELLO@RAPHAELNIETO.COM