Overview

VidGrid allows Canvas users to capture videos directly from the LMS. With the integration, users are automatically created and logged in based on their Canvas credentials. Creators can record, upload, and search their library for content. Videos can be inserted anywhere the Rich Content Editor (RCE) resides in Canvas. 

Additionally, auto-graded video quizzes, student recording assignments, and a full-app portal view can be configured.

This document outlines the setup for the following integrations:

  1. Configure Developer Keys
  2. VidGrid Embed Integration
  3. VidGrid Quiz Integration
  4. VidGrid Portal Integration
  5. VidGrid Student Recording Integration

Prerequisites

  • Admin access to VidGrid
  • Admin access to Canvas (Developer Keys, Global Settings)

Video Installation Overview:

1. Configure Developer Keys

1.1.  Login to Canvas as an Admin.

1.2.  In the left-hand navigation pane, select Admin
1.3.  Click Developer Keys (see Figure 1).

(Figure 1)

1.4. Click "+ Developer Key" > "+ LTI Key" in the top right of the page.

1.4.a.  This is a list of the settings (see Figure 2). (Note: Each individual integration requires its own developer key. There are four in total if all integrations are utilized)

 (Figure 2)

2. VidGrid Embed Integration

2.1 Input the following values in the text fields within the Developer Keys.

Key Name: VidGrid Embed
Owner Email: Email for Canvas/VidGrid Admin
Redirect URIs: https://app.vidgrid.com/lti/toolRedirect
Method: Manual Entry
Title: VidGrid Embed
Description: Easily record, upload, or search for existing videos to insert into your course. The VidGrid Embed icon will appear in the Rich Content Editor (RCE). The instructor can preview, add questions, request captions, and edit the video from the integration before it is inserted into a course.
Target Link URL: https://app.vidgrid.com/lti/embed/13
OpenID Connect Initiation URL: https://app.vidgrid.com/lti/oidc/canvas
JWK Method: Public JWK
Paste the following:

{
    "e": "AQAB",
    "n": "pColD4IRleB6o0msXFTIMpbEdwKdBDzy0qFY73SAhf02wkDhhfXHRbXcy89vUSNNbCVIAO6eyIaB3g-n3EoqjHOUse39gV2aDC32_T0uupYwwRISMlvMczPaTV89R7B_anmKrvBpQOLHKHwPJWCkv_TxYryccMvKh8tpjsanmJ9GNDLDphwI7bsw4Ef17oCNHCjoKCZeASbkeRQ69VtqJ4ecXOiQHt8rkoXWVkN_Tm0IgLzHg50ASGnr8SgoPLIROD088jbjspDIgz8Yj6Tv0inb-iCqO3aC8J0DiZV8v0Gche87DgT3x_BXX0uQQhByfbUb_YWyuBkCiXupxVRpkQ==",
    "alg": "RS256",
    "kid": "8e1a73c8-0c78-11ea-8d71-362b9e155667",
    "kty": "RSA",
    "use": "sig"
}

LTI Advantage Services: Select All Checkboxes
Additional Settings: 


Placements: Editor Button (Additional placements may also be chosen by the Admin as desired. The Editor Button is the only required placement)
Click on the dropdown for each Placement: Target Link URI and Icon URL  (Note: Use the same Target URI and Icon URL as listed above for each placement)

2.2 Click Save.
2.3 From the Developer Keys Account Page. Turn State: ON (see Figure 3)

(Figure 3)

2.4 Copy Client ID (Number shown in the Details Column). You will need this twice so keep it somewhere you can find easily. (see Figure 3)
2.5 In the Navigation menu on the left hand side, go to Settings > Apps (top of page) > View App Configurations  > + App (see Figure 4).

(Figure 4)

Configuration Type: By Client ID
Client ID: (Paste Client ID copied in step 2.4)

2.6 Click Submit
2.7 From the External Apps List, click Settings icon for VidGrid Embed (see Figure 5).

(Figure 5)

2.8 Click Deployment Id. Copy the Deployment ID (keep this handy).
2.9 Log into VidGrid as an Admin. Navigate to Account Settings (see Figure 6) > LTI Settings.

(Figure 6)

2.10 Fill out the LTI basic settings.

  • What LMS is your organization using?: Canvas
  • What is the URL of your LMS?  Copy and paste your org's Canvas URL (i.e. https://vidgrid.instructure.com)
  • Click Save

2.11 LTI 1.3 Settings > Add a new LTI 1.3 deployment

  • Select LMS: Canvas
  • Embed LTI
  • Auth host: Copy and paste your org's Canvas URL (i.e. https://vidgrid.instructure.com)
  • Client ID: Paste Client ID from 2.4
  • Deployment ID: Paste Deployment ID from 2.8
  • Click Save

2.12 Test the integration. Go anywhere in Canvas with the RCE and click on the VidGrid icon that now appears in the menu (see Figure 7.)

(Figure 7)

3. VidGrid Quiz Integration

3.1 Follow the same steps listed in 1.1 - 1.4 Developer Keys.

3.2 Input the following values in the text fields within the Developer Keys.

Key Name: VidGrid Quiz
Owner Email: Email for Canvas/VidGrid Admin
Redirect URIs: https://app.vidgrid.com/lti/toolRedirect
Method: Manual Entry
Title: VidGrid Quiz
Description: Grades from in-video quizzes are automatically passed back to the gradebook upon video completion. Simply create your video quiz and assign it to you learners. Instructors and learners can see scores for instant feedback.
Target Link URI: https://app.vidgrid.com/lti/quiz/13
OpenID Connect Initiation URL: https://app.vidgrid.com/lti/oidc/canvas
JWK Method: Public JWK
Paste the following:

{
    "e": "AQAB",
    "n": "pColD4IRleB6o0msXFTIMpbEdwKdBDzy0qFY73SAhf02wkDhhfXHRbXcy89vUSNNbCVIAO6eyIaB3g-n3EoqjHOUse39gV2aDC32_T0uupYwwRISMlvMczPaTV89R7B_anmKrvBpQOLHKHwPJWCkv_TxYryccMvKh8tpjsanmJ9GNDLDphwI7bsw4Ef17oCNHCjoKCZeASbkeRQ69VtqJ4ecXOiQHt8rkoXWVkN_Tm0IgLzHg50ASGnr8SgoPLIROD088jbjspDIgz8Yj6Tv0inb-iCqO3aC8J0DiZV8v0Gche87DgT3x_BXX0uQQhByfbUb_YWyuBkCiXupxVRpkQ==",
    "alg": "RS256",
    "kid": "8e1a73c8-0c78-11ea-8d71-362b9e155667",
    "kty": "RSA",
    "use": "sig"
}

LTI Advantage Services: Select All Checkboxes
Additional Settings: 

Placements: Assignment Selection
Click on the dropdown for each Placement: Target Link URI and Icon URL (Note: Use the same Target URI and Icon URL as listed above for each placement)

3.3 Click Save.
3.4 From the Developer Keys Account Page. Turn State: ON (see Figure 3)
3.5 Copy Client ID (Number shown in the Details Column). You will need this twice so keep it somewhere you can find easily. (see Figure 3)
3.6 In the Navigation menu on the left hand side, go to Settings > Apps (top of page) > View App Configurations  > + App (see Figure 4).

Configuration Type: By Client ID
Client ID: (Paste Client ID copied in step 3.5)

3.7 Click Submit
3.8 From the External Apps List, click Settings icon for VidGrid Quiz (see Figure 5).
3.9 Click Deployment Id. Copy the Deployment ID (keep this handy).
3.10 Log into VidGrid as an Admin. Navigate to Account Settings (see Figure 6) > LTI Settings.

3.11 LTI 1.3 Settings > Add a new LTI 1.3 deployment

  • Select LMS: Canvas
  • Quiz LTI
  • Auth host: Copy and paste your org's Canvas URL (i.e. https://vidgrid.instructure.com)
  • Client ID: Paste Client ID from 3.5
  • Deployment ID: Paste Deployment ID from 3.9
  • Click Save

3.12 Test the integration. Add an assignment in Canvas > Submission Type > External link (Select VidGrid Quiz) > Add points > Save and Publish > Select Video with In-Video Quiz from your VidGrid account. You should see a confirmation that the learner will see the video in the assignment. > Take the quiz as a student, the grades will appear in the gradebook.

4. VidGrid Portal Integration

4.1 Follow the same steps listed in 1.1 - 1.4 Developer Keys.

4.2 Input the following values in the text fields within the Developer Keys.
Key Name: VidGrid Portal
Owner Email: Email for Canvas/VidGrid Admin
Redirect URIs: https://app.vidgrid.com/lti/toolRedirect
Method: Manual Entry
Title: VidGrid Portal
Description: Access the whole VidGrid app experience within the LMS environment. Instructors can access their manage their Grid, edit videos, request/edit captions, duplicate and combine videos, share videos, and much more without leaving the LMS.
Target Link URI: https://app.vidgrid.com/lti/portal/13
OpenID Connect Initiation URL: https://app.vidgrid.com/lti/oidc/canvas
JWK Method: Public JWK
Paste the following:

{
    "e": "AQAB",
    "n": "pColD4IRleB6o0msXFTIMpbEdwKdBDzy0qFY73SAhf02wkDhhfXHRbXcy89vUSNNbCVIAO6eyIaB3g-n3EoqjHOUse39gV2aDC32_T0uupYwwRISMlvMczPaTV89R7B_anmKrvBpQOLHKHwPJWCkv_TxYryccMvKh8tpjsanmJ9GNDLDphwI7bsw4Ef17oCNHCjoKCZeASbkeRQ69VtqJ4ecXOiQHt8rkoXWVkN_Tm0IgLzHg50ASGnr8SgoPLIROD088jbjspDIgz8Yj6Tv0inb-iCqO3aC8J0DiZV8v0Gche87DgT3x_BXX0uQQhByfbUb_YWyuBkCiXupxVRpkQ==",
    "alg": "RS256",
    "kid": "8e1a73c8-0c78-11ea-8d71-362b9e155667",
    "kty": "RSA",
    "use": "sig"
}

LTI Advantage Services: Select All Checkboxes
Additional Settings: 

Placements: Global Navigation and/or Course Navigation (Additional placements may also be chosen by the Admin as desired.)
Click on the dropdown for each Placement: Target Link URI and Icon URL (Note: Use the same Target URI and Icon URL as listed above for each placement)

4.3 Click Save.
4.4 From the Developer Keys Account Page. Turn State: ON (see Figure 3)
4.5 Copy Client ID (Number shown in the Details Column). You will need this twice so keep it somewhere you can find easily. (see Figure 3)
4.6 In the Navigation menu on the left hand side, go to Settings > Apps (top of page) > View App Configurations  > + App (see Figure 4).

  • Configuration Type: By Client ID
  • Client ID: (Paste Client ID copied in step 4.5)

4.7 Click Submit
4.8 From the External Apps List, click Settings icon for VidGrid Portal (see Figure 5).
4.9 Click Deployment Id. Copy the Deployment ID (keep this handy).
4.10 Log into VidGrid as an Admin. Navigate to Account Settings (see Figure 6) > LTI Settings.
4.11 LTI 1.3 Settings > Add a new LTI 1.3 deployment

  • Select LMS: Canvas
  • Portal LTI
  • Auth host: Copy and paste your org's Canvas URL (i.e. https://vidgrid.instructure.com)
  • Client ID: Paste Client ID from 4.5
  • Deployment ID: Paste Deployment ID from 4.9
  • Click Save

4.12 Test the integration. The Portal will appear in the Canvas Global and/or Course Navigation (link only).

5. VidGrid Student Recording Integration

5.1 Follow the same steps listed in 1.1 - 1.4 Developer Keys.

5.2 Input the following values in the text fields within the Developer Keys.

Key Name: VidGrid Student Record
Owner Email: Email for Canvas/VidGrid Admin
Redirect URIs: https://app.vidgrid.com/lti/toolRedirect
Method: Manual Entry
Title: VidGrid Student Record
Description: Assign video recording assignments to your learners. The student records and previews the video all from within the LMS. The instructor receives the video in their course folder as soon as the learner approves the recording. These assignments can be added as graded assignments to the gradebook.
Target Link URI: https://app.vidgrid.com/lti/record/13
OpenID Connect Initiation URL: https://app.vidgrid.com/lti/oidc/canvas
JWK Method: Public JWK
Paste the following:

{
    "e": "AQAB",
    "n": "pColD4IRleB6o0msXFTIMpbEdwKdBDzy0qFY73SAhf02wkDhhfXHRbXcy89vUSNNbCVIAO6eyIaB3g-n3EoqjHOUse39gV2aDC32_T0uupYwwRISMlvMczPaTV89R7B_anmKrvBpQOLHKHwPJWCkv_TxYryccMvKh8tpjsanmJ9GNDLDphwI7bsw4Ef17oCNHCjoKCZeASbkeRQ69VtqJ4ecXOiQHt8rkoXWVkN_Tm0IgLzHg50ASGnr8SgoPLIROD088jbjspDIgz8Yj6Tv0inb-iCqO3aC8J0DiZV8v0Gche87DgT3x_BXX0uQQhByfbUb_YWyuBkCiXupxVRpkQ==",
    "alg": "RS256",
    "kid": "8e1a73c8-0c78-11ea-8d71-362b9e155667",
    "kty": "RSA",
    "use": "sig"
}

LTI Advantage Services: Select All Checkboxes
Additional Settings: 

Placements: Assignment Selection
Click on the dropdown for each Placement: Target Link URI and Icon URL (Note: Use the same Target URI and Icon URL as listed above for each placement)

5.3 Click Save.
5.4 From the Developer Keys Account Page. Turn State: ON (see Figure 3)
5.5 Copy Client ID (Number shown in the Details Column). You will need this twice so keep it somewhere you can find easily. (see Figure 3)
5.6 In the Navigation menu on the left hand side, go to Settings > Apps (top of page) > View App Configurations  > + App (see Figure 4).

  • Configuration Type: By Client ID
  • Client ID: (Paste Client ID copied in step 5.5)

5.7 Click Submit
5.8 From the External Apps List, click Settings icon for VidGrid Student Record (see Figure 5).
5.9 Click Deployment Id. Copy the Deployment ID (keep this handy).
5.10 Log into VidGrid as an Admin. Navigate to Account Settings (see Figure 6) > LTI Settings.
5.11 LTI 1.3 Settings > Add a new LTI 1.3 deployment

  • Select LMS: Canvas
  • Guest Recording LTI
  • Auth host: Copy and paste your org's Canvas URL (i.e. https://vidgrid.instructure.com)
  • Client ID: Paste Client ID from 5.5
  • Deployment ID: Paste Deployment ID from 5.9
  • Click Save

5.12 Test the integration. Add an assignment in Canvas > Submission Type > External link (Select VidGrid Student Record) > Add points (if graded) > Save and Publish > Select Folder to send Video Submissions. You should see a confirmation when the folder is selected > Take the assignment as a student, the option to record or upload will appear. The final video will show up in the folder selected as well as in the Speed Grader.

Did this answer your question?