CCSC
  • Home
    • About Us >
      • Contact Us
    • In the news
  • Research
    • Presentations
    • Podcast
    • Resources
  • CS Institute
    • 2022 CSI >
      • module1
      • module2
      • module3
      • module4
    • FAQs
    • 2021 CSI >
      • week1
      • week2
      • week3
      • 2021 CSI Resources
    • 2020 CSI Highlights
    • 2019 CSI Highlights
    • 2017 CSI Highlights
  • Design Lab
    • Updates
    • Playdates
    • Lesson Repositories
    • Reserve hardware
    • Request material
    • Reserve design lab

Choose Your Own Adventure

Project Goals:
  • Rated G
  • Create storyboard with at least 3 levels
  • Code text into Twine
  • Once you've got a working story in twine, then you can add images & adjust color/fonts
  • Looking for a challenge? Add audio!
 
Student Demo File:
girlsaveprince__5_.html
File Size: 318 kb
File Type: html
Download File

Picture
Example Code:
Quick, you need to save the Prince.


<img width="200" src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/01/Le_petit_prince.png/438px-Le_petit_prince.png">
credit: wikimedia


[[Take the horse]]

[[Take the spaceship]]


Stylesheet Code:

@import url(http://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic);
 
body, tw-story
{
  font-family: Lora, serif;
  font-size: 18px;
    background-color: lightblue;
}


Add Sound (advanced):​
  • Search for a sound on freesound.
  • Right-click on page and select View Page Source
  • Search for .mp3
  • Highlight & copy the URL it found
  • Add following code to the page you want sound on and replace with sound URL you just copied

​<audio src="the URL of your sound effect" autoplay> ​

Share Project:
  • Open your story in twine
  • Select My Story
  • Select Publish to File​​
  • Upload file to padlet

Resources:
  • Twine
  • Twine Guide
  • ColorPicker
  • Freesound
Picture
Picture
Picture
Picture
Picture
Picture

Creative Commons License
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
  • Home
    • About Us >
      • Contact Us
    • In the news
  • Research
    • Presentations
    • Podcast
    • Resources
  • CS Institute
    • 2022 CSI >
      • module1
      • module2
      • module3
      • module4
    • FAQs
    • 2021 CSI >
      • week1
      • week2
      • week3
      • 2021 CSI Resources
    • 2020 CSI Highlights
    • 2019 CSI Highlights
    • 2017 CSI Highlights
  • Design Lab
    • Updates
    • Playdates
    • Lesson Repositories
    • Reserve hardware
    • Request material
    • Reserve design lab