Lesson Plan: ​WebVR Changing Expectations WeTeach_CS Collaborative Christina Taylor & Alissa Tadlock Overview Students will read and analyze George Orwell’s ​Animal Farm​ focusing on the text’s background and historical context, allegory, propaganda and persuasive techniques ​[Key knowledge, Understanding, & Success Skills]​. While performing this literature study ​[​Sustained Inquiry]​, students will engage in computational thinking and be exposed to basic coding for WebVR. Since this literature study will be introduced in class and students will work on aspects of it both in and outside of class, student engagement regarding the concepts and approaches of computational thinking will be piqued by in-class work; while individual determination is required for completion of the student’s WebVR scene. As the class progresses through the unit, students will perform progressively more extensive customizations to their WebVR scene. Each customization will build upon the students’ prior work and teach additional discrete coding skills without completing the scene. As a summative assessment for this literature study, students will be able to select a task to complete in order to demonstrate their understanding of the unit’s central concepts. The completed scene as prescribed by this lesson plan will be ​one​ of the students’ options​ [Voice & Choice]​. Module Title:​ Exploring WebVR through ​Animal Farm Module Learning Objectives: ● Make inferences about George Orwell’s purpose in writing ​Animal Farm ​considering its cultural, historical, and contemporary context. ● Apply knowledge of the background and historical context of ​Animal Farm​ to its analysis. ● Apply knowledge of propaganda and persuasive techniques to the analysis of ​Animal Farm​. ● Represent an analysis of Orwell’s ​Animal Farm​ using computational thinking via WebVR. ● Demonstrate an understanding of computational thinking by ​using WebVR to create a mock-up of a concept for a video game based on the analysis of ​Animal Farm​.

1

Equity, Empathy, and Inclusion of Students of Color Our approach to incorporating teaching methods that address equity, empathy, and inclusion is bi-fold. Since women and people of color are historically underrepresented in Computer Science courses, introducing computational thinking and basic coding concepts in an on-level, core, non-computer science class works to affect a shift in the prevailing cultural paradigm by eliminating CS as a gatekeeper. Furthermore, students of every gender, ethnicity, and socioeconomic status are intentionally included in this lesson. Due to the activities being done mainly in class with the teacher as a facilitator, students who don’t have access to a computer at home will not be left out. Also, those students who may not have the experience with the technology will not be left out because the teacher is facilitating the techniques to be used and will be able to help everyone be successful. No students of differing races will be left out either as this is a project that the whole class will work on together. Three techniques that will be helpful to use in this project are: ● Review today’s lesson to make sure that your gender pronouns are varied, and not in ways that conform to stereotype. ● When using arbitrary names in examples, choose a broader selection (Juan, Neha, Maria, Mohammed, instead of just Jane Doe and John Smith). To represent your school’s population, use a previous school-year’s roster for ideas. ● Watch out for examples or anecdotes about your childhood or daily life that may cause students to feel excluded for economic reasons (e.g., talking about pricey gadgets or vacations in Hawaii as normal). Even if you know that you did not experience these things and are simply using them as an example, students don’t know that and can mistakenly assume you are referring to them in a normative way. Source Citations: Ascd. "Chapter 2. Diverse Teaching Strategies for Diverse Learners." ​Diverse Teaching Strategies for Diverse Learners​. Web. 14 June 2017. "Creating an Inclusive Classroom Environment." ​Center for Teaching Excellence – University of Virginia​. Web. 14 June 2017. Excerpt from GIHE Good Practice Resource Booklet on Designing Culturally Inclusive Learning and Teaching Environments prepared by Professor Michelle Barker, Dr Elisha Frederiks and Brona Farrelly https://www.griffith.edu.au/__data/assets/pdf_file/0011/184853/Creating-a-Culturally-Incl usive-Classroom-Environment-mcb2.pdf "Incorporating Diversity." ​CTE - Incorporating Diversity​. Web. 14 June 2017. 2

"What Can I Do Today to Create a More Inclusive Community in CS? Guest Post from Cynthia Lee." ​Computing Education Blog​. 23 Sept. 2015. Web. 14 June 2017. Preparation ● Read and analyze George Orwell’s ​Animal Farm​. ● Design or review a literature study unit for ​Animal Farm​ that focuses on the text’s background and historical context, allegory, propaganda, and persuasive techniques ​[Key knowledge, Understanding, & Success Skills]​. ● Create a CodePen account. ● Complete tutorials 1-8 on the A-Frame WebVR YouTube Channel (​https://goo.gl/ul404z​) [​(Key knowledge, ​Understanding, & Success Skills]​. Time: ​Several class periods throughout the literature study 21st Century Skills: ☑ Collaboration ☑ Communication ☑ Problem-solving

Web Literacy Skills: ☑ Navigate ☑ Evaluate ☑ Code ☑ Compose ☑ Protect ☑ Open Practice ☑ Contribute ☑ Share

Academic Content Area Connections: ​English, History, Computer Science Learning Objectives (Activity): ● Insert base code into CodePen. ● Manipulate the code to update the color, height, width, and depth of the box. ● Choose an animal/group of animals to be represented by the three objects in the scene; explain why each was chosen and explain how the shape and its attributes represent some aspect of the character in the book. Choices should be based on an analysis that is informed by the principles of propaganda, techniques of persuasion, or the book’s historical context [​Reflection]​. ● Change the object’s color to represent some aspect of the character in the book; explain why this was chosen. Choices should be based on an analysis that is informed by the principles of propaganda, techniques of persuasion, or the book’s historical context ​[​Reflection]​. Audience: 3

● ●

Beginner programmers with little or no experience Critical readers

Materials: ● Computers ● Internet access ● Projector ● Copy of the video transcript

Scenario Ever since the recent election, your friends have been casually throwing around terms like ​fascist​, dictator, communist, ​and ​socialist​. Although you have a pretty good idea of how they feel, you’re not convinced that they have well thought out arguments, based on the technical definitions of these terms. Driven by a desire to engage your friends in a political conversation that’s based on reason rather than emotion, you decide to create a video game that will provide them with a memorable explanation of the fundamental concepts​ [Authenticity]​. Identify, analyze, and visualize the defining characteristics of the totalitarian dictatorship that arose out of the October Revolution as depicted in George Orwell's ​Animal Farm​ then complete the WebVR scene that you’ve been working on in class to create a mock-up for a video game based on those characteristics​ [​Challenging Problem]​. This WebVR scene should include the following: ● Customized Objects ● Transformations to an Object’s Position and Rotation ● Texture Added to an Object ● Animation Added to an Object ● Interactions with an Object ● Lighting ● A Skybox

4

Introduction Before beginning to read​ Animal Farm​, pose the following statements for the students to respond to. Have the students, silently, record their comments for each statement. After about ten minutes, have the students stop. Then, read aloud a few comments from each statement. When the class has completely finished reading ​Animal Farm​, go back and ask the students if any of their views changed and why. All responses must be supported by textual evidence. 1. 2. 3. 4. 5. 6. 7.

Individuals should stand up for what they believe in no matter what the cost. War is inevitable. Doing evil is easier than doing good. Most need authority to tell them what to do . It is easier to go along with the crowd than to stand up for one's beliefs and values. Every country has enough of its own problems and should not help other countries. Every country has a moral responsibility to help other countries.

Offline Activity As this PBL asks students to customize a WebVR scene that has been provided for them in order to represent various aspects of their analysis, there aren’t many changes that can be made to the lesson plan to further accommodate minimally-resourced, offline activity. These few changes include: ● Perform the introductory activity using paper, rather than presenting and/or recording it electronically. ● Use a grayscale scalable vector graphic (svg) clipart instead of a high-resolution image to add a texture to an object in the scene. Use ​https://search.creativecommons.org​ to search sites like Pixabay​ which have large libraries of openly licensed clipart. ● Rather than importing Xs into the skybox, students can sketch images for their WebVR scene on paper. Then, capture them and use the directions in the ​Sketchy VR​ activity to test their coding of a skybox. Students will need to: 1. Read and follow ​Steps ​1 & 2 in the ​Sketchy VR​ ​activity​. a. Template: ​https://goo.gl/2tRCB9 b. Examples:​ ​https://goo.gl/sCFgJP c. Genius Scan​ mobile app: ​https://www.thegrizzlylabs.com/genius-scan d. After scanning and uploading your drawing, use the ​A-frame Asset Uploader​ to produce a URL that you can use as an image source (​img src​) in your ​pen​. 2. To add the images you’ve drawn to your scene, add the following lines to your ​assets section (at the bottom, just prior to the ​scene​ close tag): ”/> 3. Reference #frontSkyTexture and #backSkyTexture in your tags by adding the following lines: 5



Online Activity At various points in their reading, students will use the designated tools to perform the following tasks. These tools not only scaffold the learning but are also student-centered, allowing individuals and small groups to work at their own pace from anywhere they have internet access. The following activities will be performed—or at least begun—in class as part of the literature study. 1. Activity 1: Customizing Objects ● Create a CodePen account ● Import the ​base code​ for the WebVR scene. ● Choose an animal/group of animals to be represented by the three objects in the scene; explain why each was chosen.* ● Change an object’s color to represent some aspect of the character in the book; explain why this was chosen. ○ A-frame WebVR Tutorial 2: Drawing a Box—Watch the video ​tutorial​. Then, perform the following tasks. a. Transcript b. Use a ​Hex Code​ to change the box’s ​color​. c. Then, change the box’s ​height​, ​width​, & ​depth​. 2. Activity 2: Changing an Object’s Position ● Change an object’s position to represent how this character interacts with others in the book; explain why this was chosen.* ○ A-frame WebVR Tutorial 3: Transformations—Watch the video ​tutorial​. Then, make changes to the following attributes of the box. a. Transcript b. Position c. Rotation 3. Activity 3: Changing an Object’s Texture ● Change an object’s texture to represent some aspect of your reading; explain what this represents and why this was chosen.* ● A-frame WebVR Tutorial 4: Textures—Watch the video ​tutorial​. Then, perform the following tasks. a. Transcript b. Add a texture to either the sphere, box, cylinder, or plane. c. Add an ​assets​ section to the BOTTOM of the code just prior to the ​scene​’s close tag. 6

4. Activity 4: Animate an Object ● Animate at least one of the object’s characterization. Explain.* ● A-frame WebVR Tutorial 5: Animations—Watch the video ​tutorial​. Then, perform the following tasks. a. Transcript b. Animate one of the objects Students may choose to complete the remaining activities as part of their summative assessment for this literature study ​[Voice & Choice]​. 5. Activity 5: Interacting with Objects ● Choose one of the objects to interact with. Explain.* ● A-frame WebVR Tutorial 6: Interacting with Objects—Watch the video ​tutorial​. Then, perform the following tasks. a. Transcript b. Begin​ on click using a​ camera​ (below ​entity) ​as the ​cursor 6. Activity 6: Add a Light Source ● Choose where to add a light source in the scene. Explain.* ● A-frame WebVR Tutorial 7: Lighting—Watch the video ​tutorial​. Then, perform the following tasks. a. Transcript b. Add both a ​spot​ and a ​point​ light in different colors; ​position requires adjusting 7. Activity 7: Add a Skybox ● Using this storyboard ​template​, draw a picture of Animal Farm based on Orwell’s description (or find a reasonable approximation online). ● Insert your drawing/image as the background in the VR scene. ● A-frame WebVR Tutorial 8: Skybox—Watch the video ​tutorial​. Then, perform the following tasks. a. Transcript b. Add a skybox to your scene: i. Find a free skybox image ii. Load your image to ​https://cdn.aframe.io/​ in order to get a URL that A-frame will recognize. iii. It’s important that your “a-sky” item be created within the bounds of your “a-scene.” iv. Finally, add a red tint to this scene. *All explanations should be compiled into a file titled “ReadMe”. Reflection In a file titled “ReadMe,” students will: 7

● compile their explanations from activities 1-4. ● write a reflection of both the process and the final product--detailing what worked, what didn’t work, and what they learned. ● offering suggestions about how the module can be improved. As a summative assessment​ [Critique & Revision]​ for this literature study, students will be able to select a task to complete in order to demonstrate their understanding of the unit’s central concepts. The completed scene as prescribed by this lesson plan will be ​one​ of the students’ options. Student understanding can be assessed by evaluating the individual’s ability to demonstrate his or her understanding via: 1. the finalized WebVR scene. 2. a presentation ​[Public Product]​ of the final product and justification for the choices made in its creation. This additional means of assessment not only encourages student metacognition but also provides the opportunity for the assessment of soft skills—awareness of content, audience, and appearance; effective speaking skills; and nonverbal cues. 3. a written reflection of both the process and the final product. This further assessment encourages student metacognition and provides the opportunity for the assessment of expository writing.

8