Tools for Digital Humanities Scholarly Innovation
TimelineJS, JuxtaposeJS, StoryMapJS, ESRI StoryMaps
Objective‣ To get a quick overview of four recently introduced tools
that can enable analysis and presentation of scholarly research using temporal and spatial tools;
‣ To engage in free and informal discussion about how these might be employed in your own research.
Agenda‣ What is Scholarly Innovation ‣ What is TimelineJS? How is it Being Used? ‣ What is JuxtaposeJS? How is it Being Used? ‣ What is StoryMapJS? How is it Being Used? ‣ What is Story Map? How is it Being Used? ‣ Strengths, Weaknesses & InterOperability ‣ Discussion
So What? Why are We Here?
An Intriguing Intersection
kind
red.stan
ford.ed
u
Knight Lab - Northwestern University‣ the Lab makes technology that aims to help make
information meaningful and promotes quality storytelling on the Internet.
‣ technologists, journalists, designers and educators ‣ news media innovation through exploration,
experimentation
Problem‣ Journalism is still struggling with its digitally-focused
future. Technologists are winning at media technology innovation, but they do not understand “journalism.” Worse, many journalists barely understand how the Internet works, let alone how to get the most out of storytelling on the web.
‣ Enter Knight Lab ‣ 8 faculty, 20 + students and 7 staff members
ESRI
ESRI‣ Esri inspires and enables people to positively impact the
future through a deeper, geographic understanding of the changing world around them.
‣ ARCGIS is arguably the deficit standard for Geographic Information Systems in the world today
‣ Proprietary but very Education friendly
Timeline JS
Timeline JS‣ TimelineJS is an open-source tool that enables anyone to
build visually,rich, interactive timelines. Beginners can create a timeline using nothing more than a Google spreadsheet.
‣ Experts can use their JSON skills to create custom installations, while keeping TimelineJS's core look and functionality.
‣ It can pull in media from a variety of sources and has built-in support for Twitter, Flickr, Google Maps, YouTube, Vimeo, Vine, Dailymotion, Wikipedia, SoundCloud and more.
TimelineJS‣ What’s it based on? ‣ What does it do? ‣ How can I use it? ‣ What do I need to use it?
TimeLineJS Case Study‣ Is it graphically pleasing? ‣ Do you know what it is about? ‣ Have you worked with anything like this?
Ingredients for Timeline JS‣ A Google Drive Account ‣ An Online Storage Space for Media ‣ Data ‣ Start and End Dates ‣ Headline ‣ Content ‣ Text ‣ Media
‣ A Conceptual Map
A Recipe for Use (1)
A Recipe for Use (2)
A Recipe for Use (3)
A Recipe for Use (4)
What’s Cool?‣ Knight Labs provides a Wizard and Templates; ‣ Can Embed in your own web page; ‣ Can Embed in a WordPress Blog (Plug-In); ‣ Can choose from a variety of Map Appearances; ‣ Can create a unique and persistent URL; ‣ You can modify appearance as you gain familiarity; ‣ Data is stored on your own service in your own space; ‣ It’s OpenSource.
Tips & tricks1.Keep it short, and write each event as a part of a larger
narrative.
2.Pick stories that have a strong chronological narrative. It does not work well for stories that need to jump around in the timeline (that’s what Storymap JS is for).
3.Include events that build up to major occurrences — not just the major events.
Alternatives
Juxapose JS
Juxtapose JS‣ JuxtaposeJS helps storytellers compare two pieces of
similar media, including photos, and gifs. It’s ideal for highlighting then/now stories that explain slow changes over time (grown of a city skyline, regrowth of a forest, etc.) or before/after stories that show the impact of single dramatic events (natural disasters, protests, wars, etc.).
‣ It is free, easy to use, and works on all devices. All you need to get started are links to the images you'd like to compare.
Juxtapose JS‣ What’s it based on? ‣ What does it do? ‣ How can I use it? ‣ Who is using it? ‣ What do I need to use it?
Fukashima Nuclear Plant Disaster
Ingredients‣ Satellite Imagery from Different Times ‣ An Online Storage Space for Media ‣ A Conceptual Map for what you want to convey
The Recipe (1)
The Recipe (2)
What’s Cool?‣ It’s OpenSource - You can get the code and go mad with it; ‣ Works well with mobile devices; ‣ Tells a compelling story without words.
Storymap JS
StoryMapJS‣ Javascript-based ‣ What does it do? ‣ How can I use it? ‣ Whos is using it? ‣ What else does this? ‣ What do I need to use it?
StoryMapJS Case Study
What is Gigapixel?
What do you need to use Storymap JS‣ A Google account; ‣ Shareable, rich media: ‣ Flickr, ‣ YouTube, ‣ Vimeo, ‣ Twitter ‣ Wikipedia, etc. ‣ A concept/story map
Recipe (1)
Recipe (2)
Recipe (3)
Recipe (4)1
2
3
4 5
Recipe (5)
Recipe (6)
Recipe (7)
And I missed Snapmap‣ Social Media enabled - Instagram
What’s Cool about Storymap JS‣ It’s OpenSource; ‣ Easy to use; ‣ Can Deploy on your own site; ‣ Easily deployed into a blog; ‣ Your own your own data.
Tips and Tricks‣ Some browsers work better than others for editing; ‣ It’s trying to do a lot in your browser - watch what you
have running alongside; ‣ It’s evolving - always test before showing - new features,
but also new implementations of things you might take for granted;
ESRI Story Maps
What is Story Map Tour‣ A user experience for place-based narratives ‣ The Story Map Tour app is ideal when you want to
present a linear, place-based narrative featuring images or videos. Each “story point” in the narrative is geo-located. Users have the option of clicking sequentially through the narrative, or they can browse by interacting with the map or using the thumbnail carousel.
ESRI Story Map‣ Where’s It from? ‣ What’s it based on? ‣ What does it do? ‣ How can I use it? ‣ Whos is using it? ‣ What else does this? ‣ What do I need to use it?
EnterTainMaps
Making ESRI Story Maps‣ Tutorial: http://storymaps.arcgis.com/en/app-list/map-
tour/tutorial/
ESRI Map Story Step (1)
ESRI Map Story Step (2)
ESRI Map Story Step (3)
ESRI Map Story Step (4)
ESRI Map Story Step (5)
ESRI Map Story Step (6)
ESRI Map Story Step (7/8)
What’s Cool about Story Maps Tour‣ Very robust; ‣ Well supported; ‣ Industrial Strength ‣ Versatile
Summarising‣ Neatline ‣ Verité TimeLine ‣ Exhibit
‣ Flexibility ‣ Level of Development ‣ Cost ‣ Data Sharing
‣ Timeline JS ‣ Juxtapose JS ‣ Storymap JS ‣ ESRI Story Map Tour
Upcoming Seminars‣ 6 Feb - Considering and Comparing: Palladio versus
Exhibit - Giving Digital Research Data Temporal, Spatial and Relational Dimensions
‣ 16 Feb - How to Put Your Data on the Map: Geospatial Data Manipulation and Visualisation for Digital Humanities
‣ 23 March - Using Google Tools for Digital Humanities Scholarship
‣ 20 April - Requirements Engineering for Humanities/Social Science Scholars