Tell Then and Now Image Stories with JuxtaposeJS

» 19 September 2016 » In Ed Tech, History / DBQ's, How To » No Comments

Featured-Static-screen-shot--JuxtaposeI'm excited about JuxtaposeJS - a new free web-based "storytelling" tool from the Knight Lab at Northwestern University. As they describe it: "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 (growth 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.)."

I think it's a great tool for students and teachers who want to explore themes of continuity and change. While it could be used to compare and contrast in subjects across the curriculum, I've created a few examples using historical content.

I selected pairs of historical and contemporary images with elements that are consistent and aspects that change. But the challenge is to size and crop the images so that the consistencies align. To accomplish that, I used another free tool - Google Slides - to position and crop each pair of images and export as JPGs before importing into JuxtaposeJS. (Scroll to the bottom of this post for my workflow video that illustrates each step of the process.)

Created with two archival photographs
Tom Torlino - a student at Carlisle Indian School, 1882 and 1885.
More about Tom at my post on Medium.
Pro tip: get the eyes aligned

Timeline sliderCreated with archival photograph paired with a screenshot I took from Google Street View.
Portland Ore Engine No 2 - 510 NW 3rd Ave.
Pro tip: choose a historic image that is shot from an angle similar to Street View. Street View is made up of a series of still images. You may need to navigate slightly on the street to get a shot that matches. Street View has been shooting for years. Use the drop down timeline (highlighted here) in upper left of Street View that has the angle and lighting that works best for your Juxtapose

Archival photograph of paired with photograph I took in the same location.
Taylor Hotel entrance Circa 1920
Pro tip: bring along a print out of historic photo to line up you new shot. Maybe you'll get lucky (like I did) and find a SUV parked in the right spot. 

Here's a video that details my workflow for this project
You'll see how I used the transparency feature in Google Slides to create two well-aligned images that I imported into JuxtaposeJS via Dropbox. JuxtaposeJS supports both vertical and horizontal sliders. Pick the orientation that does a better job of concealing or revealing the continuity and change. Once the images are "published" at JuxtaposeJS they can be imported into your web via an iFrame embed as I have done in this post.

Image credits:
Tom Torlino 
Portland Ore Engine No 2 
Taylor Hotel Entrance. 347 SW 3rd Ave Portland Oregon Courtesy of Oregon Nikkei Legacy Center ONLC 533

Tags: , , , , , , ,

Free Multicultural Alaska History Series

» 11 July 2016 » In Ed Tech, History / DBQ's, Publishing, Students » No Comments


Our new student-designed Alaska history and culture iBook series is now available free at iTunes. Also available as free static pdf files.

Tags: , , , , , ,

Anti-Vietnam War Imagery: Visual Literacy

» 29 May 2016 » In History / DBQ's » No Comments

How can images/language usage help us understand the goals of a movement or group? This question is explored in the context of the Vietnam War.

Tags: , , , , , ,

Examining the Ongoing Evolution of American Government

» 29 May 2016 » In History / DBQ's » No Comments


Survey how US policy evolved from Reagan through Obama. This DBQ compares changing domestic policy and reaction to it.

Tags: , , , ,

Regulation Through the Years: Women’s Rights DBQ

» 29 May 2016 » In History / DBQ's » No Comments


Critically read the following documents keeping in mind the evolving mentality and arguments of people regarding abortion and birth control. When reading each document think about the similarities and differences between each generation.

Tags: , , , , , ,

Founding Fathers and Mothers: Comparing Declarations

» 24 May 2016 » In History / DBQ's » No Comments


The Declaration of Independence is the founding document of the United States of America. The Seneca Falls Convention was one of the founding events of the American Feminist movement. In this lesson, students will compare the Declaration of Independence and the Seneca Falls Convention’s “Declaration of Sentiments.”

Tags: , , , , , , ,

American Popular Music Responds to Pearl Harbor

» 10 May 2016 » In History / DBQ's » No Comments


Here’s a DBQ collection of songs that came out in the months following Pearl Harbor. Listen and compare their messages about war and the Japanese.

Tags: , , , , , , ,

Leo Frank: Anti-Semitism, Class Warfare, Media Hysteria

» 29 April 2016 » In History / DBQ's » No Comments


This student-designed DBQ uses multimedia primary sources to explore the 1915 trial and lynching of Leo Frank. A case study in media hysteria

Tags: , , , , , , , , , ,

Mitch McConnell Flunks US History

» 17 March 2016 » In Commentary, History / DBQ's » 2 Comments


The central argument being raised by Republican Senators who refuse to even consider President Obama’s nomination of Merrick B. Garland to the Supreme Court is “Let the people have a voice.” So I have to keep Mitch after class to review how the Founding Fathers designed the Supreme Court

Tags: , , , , , ,

Strange Fruit: Media Coverage of the Waco Horror

» 08 February 2016 » In Guest post, History / DBQ's » No Comments


Student designed interactive DBQ explores the media coverage of the 1916 lynching of Jesse Washington, a 17 year old African American man from Waco, Texas – one of the most heinous acts of government sanctioned mob “justice” in American society.

Tags: , , , , , , ,