A Multi-thread Immersive and Interactive Storytelling Approach to Learning Conditional Statements:
Programmable Little Red
This project explores immersive and interactive storytelling as a technique to teach conditional statement logic to beginner cs students, using Scratch coding.
experience design ✔animation ✔3d modeling ✔educational ✔
About This Work
Traditional methods of learning conditional statements follow lecture-based instruction, which focuses on teaching concepts and definitions. It is one of the least effective and unengaging methods of teaching so we designed a learning system which was piloted at Shanghai Thomas International School in China.
-
After Effects, Maya, Photoshop, Scratch
-
Yumih Chang- Animation, Scratch Coding, Workshop Planning
Quinn He ‘22- Scratch Coding, Workshop Instructor, Workshop Planning
Lucy Du ‘21- Storyline, Workshop Planning
Demi Li- Workshop Planning, Workshop Instructor, Scratch Coding
Daisy Chen- Workshop Planning, Workshop Instructor
🐺
Story Experience
On the first day of the workshop, students experience the story of by playing through the Scratch story. The classroom is staged and the story ending is incomplete for the students to finish.
🔧
Tinker Instruction
Students recreate interactive components of the story experience to complete their narrative. Interactive features include webcam, voice, and sensor interactions which reflect real-world applications.
🎓
Showcase + Interview
On the final day, students presented their completed story experience to their teachers and classmates. Students felt motivated and anticipation to share and view eachothers’ story endings.
📖
Multi-threaded Storytelling
Students relate the storyline to CT logic. An condition is made and a consequence follows. The story selected was Little Red Riding Hood.
🌳
Immersive Environment
The immersive environment ehances the learning experience and contributes to the element of entertainment, making the learning more engaging.
📹
Interaction Design
The interactive component provides real-world applications of coding to help students understand the cause and effect framework of CT.
Immersive Environment
Scene dressing and creating an immersive environment ‘breaks the wall’ between Little Red and the students, bridging the story world with the classroom.
-
Each scene of the story animation was consecutively projected onto the classroom walls so that the students could experience the story while progressing around the room.
-
The story consists of 3 scenes: Little Red’s House, The Woods, and Grandma’s house. Scene dressing included installing fake grass near The Wood’s scene, disguising the tall projectors with ivy to mimic trees, and gathering physical props for the Interactive scenes, such as fruits, flowers, and spices.
Interaction Design
Students applied their knowledge of conditional statements to by coding sensor based components.
-
Webcams were used as motion detectors to collect input on which scene object was selected. Choices made determined the story direction.
-
Students coded components to detect audio levels which determined whether a question asked by a character was answered or not.
-
Students used incorporated micro:bits to their scratch coding to select scene objects. When the physical object’s microbit sensor was activated, the information was recieved by the program.