diff --git a/docs/hyperdatasets/webapp/webapp_datasets_frames.md b/docs/hyperdatasets/webapp/webapp_datasets_frames.md
index efd167f5..19e9d574 100644
--- a/docs/hyperdatasets/webapp/webapp_datasets_frames.md
+++ b/docs/hyperdatasets/webapp/webapp_datasets_frames.md
@@ -7,7 +7,7 @@ of frames and enables viewing SingleFrames and FramesGroups, and edit SingleFram
 Before opening the frame viewer, you can filter the frames by applying [simple](#simple-frame-filtering) or [advanced](#advanced-frame-filtering) 
 filtering logic. 
 
-![image](../../img/hyperdatasets/frames_01.png)
+![Dataset page](../../img/hyperdatasets/frames_01.png)
 
 ## Frame viewer
 
@@ -15,27 +15,53 @@ Frame viewer allows you to view and edit annotations which can be FrameGroup obj
 labels applied to the entire frame not a region of the frame, the frame details (see [frames](../frames.md)), 
 frame metadata, the raw data source URI, as well as providing navigation and viewing tools. 
 
-![image](../../img/hyperdatasets/web-app/dataset_example_frame_editor.png)
+![Frame viewer](../../img/hyperdatasets/web-app/dataset_example_frame_editor.png)
 
 ### Frame viewer controls
 
 Use frame viewer controls to navigate between frames in a Dataset Version, and control frame changes and viewing.
 
-|Control Icon|Actions|
-|-----|------|
-|<img src="/docs/latest/icons/ico-skip-backward.svg" className="icon size-md space-sm" />|Jump backwards (CTRL + Left). Jumps backwards by five frames.|
-|<img src="/docs/latest/icons/ico-skip-previous.svg" className="icon size-md space-sm" />|Go to the previous frame containing a non-filtered annotation. The filter is the minimum confidence level setting. If the confidence level filter is set to zero, any frame containing annotations matches the filter.|
-|<img src="/docs/latest/icons/ico-arrow-left.svg" className="icon size-md space-sm" />|Go to the previous frame (Left Arrow).|
-|<img src="/docs/latest/icons/ico-arrow-right.svg" className="icon size-md space-sm" />|Go to the next frame (Right Arrow).|
-|<img src="/docs/latest/icons/ico-skip-next.svg" className="icon size-md space-sm" />|Go to the next frame containing a non-filtered annotation (same filter as <img src="/docs/latest/icons/ico-skip-previous.svg" className="icon size-md space-sm" />).|
-|<img src="/docs/latest/icons/ico-skip-forward.svg" className="icon size-md space-sm" />|Jump forwards (CTRL + Right). Jumps 5 frames forwards.|
-|<img src="/docs/latest/icons/ico-revert.svg" className="icon size-md space-sm" />|Reload the frame.|
-|<img src="/docs/latest/icons/ico-undo.svg" className="icon size-md space-sm" />|Undo changes.|
-|<img src="/docs/latest/icons/ico-redo.svg" className="icon size-md space-sm" />|Redo changes.|
-|<img src="/docs/latest/icons/ico-reset_1.svg" className="icon size-md space-sm" />|Autofit|
-|<img src="/docs/latest/icons/ico-zoom-in.svg" className="icon size-md space-sm" />|Zoom in|
-|<img src="/docs/latest/icons/ico-zoom-out.svg" className="icon size-md space-sm" />|Zoom out|
-|Percentage textbox|Zoom percentage|
+|Control Icon|Actions|Shortcut|
+|-----|------|----|
+|<img src="/docs/latest/icons/ico-skip-backward.svg" alt="Jump backwards icon" className="icon size-md space-sm" />| Jumps backwards ten frames | CTRL + Left arrow |
+|<img src="/docs/latest/icons/ico-skip-previous.svg" alt="Jump to previous unfiltered annotation" className="icon size-md space-sm" />|Go to the previous frame containing a non-filtered annotation. The filter is the minimum confidence level setting. If the confidence level filter is set to zero, any frame containing annotations matches the filter.| <img src="/docs/latest/icons/ico-optional-no.svg" alt="Not applicable" className="icon size-md center-md" /> |
+|<img src="/docs/latest/icons/ico-arrow-left.svg" alt="Previous frame icon" className="icon size-md space-sm" />|Go to the previous frame | Left arrow |
+|<img src="/docs/latest/icons/ico-arrow-right.svg" alt="Next frame icon" className="icon size-md space-sm" />|Go to the next frame | Right arrow |
+|<img src="/docs/latest/icons/ico-skip-next.svg" alt="Jump to next unfiltered annotation" className="icon size-md space-sm" />|Go to the next frame containing a non-filtered annotation (same filter as <img src="/docs/latest/icons/ico-skip-previous.svg" alt="Jump to previous unfiltered annotation" className="icon size-md space-sm" />).| <img src="/docs/latest/icons/ico-optional-no.svg" alt="Not applicable" className="icon size-md center-md" /> |
+|<img src="/docs/latest/icons/ico-skip-forward.svg" alt="Jump forwards icon" className="icon size-md space-sm" />|Jump forwards ten frames | CTRL + Right arrow |
+|<img src="/docs/latest/icons/ico-revert.svg" alt="Reload frame icon" className="icon size-md space-sm" />|Reload the frame.| <img src="/docs/latest/icons/ico-optional-no.svg" alt="Not applicable" className="icon size-md center-md" /> |
+|<img src="/docs/latest/icons/ico-undo.svg" alt="Undo icon" className="icon size-md space-sm" />|Undo changes.|Ctrl + Z| 
+|<img src="/docs/latest/icons/ico-redo.svg" alt="Redo icon" className="icon size-md space-sm" />|Redo changes.|Ctrl + Y| 
+|<img src="/docs/latest/icons/ico-reset_1.svg" alt="Autofit icon" className="icon size-md space-sm" />|Autofit| <img src="/docs/latest/icons/ico-optional-no.svg" alt="Not applicable" className="icon size-md center-md" /> |
+|<img src="/docs/latest/icons/ico-zoom-in.svg" alt="Zoom in icon" className="icon size-md space-sm" />|Zoom in| **+** or Ctrl + Mouse wheel| 
+|<img src="/docs/latest/icons/ico-zoom-out.svg" alt="Zoom out icon" className="icon size-md space-sm" />|Zoom out| **-** or Ctrl + Mouse wheel |
+|Percentage textbox|Zoom percentage| <img src="/docs/latest/icons/ico-optional-no.svg" alt="Not applicable" className="icon size-md center-md" /> |
+
+#### Additional keyboard shortcuts
+
+**General controls**
+
+|Control|Action|
+|----|-----|
+|Hold Spacebar + Press and hold image + Drag| Move around image. NOTE: If using a touchpad, this only works if the *Disable touchpad while typing* setting is turned off | 
+|Esc | Escape frame viewer and return to dataset page |
+
+**General annotation controls**
+
+|Control|Action|
+|----|-----|
+| Delete | Remove annotation |
+| Alt + ] / [ | Choose a default ROI label by navigating between previous / next labels  |
+| Shift + M | Edit metadata | 
+| Shift + Tab | Previous annotation (use after clicking an annotation) |
+
+**Mode-specific annotation controls**
+
+|Control |Mode |Action|
+|----|-----|----|
+| Hold Shift | Key points (<img src="/docs/latest/icons/ico-keypoint-icon-purple.svg" alt="Key points mode" className="icon size-md space-sm" />) | While holding Shift, add new points to the ROI by left clicking, and move a single point by dragging it with your mouse | 
+| Enter | Key points (<img src="/docs/latest/icons/ico-keypoint-icon-purple.svg" alt="Key points mode" className="icon size-md space-sm" />) | Complete annotation |
+| Esc | Key points (<img src="/docs/latest/icons/ico-keypoint-icon-purple.svg" alt="Key points mode" className="icon size-md space-sm" />), Polygon (<img src="/docs/latest/icons/ico-polygon-icon-purple.svg" alt="Polygon mode" className="icon size-md space-sm" />) | Cancel annotation process | 
 
 ### Viewing and editing frames
 
@@ -66,7 +92,7 @@ Viewing and editing frames in a FrameGroup is similar to viewing and editing Sin
 Click the FrameGroup in the Dataset. In the frame viewer, select SingleFrame to view / modify from 
 a dropdown list in the **Current Source** section.
 
-![image](../../img/hyperdatasets/framegroup_01.png)
+![Frame dropdown menu in FrameGroup](../../img/hyperdatasets/framegroup_01.png)
 
 ## Filtering frames
 ### Simple frame filtering
@@ -86,7 +112,7 @@ For example:
 <div className="cml-expansion-panel-content">
       
 
-![image](../../img/hyperdatasets/frame_filtering_01.png)
+![Unfiltered version browser](../../img/hyperdatasets/frame_filtering_01.png)
 
 
 </div>      
@@ -99,7 +125,7 @@ For example:
 <summary className="cml-expansion-panel-summary">View a screenshot</summary>
 <div className="cml-expansion-panel-content">
 
-![image](../../img/hyperdatasets/frame_filtering_02.png)
+![Filtered version browser](../../img/hyperdatasets/frame_filtering_02.png)
 
 </div>
 </details>
@@ -138,7 +164,7 @@ where each frame filter can be a combination of ROI, frame, and source rules.
   <summary className="cml-expansion-panel-summary">View a screenshot</summary>
   <div className="cml-expansion-panel-content">
 
-  ![image](../../img/hyperdatasets/frame_filtering_03.png)
+  ![Adding an ROI rule](../../img/hyperdatasets/frame_filtering_03.png)
 
   </div>
   </details>            
@@ -149,7 +175,7 @@ where each frame filter can be a combination of ROI, frame, and source rules.
    <summary className="cml-expansion-panel-summary">View a screenshot</summary>
    <div className="cml-expansion-panel-content">
 
-   ![image](../../img/hyperdatasets/frame_filtering_04.png)
+   ![Add label to ROI rule](../../img/hyperdatasets/frame_filtering_04.png)
 
    </div>
    </details>            
@@ -161,7 +187,7 @@ where each frame filter can be a combination of ROI, frame, and source rules.
    <summary className="cml-expansion-panel-summary">View a screenshot</summary>
    <div className="cml-expansion-panel-content">
 
-   ![image](../../img/hyperdatasets/frame_filtering_05.png)
+   ![Labeled ROIs in frame viewer](../../img/hyperdatasets/frame_filtering_05.png)
 
    </div>
    </details>            
@@ -178,7 +204,7 @@ Filter by metadata using Lucene queries.
     <summary className="cml-expansion-panel-summary">View a screenshot</summary>
     <div className="cml-expansion-panel-content">
 
-    ![image](../../img/hyperdatasets/frame_filtering_08.png)
+    ![Filter by metadata ](../../img/hyperdatasets/frame_filtering_08.png)
 
     </div>
     </details>            
@@ -190,7 +216,7 @@ Filter by metadata using Lucene queries.
     <summary className="cml-expansion-panel-summary">View a screenshot</summary>
     <div className="cml-expansion-panel-content">
 
-    ![image](../../img/hyperdatasets/frame_filtering_09.png)
+    ![Frame metadata in frame viewer](../../img/hyperdatasets/frame_filtering_09.png)
 
     </div>
     </details>            
@@ -207,7 +233,7 @@ Filter by sources using Lucene queries.
     <summary className="cml-expansion-panel-summary">View a screenshot</summary>
     <div className="cml-expansion-panel-content">
 
-    ![image](../../img/hyperdatasets/frame_filtering_10.png)
+    ![Filter by source](../../img/hyperdatasets/frame_filtering_10.png)
 
     </div>
     </details>            
@@ -227,16 +253,16 @@ You can add annotations by drawing new bounding areas, and copying existing anno
 
 1. Click one of the following modes and create a bounding area in the frame:   
    
-    * <img src="/docs/latest/icons/ico-rectangle-icon-purple.svg" className="icon size-md space-sm" /> - Rectangle mode: Drag a 
+    * <img src="/docs/latest/icons/ico-rectangle-icon-purple.svg" alt="Rectangle mode icon" className="icon size-md space-sm" /> - Rectangle mode: Drag a 
    rectangle onto the frame.   
     
-    * <img src="/docs/latest/icons/ico-ellipse-icon-purple.svg" className="icon size-md space-sm" /> - Ellipse mode: Drag an ellipse 
+    * <img src="/docs/latest/icons/ico-ellipse-icon-purple.svg" alt="Ellipse mode icon" className="icon size-md space-sm" /> - Ellipse mode: Drag an ellipse 
    onto the frame.   
     
-    * <img src="/docs/latest/icons/ico-polygon-icon-purple.svg" className="icon size-md space-sm" /> - Polygon mode: Click the polygon
+    * <img src="/docs/latest/icons/ico-polygon-icon-purple.svg" alt="Polygon mode icon" className="icon size-md space-sm" /> - Polygon mode: Click the polygon
    vertices onto the frame.       
     
-    * <img src="/docs/latest/icons/ico-keypoint-icon-purple.svg" className="icon size-md space-sm" /> - Key points mode: Click each 
+    * <img src="/docs/latest/icons/ico-keypoint-icon-purple.svg" alt="Key points mode icon" className="icon size-md space-sm" /> - Key points mode: Click each 
    keypoint onto the frame. After the clicking the last keypoint, click the first again to close the bounding area.   
 
     A new annotation is created. 
@@ -250,6 +276,8 @@ You can add annotations by drawing new bounding areas, and copying existing anno
 **To copy an annotation:**
 
 1. Click the annotation or bounded area in the image or video clip.
+1. In the annotation, click <img src="/docs/latest/icons/ico-copy-to-clipboard.svg" alt="Copy annotation icon" className="icon size-md space-sm" /> 
+   (copy annotation)   
 1. Optionally, navigate to a different frame.
 1. Click **PASTE**. The new annotation appears in the same location as the one you copied.
 1. Optionally, to paste the same annotation, click **PASTE** again in the desired frame.