Creating a Then and Now Exhibit

“Then and Now” exhibits are a popular way to engage site visitors with interactive tools and to encourage them to think about the ways in which physical spaces have changed over time. An example of one is available at the PBS website linked here. Below I outline the directions for creating a Then and Now exhibit for my History of Boston course at the Wentworth Institute of Technology.

Students should first identify historic images that are in the public domain. Good sources include the Library of Congress (in particular the HABS survey), as well as local municipal collections. For our project, we will be working with images digitized by the Boston Municipal Archives as part of their Digital Access Initiative.

Each student will choose two images from the collection, checking as they do so that the selected image is either in the public domain or has the Creative Commons license allowing sharing with attribution.

Students will then download the photographs to their own device. The “medium 800” size image is suitable for our project, allowing a good compromise between clarity and file size.

They will then login to the Boston: Then and Now site and enter each photograph as a separate item. They should complete the relevant descriptive fields to include the information provided by the Municipal Archive. They should also add a URL to the image, for ease of location later.

After the instructor tags the images for public display, they can then be viewed by any site visitor.

The next task is the challenging one–students should determine where the photograph was taken, and should recreate the image to the best of their ability. They should optimize the photograph for the web so that it has the same dimensions and approximately the same file size (less than 200KB) as the historic image. You may need to crop one or both images to bring them into alignment for the slider to function optimally.

Students should then copy the URL of their stored, large image from Omeka, and visit the JuxtaposeJS site to create a slider. They should enter the historic image on the left and their own photograph on the right. Students should carefully record the iframe that is provided by the Juxtapose site–emailing it to oneself, or saving it somewhere within a document is a good way to keep it safe for future use.

Students will then login to the Omeka site Boston: Then and Now and will add their iframe and brief descriptive text to the relevant neighborhood page. When doing so, they should edit the iframe code so that instead of saying “width=”100%”” it reads “width=”50%”” (just change 100 to 50). This will narrow the slider so that it displays neatly on the site.

Questions? Ask Professor Howard at howarde@wit.edu. And good luck!

css.php