What is workflow?
- 3 minutes to read
After customers have selected a product in a storefront, they will personalize it. They add text or images to a product. Finally, they approve the result and download it. In Customer's Canvas, all these processes are called Workflow. Let's see how different workflows looks.
In this example, customers go through three tabs. At the Variant Selector step, they select a design, product shape and style by filters. Then, they personalize the design at the Editor step: change texts or add something else. In the end, they see the result at the Approval step.
The next example shows how you can implement mockups for displaying the design on complicated forms. In the beginning, customers can add images, shapes, or text, and see it on the flat mockup. At Approval, the result will be displayed as on the real product with corresponding distortions.
This personalization process allows customers to create postcards with individual data, which is imported from an Excel file.
These examples illustrate that workflow can look different. It archives because workflows are customized. It allows you to create a workflow suitable for the features of your product.
Personalization process in workflow is divided into separate sequential little processes. For example, choosing a product variant, adding images and texts, approving the result, and so on.
Each process is embedded in a separate step. This is a screen, where you can embed some instruments for a process. You can switch the steps by the Next or Back buttons.
In the following example, the personalization process is divided into three steps. At each step, a customer goes through selecting front side, selecting back side, and getting the result.
Creating a name card, a customer goes through three steps: selecting a background and adding some text, then uploading a name array, and approving the results.
Content of step
Steps are divided into several screen parts, where you can embed editor, image gallery, tables, and so on. These parts are called panels. In the following schema, you can see the location of each panel.
Let's consider details in the table below.
|Navigation Panel||It shows buttons to switch the steps. This panel is added automatically.|
|Main Panel||This is the central panel of a step. It can contain big visual widgets as the Design Editor, Gallery, Slider, etc.|
|Tool panel and Right panel||They may include options or other tools.|
|Bottom panel||This panel is used for approval checkboxes or adding an Excel table with some data.|
To know more about steps in workflow, read the Structure article.
Workflows are defined in workflow files. A workflow file is a file in JSON format. In this file, you can describe steps, widgets, and items related to assets. Customer's Canvas suggests two approaches of interacting with products: the PIM module and Product Specification. Both these approaches have the same workflow files in JSON format. The differences are in file managers. To know more details, read the Creating and editing workflows article.
According to the Product Specification approach, you create a product with one design. You create a new product, input a name, and then change a workflow file. It defines attributes, which you need to add below. To learn about creating a product in Product Specification in detail, read the Product specifications article.
The PIM module allows you to create one product with product variants. These variants are created by connecting many designs and other options to the product. To know how to create a product and add the workflow file in the PIM module, read the Product Information Management article.
Now you are known that workflows are described in workflow files. To know more about workflow files, read the next Creating and editing workflows article.