DIGITAL MANUSCRIPTS TOOLKITDIGITAL MANUSCRIPTS TOOLKIT
The journey so far...
Monica Messaggi Kaya
@monicams
ABOUT MEABOUT ME
Javascript / Front-end
developer
at
Bodleian Libraries
University of Oxford
WHAT IS DMT?WHAT IS DMT?
Easy to use toolkit
focus on the study and presentation of medieval manuscripts,
working with digital materials in innovative and exciting ways
Project blog at http://dmt.bodleian.ox.ac.uk
WHY?WHY?
Content is available through a great many
different viewers, websites, and
approaches.
Varied levels of quality, functionality and ease of access, and
to lots of duplicated effort
AIMSAIMS
Use, develop, and repurpose
digital manuscripts
and other cultural heritage materials
International Image Interoperability
Framework
Two Linked Data-based APIs - an and
a - to allow reuse of content, creating a
global network whereby institutions can share materials and
allow innovative development.
Image API
Presentation API
Deploy an image server that supports the IIIF Image API
STEPS TO WORK WITH IIIFSTEPS TO WORK WITH IIIF
Publish metadata about your image-based objects that
complies to IIIF Presentation API
Deploy and integrate software that allows you to discover
and display IIIF-compliant image resources
The IIIF Image API URI for requesting an image must conform
to the following URI Template:
{scheme}://{server}{/prefix}/{identifier}/{region}/{size}/{rotation}/{quality}.{format}
IIIF IMAGE APIIIIF IMAGE API
For example:
http://www.example.org/image-service/abcd1234/full/full/0/default.jpg
Demo: http://iiif.io/#try-it
Digital images are a container for much of
the information content in the Web-based
delivery of “stuff” *.
IIIF PRESENTATION APIIIIF PRESENTATION API
* museum objects, books, newspapers, letters, manuscripts, maps, scrolls, single sheet
collections, and digital surrogates of textiles, realia and ephemera.
Each manifest must, and is very likely to, have one
sequence, but may have more than one.
PRIMARY RESOURCESPRIMARY RESOURCES
Each sequence must have at least one canvas and is
likely to have more than one.
Each canvas should have one or more content
resources associated with it.
Zero is possible but unlikely; it represents the case where the page exists (or
existed) but has not been digitized.
DESCRIPTIVE PROPERTIESDESCRIPTIVE PROPERTIES
label
A human readable label, name or title for the resource.
metadata
A list of short descriptive entries, given as pairs of human readable label and value to be
displayed to the user.
thumbnail
A small image that depicts or pictorially represents the resource that the property is attached
to.
PRESENTATION RESOURCE PROPERTIESPRESENTATION RESOURCE PROPERTIES
RIGHTS AND LICENSING PROPERTIESRIGHTS AND LICENSING PROPERTIES
attribution
A human readable label that must be displayed when the resource it is associated with is
displayed or used.
logo
A small image that represents an individual or organization associated with the resource it is
attached to.
license
A link to an external resource that describes the license or rights statement under which the
resource is being used.
PRESENTATION RESOURCE PROPERTIESPRESENTATION RESOURCE PROPERTIES
TECHNICAL PROPERTIESTECHNICAL PROPERTIES
@id - @type - Height - viewingDirection – viewingHint
LINKING PROPERTIESLINKING PROPERTIES
Related – service – seeAlso – within – startCanvas
PRESENTATION RESOURCE PROPERTIESPRESENTATION RESOURCE PROPERTIES
Using JSON for linking data ( ) to
organise and connect
Json - ease of developement
Linked data - play nice with others
JSON-LD
HOW?HOW?
http://iiif.io/api/presentation/2.0/#primary-resource-types-1
{
// Metadata about this manifest file
"@context":"http://iiif.io/api/presentation/2/context.json",
"@id":"http://www.example.org/iiif/book1/manifest",
"@type":"sc:Manifest",
// Descriptive metadata about the object/work
"label": "Book 1",
"metadata": [
{"label":"Author", "value":"Anne Author"},
{"label":"Published", "value": [
{"@value": "Paris, circa 1400", "@language":"en"},
{"@value": "Paris, environ 1400", "@language":"fr"}
]
},
{"label":"Source",
"value": "<span>From: <a href="http://example.org/db/1.html">Some Collection</a></span>"}
],
"description":"A longer description of this example book. It should give some real information.",
"thumbnail": {
"@id": "http://www.example.org/images/book1-page1/full/80,100/0/default.jpg",
"service": {
"@context":"http://iiif.io/api/image/2/context.json",
"@id":"http://www.example.org/images/book1-page1",
"profile":"http://iiif.io/api/image/2/level1.json"
}
},
// Presentation Information
"viewingDirection": "right-to-left",
"viewingHint": "paged",
// Rights Information
Image server - deliver easily installable
versions of IIP and Loris
(probably via images)Docker
DMT PROGRESSDMT PROGRESS
Metadata IIIF compliance
via (python)Manifest Factory
DMT PROGRESSDMT PROGRESS
Discovery:
This reunites an early Qur’anic manuscript which had been
split and dispersed and is now held by four institutions:
Bodleian (UK), Wolfenbuttel (Germany), Chester Beatty
Library (Dublin), and the BnF (Paris)
Digital Mushaf project
DMT PROGRESSDMT PROGRESS
Display IIIF-compliant image resources
Using on the
Another example: - demo
Mirador Mushaf pilot project
UniversalViewer Arch. G b.6
DMT PROGRESSDMT PROGRESS
Research of existing tools and libraries
To name a few: Grunt, Node.js, jQuery, Karma, underscore.js,
pubsub.js, handlebars.js, URI.js, mousetrap.js,
ZeroClipboard.js, d3.js, state-machine.js, tinymce.js, qTip2,
sinon.js, Jasmine, Istanbul, Travis and more.
DMT PROGRESSDMT PROGRESS
Viewers
OpenSeadragon
Mirador
UniversalViewer
DMT PROGRESSDMT PROGRESS
UI mockup for Manifest editor
Authoring tool easy to use, drag and drop features, editing
labels (without *having to type* json)
http://invis.io/CT3BSFX3M
DMT PROGRESSDMT PROGRESS
Few tests
Using JSON Editor as base
But a change on the project is near… I’m looking to reuse
http://tinyurl.com/dmt-sample
https://github.com/IIIF/manifesto
DMT PROGRESSDMT PROGRESS
equals
challenges
AMAZING USE-CASESAMAZING USE-CASES
Dr Daron Burrows
Associate Professor of Medieval French
Faculty of Medieval and Modern Languages
Anglo-Norman Apocalypse
Manuscripts held in the
Bodleian Library
THE APOCALYPSE IN OXFORDTHE APOCALYPSE IN OXFORD
MS Bodley 401
Alex Franklin & Daniel Sawyer
D.Phil. Candidates in medieval English
Faculty of English Language & Literature
ROLLING HISTORY IN
FIFTEENTH-CENTURY
ENGLAND
ROLLING HISTORYROLLING HISTORY
MS Barlow 53, membrane 1, medallion 3
Jennifer Shurville
D.Phil. Candidate
History of Art Department
THE ROTA DOMINICE
ORATIONIS DIGITISATION
PROJECT
THE ROTA DOMINICE ORATIONISTHE ROTA DOMINICE ORATIONIS
Vercelli, ACVC, fp, 'Rota Dominice
orationis'.
Image courtesy of Fondazione Museo del Tesoro del
Duomo e Archivio Capitolare di Vercelli.
Dr Emilio Bonfiglio
British Academy Postdoctoral Fellow
Faculty of Oriental Studies
Robin Meyer
Armenian Exhibition Curator
D. Phil. Candidate, Faculty of Linguistics
Armenian Codicology and
Palaeography
DIGITAL TEACHING TOOLSDIGITAL TEACHING TOOLS
Image courtesy of R. Meyer & E. Bonfiglio
Stanford, Harvard and Yale in the USA
Bibliothèque nationale de France and C2RMF in Europe
British Library and the Wellcome Library in the UK.
COLABORATIONCOLABORATION
"LIFE HAPPENS""LIFE HAPPENS"
Special thanks:
Judith Siefring – DMT use-cases
Matt McGrattan – DMT/IIIF and server info
Rob Sanderson –
Pictures (via )
Challenge by Nicolai Traasdahl Tarp
Storm by Frantzou Fleurine
Viewer by Rohit Padmanabhan
Squirrel by Good Free Photos
Before you think out of the box (via )
IIIF slides
Unsplash
Lastlemon
CREDITSCREDITS
THANK YOU!
Monica Messaggi Kaya
Slides at
http://monicams.com
@monicams
https://slides.com/monica/digital-manuscripts-toolkit/

Digital Manuscripts Toolkit, using IIIF and JavaScript. Monica Messaggi Kaya

  • 1.
    DIGITAL MANUSCRIPTS TOOLKITDIGITALMANUSCRIPTS TOOLKIT The journey so far... Monica Messaggi Kaya @monicams
  • 2.
    ABOUT MEABOUT ME Javascript/ Front-end developer at Bodleian Libraries University of Oxford
  • 3.
    WHAT IS DMT?WHATIS DMT? Easy to use toolkit focus on the study and presentation of medieval manuscripts, working with digital materials in innovative and exciting ways Project blog at http://dmt.bodleian.ox.ac.uk
  • 4.
    WHY?WHY? Content is availablethrough a great many different viewers, websites, and approaches. Varied levels of quality, functionality and ease of access, and to lots of duplicated effort
  • 5.
    AIMSAIMS Use, develop, andrepurpose digital manuscripts and other cultural heritage materials
  • 6.
    International Image Interoperability Framework TwoLinked Data-based APIs - an and a - to allow reuse of content, creating a global network whereby institutions can share materials and allow innovative development. Image API Presentation API
  • 7.
    Deploy an imageserver that supports the IIIF Image API STEPS TO WORK WITH IIIFSTEPS TO WORK WITH IIIF Publish metadata about your image-based objects that complies to IIIF Presentation API Deploy and integrate software that allows you to discover and display IIIF-compliant image resources
  • 8.
    The IIIF ImageAPI URI for requesting an image must conform to the following URI Template: {scheme}://{server}{/prefix}/{identifier}/{region}/{size}/{rotation}/{quality}.{format} IIIF IMAGE APIIIIF IMAGE API For example: http://www.example.org/image-service/abcd1234/full/full/0/default.jpg Demo: http://iiif.io/#try-it
  • 9.
    Digital images area container for much of the information content in the Web-based delivery of “stuff” *. IIIF PRESENTATION APIIIIF PRESENTATION API * museum objects, books, newspapers, letters, manuscripts, maps, scrolls, single sheet collections, and digital surrogates of textiles, realia and ephemera.
  • 10.
    Each manifest must,and is very likely to, have one sequence, but may have more than one. PRIMARY RESOURCESPRIMARY RESOURCES Each sequence must have at least one canvas and is likely to have more than one. Each canvas should have one or more content resources associated with it. Zero is possible but unlikely; it represents the case where the page exists (or existed) but has not been digitized.
  • 11.
    DESCRIPTIVE PROPERTIESDESCRIPTIVE PROPERTIES label Ahuman readable label, name or title for the resource. metadata A list of short descriptive entries, given as pairs of human readable label and value to be displayed to the user. thumbnail A small image that depicts or pictorially represents the resource that the property is attached to. PRESENTATION RESOURCE PROPERTIESPRESENTATION RESOURCE PROPERTIES
  • 12.
    RIGHTS AND LICENSINGPROPERTIESRIGHTS AND LICENSING PROPERTIES attribution A human readable label that must be displayed when the resource it is associated with is displayed or used. logo A small image that represents an individual or organization associated with the resource it is attached to. license A link to an external resource that describes the license or rights statement under which the resource is being used. PRESENTATION RESOURCE PROPERTIESPRESENTATION RESOURCE PROPERTIES
  • 13.
    TECHNICAL PROPERTIESTECHNICAL PROPERTIES @id- @type - Height - viewingDirection – viewingHint LINKING PROPERTIESLINKING PROPERTIES Related – service – seeAlso – within – startCanvas PRESENTATION RESOURCE PROPERTIESPRESENTATION RESOURCE PROPERTIES
  • 14.
    Using JSON forlinking data ( ) to organise and connect Json - ease of developement Linked data - play nice with others JSON-LD HOW?HOW?
  • 15.
    http://iiif.io/api/presentation/2.0/#primary-resource-types-1 { // Metadata aboutthis manifest file "@context":"http://iiif.io/api/presentation/2/context.json", "@id":"http://www.example.org/iiif/book1/manifest", "@type":"sc:Manifest", // Descriptive metadata about the object/work "label": "Book 1", "metadata": [ {"label":"Author", "value":"Anne Author"}, {"label":"Published", "value": [ {"@value": "Paris, circa 1400", "@language":"en"}, {"@value": "Paris, environ 1400", "@language":"fr"} ] }, {"label":"Source", "value": "<span>From: <a href="http://example.org/db/1.html">Some Collection</a></span>"} ], "description":"A longer description of this example book. It should give some real information.", "thumbnail": { "@id": "http://www.example.org/images/book1-page1/full/80,100/0/default.jpg", "service": { "@context":"http://iiif.io/api/image/2/context.json", "@id":"http://www.example.org/images/book1-page1", "profile":"http://iiif.io/api/image/2/level1.json" } }, // Presentation Information "viewingDirection": "right-to-left", "viewingHint": "paged", // Rights Information
  • 16.
    Image server -deliver easily installable versions of IIP and Loris (probably via images)Docker DMT PROGRESSDMT PROGRESS
  • 17.
    Metadata IIIF compliance via(python)Manifest Factory DMT PROGRESSDMT PROGRESS
  • 18.
    Discovery: This reunites anearly Qur’anic manuscript which had been split and dispersed and is now held by four institutions: Bodleian (UK), Wolfenbuttel (Germany), Chester Beatty Library (Dublin), and the BnF (Paris) Digital Mushaf project DMT PROGRESSDMT PROGRESS
  • 19.
    Display IIIF-compliant imageresources Using on the Another example: - demo Mirador Mushaf pilot project UniversalViewer Arch. G b.6 DMT PROGRESSDMT PROGRESS
  • 21.
    Research of existingtools and libraries To name a few: Grunt, Node.js, jQuery, Karma, underscore.js, pubsub.js, handlebars.js, URI.js, mousetrap.js, ZeroClipboard.js, d3.js, state-machine.js, tinymce.js, qTip2, sinon.js, Jasmine, Istanbul, Travis and more. DMT PROGRESSDMT PROGRESS
  • 22.
  • 23.
    UI mockup forManifest editor Authoring tool easy to use, drag and drop features, editing labels (without *having to type* json) http://invis.io/CT3BSFX3M DMT PROGRESSDMT PROGRESS
  • 24.
    Few tests Using JSONEditor as base But a change on the project is near… I’m looking to reuse http://tinyurl.com/dmt-sample https://github.com/IIIF/manifesto DMT PROGRESSDMT PROGRESS
  • 25.
  • 26.
    Dr Daron Burrows AssociateProfessor of Medieval French Faculty of Medieval and Modern Languages Anglo-Norman Apocalypse Manuscripts held in the Bodleian Library THE APOCALYPSE IN OXFORDTHE APOCALYPSE IN OXFORD MS Bodley 401
  • 27.
    Alex Franklin &Daniel Sawyer D.Phil. Candidates in medieval English Faculty of English Language & Literature ROLLING HISTORY IN FIFTEENTH-CENTURY ENGLAND ROLLING HISTORYROLLING HISTORY MS Barlow 53, membrane 1, medallion 3
  • 28.
    Jennifer Shurville D.Phil. Candidate Historyof Art Department THE ROTA DOMINICE ORATIONIS DIGITISATION PROJECT THE ROTA DOMINICE ORATIONISTHE ROTA DOMINICE ORATIONIS Vercelli, ACVC, fp, 'Rota Dominice orationis'. Image courtesy of Fondazione Museo del Tesoro del Duomo e Archivio Capitolare di Vercelli.
  • 29.
    Dr Emilio Bonfiglio BritishAcademy Postdoctoral Fellow Faculty of Oriental Studies Robin Meyer Armenian Exhibition Curator D. Phil. Candidate, Faculty of Linguistics Armenian Codicology and Palaeography DIGITAL TEACHING TOOLSDIGITAL TEACHING TOOLS Image courtesy of R. Meyer & E. Bonfiglio
  • 30.
    Stanford, Harvard andYale in the USA Bibliothèque nationale de France and C2RMF in Europe British Library and the Wellcome Library in the UK. COLABORATIONCOLABORATION
  • 31.
  • 32.
    Special thanks: Judith Siefring– DMT use-cases Matt McGrattan – DMT/IIIF and server info Rob Sanderson – Pictures (via ) Challenge by Nicolai Traasdahl Tarp Storm by Frantzou Fleurine Viewer by Rohit Padmanabhan Squirrel by Good Free Photos Before you think out of the box (via ) IIIF slides Unsplash Lastlemon CREDITSCREDITS
  • 33.
  • 34.
    Monica Messaggi Kaya Slidesat http://monicams.com @monicams https://slides.com/monica/digital-manuscripts-toolkit/