Visualize pipeline steps
========================

Visualization is not a pipeline step, but each [ArFrame](../../argaze.md/#argaze.ArFeatures.ArFrame) pipeline step output can be drawn in real-time or afterward, depending on the application purposes.

![ArFrame visualization](../../img/visualization.png)

## Add image parameters to ArFrame JSON configuration

[ArFrame.image](../../argaze.md/#argaze.ArFeatures.ArFrame.image) method parameters can be configured with a dedicated JSON entry.

Here is an extract from the JSON ArFrame configuration file with a sample where image parameters are added:

```json
{
    "argaze.ArFeatures.ArFrame": {
        "name": "My FullHD screen",
        "size": [1920, 1080],
        ...
        "image_parameters": {
            "draw_gaze_positions": {
                "color": [0, 255, 255],
                "size": 2
            },
            "draw_fixations": {
                "deviation_circle_color": [255, 255, 255],
                "duration_border_color": [127, 0, 127],
                "duration_factor": 1e-2,
                "draw_positions": {
                    "position_color": [0, 255, 255],
                    "line_color": [0, 0, 0]
                }
            }, 
            "draw_saccades": {
                "line_color": [255, 0, 255]
            },
            "draw_scan_path": {
                "draw_fixations": {
                    "deviation_circle_color": [255, 0, 255],
                    "duration_border_color": [127, 0, 127],
                    "duration_factor": 1e-2
                }, 
                "draw_saccades": {
                    "line_color": [255, 0, 255]
                }
            },
            "draw_layers": {
                "MyLayer": {
                    "draw_aoi_scene": {
                        "draw_aoi": {
                            "color": [255, 255, 255],
                            "border_size": 1
                        }
                    },
                    "draw_aoi_matching": {
                        "draw_matched_fixation": {
                            "deviation_circle_color": [255, 255, 255],
                            "draw_positions": {
                                "position_color": [0, 255, 0],
                                "line_color": [0, 0, 0]
                            }
                        },
                        "draw_matched_region": {
                            "color": [0, 255, 0],
                            "border_size": 4
                        }, 
                        "draw_looked_aoi": {
                            "color": [0, 255, 0],
                            "border_size": 2
                        },
                        "looked_aoi_name_color": [255, 255, 255],
                        "looked_aoi_name_offset": [0, -10]
                    }
                }
            }
        }
    }
}
```

!!! warning
    Most of *image_parameters* entries work if related ArFrame/ArLayer pipeline steps are enabled.  
    For example, a JSON *draw_scan_path* entry needs GazeMovementIdentifier and ScanPath steps to be enabled.

!!! note "Export to video file"

    Video exportation is detailed in [gaze analysis recording chapter](recording.md).