How to Make a Story Map

Story Map JS is a free tool to help you tell stories on the web that highlight the locations of a series of events. It allows users to incorporate images, sound, video, and text with geographically based storytelling.  

You can see Story Map JS at work in these samples:  

Story Map in the Classroom: 

Why you might use Story Map to Teach: 

  • Story Map can communicate location-based concepts or narratives integrating text, images, video, and sound sources.  

Why Students Might Benefit from Making a Story Map in class/as an assignment: 

  • Students can practice constructing coherent narratives with diverse source bases. 
  • Story Map provides students with a visually appealing way to present information. 
  • Creating a public-facing project compels students to invest in a project that may reach a broader audience and creates conversations about curating research for various public(s). 

How to Make a Story Map: 

You’ll need: 

  • A google account  
  • A rough outline of your timeline with dates, brief text, and sources (images, maps, video, etc.) Knight Lab recommend users limit their timelines to approximately 20 slides to not overwhelm viewers. 

Let’s Begin: 

  • Start at the Story Map JS page on the Knight Lab site.  
  • Click on “Make a Story Map” and sign in with your google account when prompted.  
  •  Adjust map to style of choice in “Options” on top left toolbar. Under the “Map Type,” dropdown heading you can select from different options.  
  • The first slide invites will serve as the cover of your Story Map to which you can add a headline and text. You can also upload an image or add one via URL. Be sure to credit your image and add a caption in the relevant boxes.  
  • When you’re happy with your choice, click the “add slide” button on the left toolbar.  
  • The next slide will have a search box on the map in the header. There you can type the location for your first slide. Your address may appear in the dropdown list of locations as you type. Once you select your location, a pin will appear on the map. If the pin lands on the wrong location, you can click and drag it to the desired location.  
  •  Click “add slide” and repeat 
  • You can select “Preview” to view your map in draft form as you continue to work.  
  • Click “Save” in the top left corner when complete.  
  • To share, click “share” in the top right corner where you will find both a link and embed code to share out.  

Story Map In-Class Practice Assignments: 

  • Sample Story Map Ideas for Preliminary Workshop Instruction:   
  1. How I got to Trinity 
    • In this practice assignment, students can map their journey to Trinity. They may interpret this as the history of their education, or of their actual travel to Trinity in the fall of their first year.  
  1. Places I’ve travelled 
    • This allows students to play with shaping a narrative across space integrating various forms of media. Students may talk about places they’ve travelled or interpret it to tell stories of places they’ve “visited” in books, etc.  
  1. Student choice 
  • Sample Maps Made as Group Projects (Each Student Responsible for One Site on Map) 

Further Resources: