# Doc: https://www.hipaatizer.com/docs/tutorials/how-to-canvas

> LLM view for https://www.hipaatizer.com/docs/tutorials/how-to-canvas

This file contains all documentation content in a single document following the llmstxt.org standard.

## How to add Canvas to HIPAA-Compliant form - HIPAAtizer

# Canvas

The HIPAAtizer platform allows you to add 'Canvas' components to your forms. Canvas components can be used to add interactable images to your form, which patients can use to illustrate specific issues - for example, highlighting areas they're experiencing pain on a sample body diagram. This guide will walk you through the process of how to embed the new canvas in your form.

## Adding a Canvas Component

### Opening the Form Builder

Open the form builder by either editing and existing form, or creating a new form. Locate the "Canvas" component (1) in the form builder and drag and drop it to an appropriate row (2).

![HIPAAtizer form builder with the Canvas component highlighted in the Components panel and dragged onto the form](https://www.hipaatizer.com/docs/assets/images/Picture_1-52c13bb2cdbe8bb37d2945c52d827fe8-52c13bb2cdbe8bb37d2945c52d827fe8.png)

### Uploand an Image

Upon "dropping" the Canvas Component into the form, a Settings window will open.  From this Settings window, you should click on "Upload" to upload the desired HIPAA diagram or blank canvas.

![HIPAAtizer Canvas component settings window with the Upload button for adding a body diagram or blank canvas image](https://www.hipaatizer.com/docs/assets/images/Picture_2-d4be39505030ed5cd63021997b0a3e3a-d4be39505030ed5cd63021997b0a3e3a.png)

### Setting Component Label and User Instruction

The "Label Name" is the prompt or instruction that the user sees when they are filling out the form.  In this example, the user is asked to indicate any piercings when they are filling out the form.

![HIPAAtizer Canvas component settings with the Label Name field showing a prompt asking users to indicate piercings](https://www.hipaatizer.com/docs/assets/images/Picture_3-7051506925a61299151e8ba301667746-7051506925a61299151e8ba301667746.png)

### Adjusting Settings for the Canvas

The main settings for the Canvas component include the color and weight of the lines that will be drawn.  To adjust these, in the "Settings" window, you can select a color (1) that will be used to draw on the Canvas, a thickness to the lines (2) and don't forget to note the unique name (3) if you are linking the form to a printable PDF template.  After adjusting these settings, click "Save Changes" at the bottom of the "Settings" window.

![HIPAAtizer Canvas settings showing the drawing color picker (1), line thickness slider (2), and unique name field (3)](https://www.hipaatizer.com/docs/assets/images/Picture_4-b747391f63e814bc846a62cae4377cdc-b747391f63e814bc846a62cae4377cdc.png)

### Finalize your Form

Add or edit any additional fields. Once you have finalized the form, press "Save" and "Publish" in the form builder.

![HIPAAtizer form builder with the Save button highlighted after finalizing the form with a Canvas component](https://www.hipaatizer.com/docs/assets/images/Picture_5-e77dc9b1f32f1762182859d84382a6aa-e77dc9b1f32f1762182859d84382a6aa.png)

![HIPAAtizer form builder with the Publish button highlighted to make the form with Canvas live](https://www.hipaatizer.com/docs/assets/images/Picture_6-c3dff71c1cd5c4949273e058834944ba-c3dff71c1cd5c4949273e058834944ba.png)

## Using Canvas

### Checking or Previewing the Form

In either the "Preview" mode or simply as a regularly published form, you can see how the user will be prompted to complete this part of the form.

![HIPAAtizer form preview showing the Canvas component with a body diagram and the user prompt](https://www.hipaatizer.com/docs/assets/images/Picture_7-c30fde3ad04aefddb2ea32fd133602d9-c30fde3ad04aefddb2ea32fd133602d9.png)

### Drawing on the Canvas

Either in "Preview" mode (as below) or by embedding the form on a website or generating a link, the respondent can simply indicate the required information with their computer mouse or, if on a mobile device, with their finger.  As you can see below, the respondent has three piercings.

![HIPAAtizer Canvas component in preview mode with a respondent's drawing showing three piercings on the body diagram](https://www.hipaatizer.com/docs/assets/images/Picture_8-4574e2a5f7ef03e56d82345afbea30b6-4574e2a5f7ef03e56d82345afbea30b6.png)

## Embedding or Activating a Form with a Canvas Component

In the "My Forms" dashboard, click on "Embed Form". There are four options for embedding available. The most common forms of embedding and sharing are to click "Embed Code" and follow the instructions, or click "Share Link" and then "Copy" to copy the link into an email to clients.

![HIPAAtizer My Forms dashboard with the Embed Form button highlighted and four embedding options visible](https://www.hipaatizer.com/docs/assets/images/Picture_9-077db64aa1a803963ca6391af300b2fe-077db64aa1a803963ca6391af300b2fe.png)

![HIPAAtizer Share Link option with the Copy button for sharing the form link via email](https://www.hipaatizer.com/docs/assets/images/Picture_10-57d2c756d69a5a63e92d2ec033fea9f5-57d2c756d69a5a63e92d2ec033fea9f5.png)

## Accessing and Downloading Submissions

From the "My Forms" dashboard, click on #(View Details) to enter the "Submissions" dashboard. Click on (1) "View Details" or, to download a PDF of the submission, click on (2) "Download PDF".

You may also set the "Additional Columns" to an appropriate value (3) in order to better sort and identify submissions.

:::::info[Reminder: ]
As a reminder, if you want a customized canvas, you should attach a print template in the Form Settings. Contact us at support@hipaatizer.com to help convert or create a template.
:::::

![HIPAAtizer Submissions dashboard showing a Canvas form submission with View Details and Download PDF actions](https://www.hipaatizer.com/docs/assets/images/Picture_11-6fae1a177a3990c43bb3929df2bcb2ef-6fae1a177a3990c43bb3929df2bcb2ef.png)

![HIPAAtizer Submissions dashboard with Additional Columns configured to display patient identification fields](https://www.hipaatizer.com/docs/assets/images/Picture_12-5d550aeebfddedefc9e11930cb30aa9d-5d550aeebfddedefc9e11930cb30aa9d.png)