×

Introduction to Workflow

What is Workflow?

Workflow is a new way for managing prototype screens and their statuses visually. It allows you to quickly update screen statuses by dragging and dropping them into columns and makes it easy to see at a glance the status of all the screens in a prototype. It allows assignment of screens to individuals, tracking of tasks associated with a screen, due dates, etc.

Using Workflow

Changing the Status of a Screen

To use Workflow, you can open a prototype and click on the Workflow tab. By default you'll see four columns displayed:

  • On Hold: Screens which are not actively being worked, not pending review, and not approved
  • In Progress: Screens which are being worked on currently
  • Needs Review: Screens which are ready for stakeholder/client approval
  • Approved: Screens which have been approved

Changing the status of a screen is as simple as dragging the screen from one status and dropping it on another, or placing it higher in the list.

Adding a Placeholder Screen

Placeholder screens let you define the screens you'll need to build right at the start of the project and can be used like any other screen while you build your prototype. You can link to a placeholder screen in a hotspot and then later replace the placeholder with your real screen when ready.

You can add a placeholder screen by clicking the + sign at the bottom of a column. Once you add the screen, you’ll be able to create a description, assign it to a collaborator, add a due date, and add tasks. Once you add a placeholder screen in Workflow, it’ll show up in your project as well.

Assigning a Screen to a Collaborator

If you’d like to track who is assigned to work on a screen, you can click in the "Assigned To" dropdown and select a collaborator on the project to whom you’d like to assign the screen. This is useful for tracking which designer is working on a screen or which stakeholder needs to review the screen.

Adding a Due Date

You can set a due date on a screen to help track when the screen must be completed. Once set, the due date displayed will be color-coded with the date becoming more vibrantly colored the closer the due date is.

To add a due date, simply click Add a Due Date and select a date and time.

Adding a Description

You can add a description to help track the purpose of a screen, provide additional details about what it should do, how it should interrelate to other screens, and generally provide information that might be helpful for others collaborating on the prototype.

To do so, simply click Add a description to edit the description on the screen.

Adding Tasks to a Screen

If there are specific tasks that need to be completed for a particular screen that’s in progress, you can define those tasks by clicking Add a new task and specifying the task. This will generate a checklist of tasks associated with the screen so you can track what’s needed to move a screen through your workflow to completion.

You can also add a task via a comment in the Comments tab of Workflow. Click a comment, then hover next to it and click the task checkbox. Note that you only need to click the checkbox once; clicking more than that will create multiple tasks.

Viewing and Replying to Comments on a Screen in Workflow

Comments are important when reviewing the status of your screens. To make it simpler to reference comments in Workflow, you can click the comment tab in the screen details modal in Workflow to view comments for that screen. You can click a comment to add a response.

 

Viewing Activity in Workflow

The Activity tab in Workflow gives you an idea of everything that has happened on your screen in the last 30 days. You’ll be able to see changes in status, screen assignment from one user to another, updates to the screen including new file uploads, creation and completion of tasks, and changes to the due date.

 

Workflow in Enterprise

In addition to the base functionality, Enterprise plans enjoy some additional functionality for customizing Workflow to meet their needs.

With Enterprise, you can:

  • Rename statuses to customize them for your own processes
  • Reorder statuses
  • Add custom statuses
  • Change the color associated with a status
  • Change the default status for new screens

Renaming a Status

To rename a status, hover over the name of the status. You should see a pencil icon if it's editable. Click on the title to bring up a text field and you'll then be able to rename the status.

Reordering Statuses

You can reorder statuses by simply dragging the list to a new place on the page.

Adding a New Status

To add a new status:

  1. Click the + icon to the right of the status lists:

  2. Enter the name of the list and select the color you'd like to use:

  3. Click Add to create the new status

Changing the Color of a Status

To change the color of a status list, click the triple dot menu button () on the list and then select the new color you'd like to use for that status.

Only colors not already associated with another status will be available for selection. If you want to use a color associated with another status, you'll first need to change the color of that list to a different color to free up the original color.

Changing the Default Status

You can change the default status if you'd prefer that new screens appear in another list by default. To do so, create the new status if you haven't already and then click the triple dot menu button () on that list. Click Set as default status to make that status the new default for new screens created in that prototype.