International Image Interoperability Framework


Peter Binkley

Code4LibAB, Edmonton, 25 Nov. 2016

These slides

http://tinyurl.com/code4libab2016-iiif

"Year of Javascript"

On the back of a napkin in a Cuban restaurant in Palo Alto

http://iiif.io

Milestones

  • 2012: 1.0
  • 2013: 1.1
  • 2014: 2.0 versions
  • 2015: IIIF Consortium formed (11 institutions)
  • 2016: First full-time staff; 2.1 versions
  • https://github.com/IIIF/awesome-iiif

Demos

A Family of APIs

You need a tile server...

  • Source images optimized for tiles: JPEG2000 or Pyramidal TIFF
  • Applications:
    • Djatoka
    • Loris
    • IIPImage
    • riiif (Ruby)
    • various shims, including one for ContentDM
  • Or: go static! (Level 0 Compliance)

Image Service

  • Depends on a specific URL pattern: /12288,8192,4096,4096/1024,/0/default.jpg
    1. Region: 12288,8192,4096,4096
    2. Size: 1024,
    3. Rotation: 0
    4. Quality: default
    5. Format: jpg

Playing with URL components

Default: http://libimages.princeton.edu/loris2/pudl0001%2F5138415%2F00000011.jp2/full/full/0/default.jpg

Let's play! http://libimages.princeton.edu/loris2/pudl0001%2F5138415%2F00000011.jp2/999,999,2023,2023/256,/45/gray.jpg

info.json

http://libimages.princeton.edu/loris2/pudl0001%2F5138415%2F00000011.jp2/info.json

Formatted version

json-ld

  • json-ld: Linked Data expressed in JSON
  • e.g. "height": 7200 corresponds to:
  • Subject: <http://libimages.princeton.edu/loris2/pudl0001%2F5138415%2F00000011.jp2>

    Predicate: <http://www.w3.org/2003/12/exif/ns#height>

    Object: "7200"^^<http://www.w3.org/2001/XMLSchema#integer>

Let's try it:

  • RDF Translator...
  • ... with a Stanford manifest: https://purl.stanford.edu/wh234bz9013/iiif/manifest.json ...
  • ... converts json-ld to N-triples ...

Hands On

jekyll-iiif

Steps

  • Install ruby, jekyll and bundler
  • Download images and unzip into jekyll folder
  • Run bundle install to install jekyll-iiif
  • Create collections and iiif layout (not necessary if you're using jekyll-iiif-stuff.zip)
  • Start jekyll: jekyll s
  • Visit jekyll at http://127.0.0.1:4000/
  • Explore tiles directory

Adding a Presentation Viewer

Drag and Drop

Limitations of jekyll-iiif

  • Level 0 compliance (static tiles)
  • Requires server config to enable CORS header
  • Requires regeneration of full tiles directory to change host (e.g. when moving from dev to production)

Presentation API

  • Package all the images together...
  • ...but so much more:
    • Labels (note: NOT descriptive metadata record)
    • Technical details of capabilities
    • Annotations

Structure of a Manifest

  • Manifest
  • Sequence(s)
  • Canvas(es)
  • Annotation(s) - image, text, etc.

Shared Canvas and Open Annotation

Painting a Canvas

Image Annotation

Sharing the Canvas

See the manifest for the manuscript with the cut-out illuminated initials.

  • A main tileSource from IRHT...
  • ...and a "detail" with a zone and a tileSource from BNF

Text Annotation

{
    "@type": "oa:Annotation",
    "motivation": "sc:painting",
    "resource": {
        "@type": "cnt:ContentAsText",
        "format": "text/plain",
        "chars": "Vea Stephens, St Martin's Crescent. 0 10 0"
    },
    "on": "http://dams.llgc.org.uk/iiif/3100186/canvas/3100187#xywh=346,6196,870,58"
},

Ranges

For more complex internal structures, e.g newspaper articles that span multiple pages.

{
  "@id": "http://example.org/iiif/book1/range/r1",
  "@type": "sc:Range",
  "label": "Introduction",
  "ranges": ["http://example.org/iiif/book1/range/r1-1"],
  "canvases": [
    "http://example.org/iiif/book1/canvas/p1",
    "http://example.org/iiif/book1/canvas/p2",
    "http://example.org/iiif/book1/canvas/p3#xywh=0,0,750,300"
  ]
},

Where's the Metadata?

"label":"Book 1",
"metadata": [
	{"label":"Author", "value":"Anne Author"},
	{"label":"Published", "value": [
	    {"@value": "Paris, circa 1400", "@language":"en"},
	    {"@value": "Paris, environ 14eme siecle", "@language":"fr"}
	    ]
	}
],

"There are no semantics conveyed by this information, and clients should not use it for discovery or other purposes."

... somewhere else

"seeAlso":
{
  "@id": "http://www.example.org/library/catalog/book1.marc",
  "format": "application/marc"
},

Tools

Image

  • OpenSeaDragon

Manifest

Future Directions

  • Multimedia
  • Discovery

Resources