Intermediate Web Literacy II: Storytelling with Scripts

Learn to use buttons, forms, and inputs alongside JavaScript functions to tell stories on the web.
Learning Objectives
Learners will understand how different elements of a webpage can work together with JavaScript to show off their creativity and storytelling.
Writing the Web
Buttons and Alerts
Communication, Creativity, Compose, Code, Remix
Learn how HTML, CSS, and JavaScript connect to one another by using buttons and scripts to tell a simple story.
Storytelling with Three Buttons
Communication, Creativity, Code, Compose, Remix
Learn how to write multiple, short functions that each connect to a button on a webpage.
Simple Story Generator
Communication, Creativity, Code, Compose, Remix
Learn how to use arrays and the document method to generate random stories and add them to a webpage.
Storytelling with Pictures
Communication, Creativity, Code, Compose, Remix
Use HTML, CSS, and JavaScript to tell a simple story using three sequential pictures.
Storytelling with User Input
Communication, Creativity, Code, Compose, Remix
Learn how to use HTML, CSS, and JavaScript to turn user input into a brand new story on a webpage.
Storytelling with Color
Communication, Creativity, Code, Compose, Remix
Learn how HTML, CSS, and JavaScript connect to one another by using buttons and scripts to inspire storytelling in response to different colors.
Creating a Storytelling Resource
Communication, Creativity, Code, Compose, Remix
Learn how HTML, CSS, and JavaScript connect to one another by using buttons and scripts to create storytelling prompts.
Storytelling with Interactive Fiction
Communication, Creativity, Code, Compose, Remix
Learn how HTML, CSS, and JavaScript connect to one another by creating an interactive story that responds to user input.