1 files changed, 24 insertions, 6 deletions
diff --git a/docs/user_guide/aruco_markers_pipeline/aoi_3d_frame.md b/docs/user_guide/aruco_markers_pipeline/aoi_3d_frame.md
index 8075426..032e2b6 100644
--- a/docs/user_guide/aruco_markers_pipeline/aoi_3d_frame.md
+++ b/docs/user_guide/aruco_markers_pipeline/aoi_3d_frame.md
@@ -3,11 +3,13 @@ Define a 3D AOI as a frame
 
 When an 3D AOI of the scene contains others coplanar 3D AOI, like a screen with GUI elements displayed on, it is better to described them as 2D AOI inside 2D coordinates system related to the containing 3D AOI.
 
+![3D AOI frame](../../img/aruco_camera_aoi_frame.png)
+
 ## Add ArFrame to ArUcoScene
 
 The [ArFrame](../../argaze.md/#argaze.ArFeatures.ArFrame) class defines a rectangular area where timestamped gaze positions are projected in and inside which they need to be analyzed.
 
-Here is the previous extract where "MyScreen" AOI is defined as a frame into [ArUcoScene](../../argaze.md/#argaze.ArUcoMarkers.ArUcoScene) configuration:
+Here is the previous extract where "Screen" AOI is defined as a frame into [ArUcoScene](../../argaze.md/#argaze.ArUcoMarkers.ArUcoScene) configuration:
 
 ```json
 {
@@ -22,18 +24,34 @@ Here is the previous extract where "MyScreen" AOI is defined as a frame into [Ar
             "layers": {
                 "MyLayer": {
                     "aoi_scene": {
-                        "MyScreen": [[2.5, 2.5, -0.5], [37.5, 2.5, -0.5], [37.5, 27.5, -0.5], [2.5, 27.5, -0.5]]
+                        "Sheet": [[14.2, -3, 28.35], [35.2, -3, 28.35], [14.2, -3, -1.35], [35.2, -3, -1.35]],
+                        "Screen": [[2.75, 2.9, -0.5], [49.25, 2.9, -0.5], [2.75, 29.1, -0.5], [49.25, 29.1, -0.5]]
                     }
                 }
             },
             "frames": {
-            	"MyScreen": {
-            		"size": [350, 250],
+            	"Screen": {
+            		"size": [1920, 1080],
             		"layers": {
             			"MyLayer": {
             				"aoi_scene": {
-            					"BlueTriangle": [[100, 50], [250, 50], [175, 200]]
-            				}
+                                "GeoSector": [[860, 160], [1380, 100], [1660, 400], [1380, 740], [1440, 960], [920, 920], [680, 800], [640, 560]],
+                                "LeftPanel": {
+                                    "Rectangle": {
+                                        "x": 0,
+                                        "y": 0,
+                                        "width": 350,
+                                        "height": 1080
+                                    }
+                                },
+                                "CircularWidget": {
+                                    "Circle": {
+                                        "cx": 1800,
+                                        "cy": 120,
+                                        "radius": 80
+                                    }
+                                }
+                            }
             			}
             		}
             	}