4A: Spatial Humanities: GIS/Mapping 101

For the next week we will be exploring the spatial humanities — a vibrant and increasingly popular area of digital humanities research.   Humanities scholarship is currently undergoing a “spatial turn” akin to the quantitative, linguistic and cultural “turns” of previous decades, and many are arguing that the widespread adoption of Geographic Information Systems (GIS) technology and user-friendly neogeography tools are fundamentally reshaping the practice of history and other disciplines.  Yet while these powerful computer tools are certainly new, the mode of thinking “spatially” is not unprecedented, and may in fact be seen as a move away from the universalizing tendencies of modern western scholarship towards more traditional understandings of the lived experience of place, emphasizing the importance of the local context.

In practice, much of this scholarship involves creating maps — an act that is not without controversy.  Maps are conventional representations of space that come laden with the embedded cultural worldviews of their makers.  Maps are also highly simplified documents that often paper over contested or fuzzy boundaries with firm lines; it is hard to express ambiguity with maps, but it is very easy to lie with them.  The familiarity of widespread tools like Google Maps and Google Earth might fool us into thinking these are unproblematic representations of space, but it must be remembered that all maps contain embedded assumptions and cannot be taken at face value. Maps produced in the course of humanities scholarship are not just illustrations but arguments, and they must be read with the same level of critical analysis that you would apply to articles or monographs.

(For more concrete suggestions along these lines, see Humanizing Maps: An Interview with Johanna Drucker.)


Example 1

One area of historical research that saw an early adoption of GIS is economic land use.  A good example is Michael McCormick’s book on the Origins of the European Economywhich layered many different types of evidence against each other in a GIS to argue for a much earlier origin to Europe’s medieval economy than had been accepted previously.  McCormick has since made his database publicly available and continues to add to it with collaborators at Harvard, as the Digital Atlas of Roman and Medieval Civilization.

Screen Shot 2015-02-17 at 4.35.27 AM

The DARMC provides a rich resource and a good introduction to the potential of GIS to reveal patterns and connections through the spatial layering of disparate datasets.  It also offers a good orientation to the basic layout of most GIS systems, with a map view window on the right and a list of layers on the left that can be turned on and off.

  • Explore the DARMC.
    • What layers have been included?
    • What patterns show up when you juxtapose cultural, environmental and economic data in this way?
    • What connections do you see?
  • Also take the opportunity to explore the measurement tools at the top of the window to interrogate the spatial  attributes of the data.

Example 2

The quantitative data compiled in projects like the DARMC can help address many historical problems, but they don’t necessarily answer more qualitative research questions concerned with the lived experience of the past.  For this objective, we must move beyond birds-eye-view 2D maps of spatial distributions and attempt to visualize particular places at particular moments in time.  Such “geovisualization,”  the digital reconstruction of past landscapes, is another booming area of scholarship that allows us to virtually experience a place as it might have been, and also has the potential to answer important scholarly questions.

Screen Shot 2015-02-17 at 5.05.37 AMAnne Kelly Knowles’ digital reconstruction of the Battle of Gettysburg is an excellent example of this potential that uses a combination of digitized information from historical maps, documentary accounts and environmental data on the physical geography of the battlefield to answer the question of what the generals could see during the battle and how those sightlines influenced their decision making.

  • Read the brief introductory article at Smithsonian magazine and then explore the “story map” in detail.
    • How does the map combine geographic and temporal information?
    • Does it effectively give you a sense of the experience of being on the battlefield?
    • What does this reconstruction offer that more traditional publications could not?
    • What could be improved in the representation?

 


Group Exercise: The Varieties of Maps

(Exercise borrowed from Lincoln Mullen)

The next step is to become familiar with as wide a variety of maps as possible, including digital maps and analog, maps that have been made by scholars and maps that have not. Below is a list of online mapping projects.

In a group, pick three projects from the list to explore and compare. Your aim is to gain familiarity with projects involving maps and mapmaking, both by scholars and on the web generally.

As you look through these projects, consider the following questions or prompts.

  • Create a taxonomy of maps. What categories do these maps fit into? You might consider the purposes of the maps, their audience, their interfaces, among other axes of comparison.
  • What is the grammar of mapping? In other words, what are the typical symbols that mapmakers use, and how are they can they be put in relation to one another?
  • Which maps stood out to you as especially good or clear? Why?
  • Which maps were the worst? What made them bad?
  • How do scholarly maps differ from non-scholarly maps?
  • What kind of data is amenable to mapping? What kinds of topics
  • What accompanies maps? Who controls their interpretation? What is their role in making an argument?
  • How do recent web maps compare to maps made online in the past few years? How can maps be made sustainable?
  • Which of these maps are in your discipline? Which maps might be helpful models for your discipline?

 


Exercise (Georeferencing)

In order to reconstruct past landscapes like the Gettysburg battlefield, the first step is often digitizing the data recorded in a historic map by georeferencing (or georectifying) that image — that is, aligning the historical map or image with its location on the earth in a known coordinate system.  There are many ways to do this, but we will start with a cloud based solution requiring no complex software.

The David Rumsey Map Collection is a vast archive of scanned historic maps, mostly covering North and South America.  They have enabled a  crowd sourcing technique to get the public to help georeference these images for use in GIS applications, but the David Rumsey Georeferencer is very buggy and not very accurate.

Instead we will use the MapWarper online tool to rectify an historic map from an online collection of scanned images.

MapWarper.net screen shot

  • Go to Boston Public Library’s Norman B. Leventhal Map Center
    • Search for and download a historic map that covers an area of interest
  • Then follow these instructions from Lincoln Mullen to Georectify a map with MapWarper
    • Use their tool to set control points (at least 5 are recommended), clip the map area, and rectify the map
    • When you are finished, you will see the map overlaid on a basemap of the world.
  • You can download your newly rectified map as a KML file by going to the Export tab

Exercise (Digitizing)

Now that you have coordinates for your image, you can bring it into a GIS program, align it with other spatially-aware data, and digitize the information by creating vector geometry from it.  We’re going to do that in Google Earth as a first pass, since it is free, widely available and often people’s first introduction to using a GIS.

  • Open Google Earth and the newly rectified map by choosing File > Open from the menu and navigating to your downloaded kml file.
  • Double-clicking the file should launch Google Earth and show you the map aligned over the modern satellite imagery.

Screen Shot 2015-02-17 at 5.47.18 AM

  • Now use the Add PlacemarkAdd Polygon, and Add Path tools in the top menu to digitize features from your georeferenced map.
  • For instance you could pinpoint the old courthouse (a placemark, or point), trace the old shoreline (a path, or line feature), or trace the outline of a neighborhood (a polygon).
    • As you create features you can add metadata, change the symbols, and change the location of the camera to save alongside the feature in the Get Info window.
  • Finally you can right click your newly created features and save them as KML or KMZ files (a zipped version of KML) for use in other programs.

 


Resources

Lincoln Mullen of the Center for New Media and History at George Mason University has developed a fantastic resource for getting started with mapping for the humanities.

The Spatial Humanties Workshop site he developed will give you a detailed introduction to the different types of maps you might want to make as a digital humanist, the software and libraries that are out there to use, and most importantly the academic issues and theoretical questions that are raised by mapping humanities data in a digital space.

 

3A: Big Data and Digital Humanities

Zooniverse: People powered research

In-Class Project

Last week we tore furiously through the front-end of web development — HTML, CSS and JavaScript.  But we are not learning coding here, we are doing Digital Humanities. Today let’s look at how we can put those skills into practice for humanities data to tell a story.

One of the longest-running types of applications is an interactive timeline.  We will do a class project to convert a flat timeline into an interactive one using an easy to use application, but there are other tools that require more coding and show you how these work.  Take a look at the SIMILE timeline tool for an example of one of those.

Today, we are going to use the beautiful TimelineJS framework to give the college archive’s Timeline of Carleton History a web 2.0 overhaul.  This timeline was created in 1991 for the college’s 125th anniversary celebration, and while the content is still great, the presentation could use an update as we near the 150th anniversary in 2016.  Archivist Tom Lamb has given us permission to use the timeline as our dataset, and we are going to build a new, dynamic JSified instance of it as our first group project.

The timeline is broken into five date ranges between 1866 and 2002.  I have set up the first one as an example, and it is each group’s task to replicate this work for your own date range by doing the following:

  1. Go to the TimelineJS page and follow the 4 step instructions to Make a New Timeline
    • In Step 2, whoever downloads the Google template should share it with the other group members so that all may editScreen Shot 2015-01-15 at 12.17.03 PM
    • In Step 4, copy the embed code and paste it into a new jsBin.  This is where you will work on your own date ranges for now, and we will combine them all together next week.
  2. Once you are setup, delete the template data and move over your group’s data from the Timeline of Carleton History. The dates and captions should come over with an easy copy/paste, but then you’ll probably need to finesse the rest of the data a bit.
    • You might need to change the number format of the Date columns to a different date display or even Number > Plain Text to get them to display and order properly
    • All entries should have a brief headline that summarizes the text on that date’s card, which you’ll need to write
    • Where there are images on your page, click them to bring up the full resolution version in the fancybox viewer, then use your DevTools knowledge to find the image URL to paste in the appropriate Media column in the sheet
    • Where there are no images, see if you can insert a Google Map if appropriate.  Or search the Carleton Archives Digital Collections to find other appropriate photos or scanned documents
      • NB: All Media should have a Media Credit, which will usually be “Archives, Carleton College Gould Library
    • Finally, explore what happens to the timeline when you use tags to categorize events.  I used buildings and people as two basic categories on my example

If you’re in doubt or stuck, post a comment, ask a question on your blog or (as a last resort) send an email and we’ll try to help each other out.


Big Data

Big Data generally refers to extremely large datasets that require demanding computational analysis to reveal patterns and trends, such as the map below generated from the data in millions of Twitter posts. We are producing reams of this data in the 21st century, but how do we analyze it from a humanities perspective?  How do we perform these sorts of analyses if we are interested in periods before regular digital record keeping?

World travel and communications recorded on Twitter
World travel and communications recorded on Twitter

Enter digitization and citizen science initiatives.  One of the major trends in Digital Humanities work is the digitization of old records or print books that are then made searchable and available online for analysis.  Google Books is the most well-known project of this type, and we also read Tim Hitchcock’s article about his pioneering historical projects in this arena, e.g. the Old Bailey Online and London Lives.  These projects took years to build and required the dedicated paid labor of a team of scholars and professionals.  But there’s another model out there that relies on the unpaid labor of thousands of non-expert volunteers who collectively are able to do this work faster and more accurately than our current computers: crowdsourcing.

Zooniverse is a crowdsourcing initiative that bills itself as “the world’s largest and most popular platform for people-powered research.”  This platform takes advantage of the fact that people can distinguish detailed differences between images that regularly trip up computers, and empowers non-experts to contribute to serious research by reducing complex problems to relatively straightforward decisions:

  • is this galaxy a spiral or an ellipse?
  • is this a lion or a zebra?
  • is this the Greek letter tau or epsilon?

The project that Evan and his team just launched, Measuring the Anzacs, seeks to study demographic and health trends in the early 20th century by transcribing 4.5 million pages worth of service records from the Australian and New Zealand Army Corps during WWI.  This data would take countless years to process with a small team of researchers, but as Evan told us, they hope to speed up this process tremendously by taking advantage of the fact that there are lots of people who have access to a computer, speak English and can read handwriting.

Tim Hitchcock ended his piece with a conundrum:

How to turn big data in to good history?  How do we preserve the democratic and accessible character of the web, while using the tools of a technocratic science model in which popular engagement is generally an afterthought rather than the point.

The Zooniverse model has taken a major step towards resolving this tension and turning formerly restricted research practices into consciously public digital humanities work.

 


Assignment

Explore the Measuring the Anzacs project and work your way through at least one document, marking and transcribing the text.

Screen Shot 2015-09-30 at 6.24.24 AM

When you’re done, post a brief comment below giving some feedback on the process.  Were the instructions easy to follow?  Was the text easy to transcribe?  Did you feel like you were making a real contribution to the project?  What did you get out of the project, from a humanities perspective?  Did you come away with a greater understanding of either the research process or the lived experience of the individual people whose records you were working with?

2B: JavaScript 101

JavaScript logo

JavaScript is the lingua franca of the modern responsive web, and almost all the pages you interact with online use it in some form or other.  As with the other things we’re learning in this class, our aim is not to memorize every aspect of the language and become experts overnight, but to gain enough understanding of what it is and how it works so that we can ask the right questions when conceiving our own projects and can intelligently leverage the hard work of people who know these things much better than we do.  Thank heavens for JavaScript libraries!


In Class: Hacking with jsBin

To get the hang of how these three languages fit together we are going to explore some examples I set up in jsBin.  This code sharing site is a fantastic tool in the hacker’s toolbox, since it lets you copy and edit code in the cloud without having to invest in your own setup or FTP files to a server, view the output live, and then share all of it with others really easily.  We’ll be making a lot of use of jsBin in this class, so get used to the interface.

The first example is basic, and will let you test out what each of our three major client side languages does, and hack away to make modifications.

Go to http://jsbin.com/busimo/edit?output, follow the instructions, and start hacking.

The next example illustrates the power of the useful and ubiquitous jQuery library, which lets us do fancy things like extract data from structured markup, with a lot less code than straight JavaScript.  For this example, we’re trying to take the Carleton timeline information from this website and put it into a JS object (for a full description of this method see Dave Ward’s post).

Go to http://jsbin.com/zohawafinu/edit?html,js,output read the comments and try to figure out what’s going on.

 


Assignment

The assignment for this week is twofold:

First, make sure you have registered your domain and installed WordPress, and then spend some time setting up your personal website on your newly installed server. These are the most basic steps you should take to get your site looking like personalized rather than a generic WordPress blog.

  • Create an “About” page (not Post) to let the world know who you are
    • Write a brief bio paragraph about your background, what you are studying, your goals, etc. and post it to the site.  See mine at meDHieval.com for an example.
  • Get an API key for the Akismet plugin and activate it to block comment spam.
  • Choose a new theme to install and activate it
  • Add the Simple Custom CSS plugin and use your DevTools skills to change at least one element of your site’s design via CSS code

Secondly, continue your self-directed journey of discovery by taking at least one JavaScript course at Codecademy, so that you can include that experience in your blog post detailed below.

Blog Post

Your course blog post assignment for this week is to reflect on your experience with coding so far, and engage in the debate within the DH community over whether or not humanities students should learn to code.  Your post should include the following:

  • A clear statement in the first paragraph stating your position either for or against.
  • A discussion of your coding experience, including a link to your profile page on Codecademy
    • This link is in the format www.codecademy.com/<username> and can be accessed by clicking your avatar icon in the top right corner of the page
    • The profile should show at least one lesson each in HTML, CSS, and JavaScript
  • At least one quotation from each assigned reading: Kirschenbaum for, or Donahue against.
  • At least one example from your own experience coding, either this week or earlier, that supports your position.

References and links to other articles/blog posts on the issue or not required, but will be looked upon kindly.

 


Resources

JavaScript

Julie Meloni has written several how-to guides for programming, and has very helpfully posted two gentle introductory lectures pitched at Digital Humanists on Slide Share.  We covered some of this material in class, but here are the full lectures to peruse at your leisure.

 

2A: HTML/CSS 101

HTML and CSS are the bedrock foundations on which the world wide web (and therefore most digital humanities projects) are based.  HTML provides the basic structural markup that tells your browser what to do with the information on your page.  In the early days, HTML offered rudimentary styling and layout support as well, but CSS (Cascading Style Sheets) offers a much superior method of making all the different elements of your pages look exactly how you want them to look, and go exactly where you want them to go.  The biggest benefit of style sheets is that one sheet can influence the appearance of an infinite number of pages, allowing you to update code in only one place to change anything from the color of text to the positioning of an element.


Assignment 1

Your task for next time is to write your first true blog post.

Having watched Miriam Posner’s video and read Johanna Drucker’s article on the components of a DH project, explore one of the sites below and write a post trying to reverse engineer one of these DH projects.

Make sure your post does the following:

  • Introduces and links to the project you explored.
  • Contains an image of the project that links directly to it.
  • Breaks down the black box of your digital project by indentifying its
    • Sources (assets)
    • Processes (services)
    • Presentations (display)

You may need to poke around the About or FAQ sections of the page to figure out this information, but see how far you can get.

As you write, remember that blog writing is a different beast that lies somewhere between formal academic writing and casual social media or email style.  Try for a tone that is scholarly and informed but neither too stiff nor too sloppy.  It can be a tough balance to strike, but think of your intended audience and try to find a voice that works for you.


Assignment 2

There are many excellent resources for learning the fundamentals of HTML and CSS on the web.  If you want to build pages from scratch from the ground up, pick your favorite code school or tutorial series from the resources section below and go crazy.  In this course, however, we are primarily hacking and modifying other people’s code for our own purposes, rather than building from scratch, so we will keep it simple.

  1. Your assignment is to create an account at Codecademy, if you don’t already have one,
  2. Take at least two courses (one on HTML and one on CSS).
    • Many of you already have some HTML experience, and a few already have CSS experience, so if you’re an experienced user, chose a lesson further down the list and challenge yourself.  If you’re new to web development start near the top with the basics.
  3. After you’ve successfully completed your short courses, Codecademy will give you badges. Save the URL of your profile page, since we’ll link to it once we get up and running next time.

Make sure you remember to comment on at least two fellow classmates posts before next class.

And bring your credit card! We’ll be setting up our own servers next time.


Resources

Here are some places to go for more information If you need a refresher on the tools we used in class

  • An Introduction to DevTools for Chrome, and a more detailed discussion (with nifty GIF examples!) of using them to edit CSS styles
    • If you regularly use a different browser you can also checkout the comparable tools for Firefox and Apple’s Safari, but I would recommend reducing confusion by sticking with Chrome’s until you get the hang of it before figuring out how others differ.
  • A quick rundown on the basics of the fantastically useful Digital Color Meter for Mac OS X, which lets you grab precise colors from images to use in your CSS.

Codecademy is a great place to start, but there are tons of other places to learn coding on the web for free.  Here are a few further HTML/CSS resources:

  • w3schools.com is one of the most comprehensive sites around, with many excellent lessons and a handy “TryIt” tool that lets you see your code in action.
  • HTML Dog offers a solid series of tutorials with beginning, intermediate, and advanced tracks on the three major client-side languages you need to know: HTML, CSS and JavaScript.  They also have several minimal example pages for specific effects you might want to achieve.
  • A straightforward HTML assignment of constructing your first page from the ground up from the folks at UCLA’s Digital Humanities 101 course.
  • A handy list of the most common HTML elements to familiarize yourself with at ReWritables.net.
  • Since Carleton has an institutional subscription, you can also check out the HTML and CSS video tutorials on Lynda.com if you’re hungry for more.

If you find another that’s helpful, pass it along on your blog.

Happy coding!

1B: WordPress 101

Debates over the definition of the Digital Humanities are by this point very clichéd, to the point that many people have begun arguing that we stop worrying about it altogether.  There is a building consensus that DH, however you define it, is above all a community, or if you like a social network; specifically, a community of practice that is open, public, collaborative, and above all welcoming.  The main thing you have to do to get involved, is to just get involved.  Express your interest by joining the community.  One of the main ways people do that is by posting, blogging and tweeting their ideas, projects, and questions publicly on various platforms.

To that end, you will all be reading, writing, and sharing what we do this term on this blog and your own, which we’ll set up next week.  This is not just about trying out the digital humanities.  It is also about practicing skills that will serve you well beyond your college career no matter what you choose to do.  Having control over your internet presence is crucial in this day and age, and building your own website is one of the best ways to craft and maintain a public, online identity.

 


In Class

For starters, you’ll register for this class site so you can comment on assignments, post to the blog and get familiar with the WordPress interface, if you aren’t already.

Follow these instructions to register for our course site and post your first comment.

Once you’ve done all that…

  1. Log in to the Hacking the Humanities class blog and make a new post sharing the 2D image of your house that you exported from SketchUp and telling us about your process. How easy/hard was it?, what elements particularly bogged you down?, what compromises did you have to make?
    • Make sure to also share a tip for other novice SketchUp users about the tool that you found most useful, or a technique that you wish you had figured out sooner.  Part of the digital maker philosophy is sharing the knowledge you gained, so make sure to pass it on.

Congratulations!  You have posted your first blog post and can now share your interests and knowledge with the world.

We barely scratched the surface of what you can do with this platform in class, but we will get deeper into the weeds next week as you set up your own WordPress instance with complete administrative control.


Resources

Carleton College’s own web services group has a lot of good resources for how to write for the web effectively.

1A: SketchUp 101

Since we will be telling stories that take place in versions of Carleton College that no longer exist, one of our primary collaborative efforts will be attempting to recreate elements of the college as it once was using 3D visualization and simulation techniques.  We will be discussing the theoretical implications of such a project throughout the term, but since the skills required to model in 3D are complex, we will begin practicing in week one.

SketchupLogoThe 3D software with the gentlest learning curve is SketchUp.  Formerly owned by Google, it puts an emphasis on ease of use and compatibility with other popular platforms like Google Earth.  This is the software that many of the 3D buildings you might have seen in Google Earth were created with. Despite the user-friendly goals, SketchUp is a powerful program used by industry professionals and will let you start making impressively detailed models very quickly, which can be exported in a variety of formats.

We will eventually be modeling buildings as accurately as possible, but it is useful to start with more free-form projects to get a feel for the various drawing, transformation and navigation tools SketchUp has to offer, so that’s what we will focus on here.


 Assignment

In class, we modeled a simple dog house to get a feel for the software.  (If you’d like to review that project at your own pace, you can watch a tutorial video of it here.)

Your assignment is to use the techniques we employed to make a model of the house you grew up in.  Don’t worry about photo-realistic accuracy, just try to get the basic features, colors and textures in place, so that someone who knows the house (your parents, say) could recognize it.  If you grew up in a ranch house, then your building should be long and contain only one row of windows, whereas if you grew up in a bungalow or a cape cod you’ll have a taller building with a half or full second row. You get the idea. And don’t worry about the inside!  We’re just focusing on the external features for now.

When you are happy with your model, export it as a 2D graphic and save it to the Google Drive shared folder.

During the next class we’ll set up blog access, and you’ll use this image to write your first post along with some thoughts on your process.  As you model, think about how easy/hard it was, what elements particularly bogged you down, what compromises you had to make, etc.  Also think about a technique or tool that you wish you had figured out sooner, so that you can provide a tip for other novice SketchUp users and share your knowledge.


Resources

There are millions of SketchUp tutorials available online (just google SketchUp + what-you-want-to-do and you’ll be overwhelmed with options), but here’s a targeted list of resources to get you started.

  • If you haven’t already, download and print out a Quick Reference Card, so that you can start using keyboard shortcuts to switch between tools and get good fast.
  • Watch the Getting Started with SketchUp tutorial videos.  The first two are particularly useful for exteriors, but the third and fourth will give you more advanced techniques and tool tips, if you’d like to explore further.
  • SketchUp has also put out a couple series of videos that let you watch pros at work and give you great advice.

Lynda.com is a paid service, so not open to everyone, but you can access its tutorials by logging in with your Carleton ID.  If you want a more structured course, their SketchUp Essential Training is a great place to start.

 


Feel free to leave a comment if you’re having trouble, or if you discover something really great, and feel free to respond if you know the answer to a question.

Happy modeling!

css.php