Rapid Development Challenges


Project Vision Challenge (Challenge 1)

The scenario:

You’ve been approached by X cultural heritage institution (replace X with one of the institutions below, your choice). They want to build a digital project of some kind to enable the general public to better explore and experience their collections, their institution, etc.

Work in groups (listed below) to envision a digital project for this scenario. Produce a short vision document (here is a template). Be prepared to briefly present your concept. The project (focus, platform, implementation, etc) is totally open.

Pick one of the following museums:

National Mining Museum, Scotland

Colonial Michilimackinac

Birmingham Civil Rights Institute

Robben Island Museum

Egyptian Museum, Cairo

Vasa Museum

Reykjavík Maritime Museum

District Six Museum

Museum of London

Grant Museum of Zoology

Detroit Institute of Arts

Sir John Soane Museum

Kigali Genocide Memorial

Maison de la Photographie

Museo Casa de la Libertad

Place of Memory, Tolerance and Social Inclusion

UBC Museum of Anthropology

Finnish Forrest Museum

The Teams:

Team 1:

Team 2:

Teams 3:


Project Pitch Website (Challenge 2)

Create pitch website for the project envisioned each team envisioned in Challenge 1. Teams are the same from last week.

  • The website should contain a landing page and several sub pages.
  • Each sub page should correspond to one of the sections in the vision document.
  • You should also have a sub page for “the team” with a pic and a bio for each of the team members.
  • Have all of these files on a GitHub repository.
  • Publish the files to the web using GitHub Pages.
  • Use a front end framework (Bootstrap, Foundation, etc) to create the site. You are welcome to use a template for your front-end framework. There are lots of Bootstrap and Foundation tutorials out there. Here is a handy cheat sheet for Bootstrap and a nice guide to Foundation. If you're going to use Bootstrap, you should check out Bootstrap Studio (which is a tool to build bootstrap themes as opposed to using someone else's pre-made theme). Bootstrap Studio is a paid service. However, you can get free license through the Github Student Developer Pack (which you should have already signed up for).
  • Add additional content beyond the original vision document as you see fit.

The teams (same as last week)

Team 1:

Team 2:

Teams 3:


Example sites from previous years (for reference):


Mapping Memory (Challenge 3)

Build the following using with either leaflet.js or mapbox.js – we’re calling this “Mapping Memory.” You are going to select at least 15 locations (more is fine) and create a theme or narrative that binds those locations together under the the idea of “mapping memory.” to do:

  • Develop a narrative that binds your locations together (or choose locations that fit into your narrative). Theme can be cultural, historical, (or para-historical…think The Canterbury Tales), literary, scientific (think John Snow and the Broad Street Cholera Epidemic). Think about this as if it were a real project, as opposed to a tech experiment.
  • Create a web page that displays a map of that location (set the zoom level so that the majority of the location fills the map on load).
  • The web page should have some sort of title of the project and brief description of the focus/theme/narrative.
  • Map should be on the landing page (as opposed to on a secondary page).
  • Landing/map page should have an onLoad pop up (like this or this) that provides a brief intro to the project. There are tutorials on how to do onLoad Javascript pop ups all over the web. Have a look at the code from the Mapping Morton Village project on Github to see how they did it.
  • Map should take up the entire browser window (regardless of how large or small the browser window is), edge to edge (no margin)
  • Choose at least 15 places of memory for that location (your choice as to type, time period, etc…but they all have to fit into your narrative)…more is fine
  • On the map, each of the places of memory should have a marker. The marker should be a custom marker, not the stock marker for that framework. Make sure that the custom markers scale (so they aren't super tiny when you are zoomed out) and work well (visually distinct, high contrast, etc) with the basemap you've chosen.
  • When you click on the marker, a popup should open. The popup should have the name of the place of memory, a brief description, an image of the place (taken from an openly licensed source), and a link to an authoritative website for that place (wikipedia, etc). Popup shouldn’t be open when the map loads – just when the user clicks on the marker.
  • The pop up should be styled (not default appearance).
  • The basemap should not be stock. Choose (or create) a basemap that speaks to your focus/theme/narrative.
  • You should have a slider (tutorial linked here) that when moved allows you to display markers based on their associated date/time period.
  • Have all of these files on an organizational GitHub repository (as opposed to an individual account repo).
  • Publish the files to the web using GitHub Pages.
  • Extra points to the group who uses a front end framework (Bootstrap, Ink, Foundation 5, etc).

Here are some previous projects from past years (for reference):

1. Mapping Michigan Demonstrations

2. Zombie Movie Map

3. Forrest Gump Map