Share your story with Odyssey

Before we start, check these two links out!!

Virginia Beaches

The Voyage of the Beagle

Pretty cool right?! I know.

Odyssey is an online tool that allows us to combine maps, narratives, and other visualizations into one, unique, beautiful story. These stories are interactive maps that go beyond the usual plain text, complicated story maps that require manual work, coding, and have costs. This tool allows journalists, humanists, and creators to create, recreate and tell stories in an engaging way.

Are you not a Coder? Don’t Worry! Odyssey has you covered! If you’re not familiar with coding, and still want to make an awesome project, then Odyssey is for you! If you’re a developer, can code and want to get creative, Odyssey is for you too! Odyssey is an easy tool that allows anyone to easily create interactive, map-based stories using human readable languages(markup). Non-coders can use the Sandbox to create amazing stuff. Coders and Developers can manipulate and make even more complex interactions using the JavaScript library(linked below). This tutorial will be a basic introduction to this online tool and how anyone can make a simple, narrative, map-based, interactive story using the Sandbox that does not require coding. Below, I’ve added links to resources to the JavaScript library and other helpful tutorial to help those who want to further make their project more complex.

Humanists, especially those in the digital humanities, are interested in studying and recording the world, and our history, Odyssey can be a really effective tool that can allow humanists to show their work. Instead of having to use three different tools to create narratives, maps and visualization, Humanists can now do all of those in one place. It makes their jobs easier and their presentations even more engaging.

Without further ado, lets jump into right into creating a DH project using Odyssey!!!

Step – by – Step video tutorial: 

Video Tutorial

Starting and naming your story

    1. the first thing you want to do is go to Odyssey.js and click on sandbox. Once you’ve done that, you can go ahead and select a template just as I did on the video.
    2. Now, change the top level data on the sandbox. You will first change the title and author of your presentation into whatever you want.
  1. Now, you’re ready to start working on your content and narrative
    1. Every story, chapter or slide begin with a title and headlines. The first step is to change the title of the first slide. You can do that by using this markup #First Slide (replace first slide with what you want your title to be.)
    2. Then you can start adding in your narrative content. Start writing your story. (my video tutorial is helpful with this)
    3. (Part two of Video) Once you’re done with your narrative content, you can now add an image, video or any other multimedia you want! To add these you will use this markup: ![Title of media] (URL link of media) Once you’ve done this, you can see all your content appear on the left hand side of your screen in the transparent box.
    4. You can repeat this process for as many chapters, slides as you want.
  2. Sharing your Odysse with the world
    1. Once you’ve downloaded your video, you can go ahead and share it on your website or any other media!

This is all a very simple tutorial on how you can get started with Odyssey. Here, I’ve left two links. The first one is if you want to utilize the java script library to create a more complex story and presentation. The second one is for an advanced use of Odyssey.

Odyssey is a fairly new development and is consistently changing. If you’ve a developer who wants to contribute to this site, visit this link and make your contribution.



  1. Odyssey JS looks like a great tool to use in the digital humanities. The two examples you gave in the beginning show what is possible with Odyssey JS. I enjoyed listening to your video tutorial of how to use it and found it useful. I’m not sure if this is possible, but it would have been cool to embed the video right in the blog post. There might not be an easy way to do this with wordpress, the only way might be via code. Thanks for sharing this tool!

  2. Selam,

    Odyssey.js looks like a great tool for interactive story telling and a nice open-source alternative to the ArcGIS StoryMaps. It seems to leverage CartoDB light for mapping and I love how collaborative and open it is, inviting users to contribute not just ideas but code via their Git repository.

    You screencast video was clear and easy to follow and provided a good sense of what is possible with the application. Like Joseph, I would have liked to see the video embedded in your post, but I know you struggled to get Jing to host it in the first place, so well done!

Leave a Reply

Your email address will not be published. Required fields are marked *