Museums and the Web Mashup Workshop

mashing it up: why, and how

mike ellis,

solutions architect, Eduserv

http://www.flickr.com/photos/plasticrevolver/61068219/

2

so..

• here’s what we will be doing:1.30 - 2.00: introductions

- about me (and you)

- what you want from the day

2.00 - 2.30: what ARE mashups and why use them?

- a brief overview of the concept

- some (museum) examples

- why are mashups important and what are the benefits?

2.30 – 3.00: group exercise: what have you seen?

- what have you seen

- what would you like / what are you planning to do?

3.00 – 3.30: a mapping mashup case study

- case study and deconstruction: mapping and mashing of UK museums

3.30 - 4.00: coffee in Ballroom Foyer

4.00 – 5.00: mashup techniques and tools

- typical mashup “design pattern”

- a superfast look at Yahoo! Pipes, Google Mashup Editor, MS Popfly

- Yahoo! Pipes in action: a simple example

5.00 – 5.15: data, issues

- getting and providing data and “what if...?”

5.15 - 5.30: summing it all up, questions, and “what next”..?

- moving it forwards: This week...Birds of a Feather...”mashedmuseum”...

1.30-2.00: introductions

3

today

• people have a variety of backgrounds, skills and requirements

• the entire point is that you go away with what you need from today...

• ...so please ask questions at any time

• or at any time this week, grab me!

• ...or do it virtually. There is also a Google Group.


4

me, me me

• I am..Mike Ellis

• I was Head of Web for NMSI for 7 years

• ..and now a “Solutions Architect” for Eduserv (I am a consultant who helps people realise their content vision using appropriate technologies)

• I’m fascinated with the real use of technology: I’m a geek but hopefully a “real-world” one...

•...in other words, the things I’m going to talk about should be useful (!)


5

about Eduserv

• Eduserv are a not for profit IT company

• We work to “realise the benefits of ICT for learners and researchers”

• We provide web dev, hosting, consultancy, ATHENS, CHEST, and have a Foundation who plough money back into the HE community

• We are actively looking at providing mashup-style services

• Please come talk to me anytime this week, or via email/blog/phone/skype/twitter/... [details at the end of the day]


6

you...

• 74% have some experience of html/coding but you aren’t experts...

• 75% know what a mashup is, and 35% have “been involved” in building one

• Most people have heard of the “top 3” tools: Yahoo Pipes, Google ME, MS Popfly

• 78% want to go away with confidence to guide and manage a “mashup project”


7

mashup overview

• “more than one source”

• consumption of data and services

• mashup environment = paradigm shift:

• the “web of data”

• machines talking to each other

• RSS

• this is (or can be) a black-box environment

• but more important, this is about approach:

• data and services are “out there” and available

• “we are smarter than me”

2.00 – 2.30: what are mashups and why use them?

8

the black boxhe knows how to drive...

..but he doesn’t know what makes the car work.


9

in one sentence

“mashups let you do more with less”


10

mapping

“Museums in Paris with free admission”

http://www.archi-nova.net/paris/tips.html


11

• you provide the data (museum name, location, review, description, etc)

• mapping service provides a way to display these locations on a map (plus some additional stuff)

• data and service is mashed and displayed on your site

mapping

data service

your site


12

mapping

1. Page loads the API

2. Call includes your key

3. Initialize() is called

4. Your data is included here


13

timeline

From UK Natural History Museum “dinosaur directory”

http://simile.mit.edu/timeline/examples/


14

• you provide the data (exhibit date, description, etc)

• timeline service provides a way to display these dates

• data and service is mashed and displayed on your site

timeline

data service

your site


15

timeline

1. Page loads the API

2. Options for display

3. Your data

4. Display it


16

RSS

• A lightweight data source

• Traditionally used for news, but actually is starting to gain mileage because it is simple

• As we’ll see later, things like Yahoo! Pipes make extensive use of RSS


17

RSS

From me (!) – “RSS to Image”

http://electronicmuseum.org.uk/experiments/rss-to-image/


18

RSS

• services provide data RSS (title, description, link..)

• service provides means to analyse this content

• my code provides a way to mash data and display

RSS (news)

Flickr search API

display

Term Extractor

data service

your site


19

why?

• developing these things from scratch would be:

• expensive

• complicated

• bespoke

• ...and therefore silly...

• you also get a shared resource pool for any problems that occur


20

group exercise

• what have you seen?

• what did you like?

• what are you planning to do?

• which sites do things well?

• how do they do it?

• which sites do things badly? why?

2.30 – 3.00: group exercise

21

case study

• aim: to put all UK museums on a Google map

• data: from 24hr museum

• required considerable munging

• postcode lookup (hacked API!)

• extensive use of Excel, Access, Word...!

• service: Google Maps (Google Earth) + Postcode lookup

• site: display using Google maps but also output as KML for use with Google Earth (NB: and other services...!)

3.00 – 3.30 : a mapping mashup case study

22

• identify the need from your users

• find data and service sources

• look to see who/what else is out there – and see if you can borrow or copy. View source!

• decide on an acceptable SLA, and work on contingencies

• determine how you’re actually going to do it based on these decisions

project pattern3.00 – 3.30 : a mapping mashup case study

23

case study “design pattern”

• determine what you want to do

• identify map service (Google, Yahoo, MS)

• sign up for API key (specific to URL root)

• identify your data source(s)

• identify any data services

• shape data sources to fit requirement

• drop these into the code

• shape the prototype


24

data service

your site

design pattern3.00 – 3.30 : a mapping mashup case study

25

case study

“Museum Directory v3”

http://www.mashedmuseum.org.uk/mm/museumdirectory/v3


26

coffee...

http://www.flickr.com/photos/basak/1264568795/

3.30 – 4.00 coffee (Ballroom Foyer)

27

techniques and tools

• there are three major “mashup building” tools:

• Yahoo! Pipes (http://pipes.yahoo.com)

• Google Mashup Editor (http://editor.googlemashups.com)

• Microsoft PopFly (http://www.popfly.com)

• these do similar things but are for different audiences

• all require you to “think flowchart”

• we’ll look at Y!Pipes in more detail in a moment...

4.00 – 5.00 : mashup techniques and tools

28

Yahoo! Pipes

• drag and drop

• “patchbay”-like

• RSS-focus

techniques and tools4.00 – 5.00 : mashup techniques and tools

29

Google Mashup Editor

• code, pseudo-code, html

• google gadget output


30

MS PopFly

• nice but confusing interface

• requires Silverlight

• webpages, too


31

• we’ll use Yahoo! Pipes to do something simple...

build something!4.00 – 5.00 : mashup techniques and tools

32

problems!• you are relying on 3rd parties

• often no SLA – is this ok for you?

• what if the service, system or data disappeared?

• accessibility: a changing landscape...

• how do you measure goodness...?

• where can you get data from?

5.00 – 5.15: data, and some issues

33

next..?

• let’s talk this week

• birds of a feather?

• keep an eye on www.mashedmuseum.org.uk

• join the mailing list

• keep in touch!

5.15 – 5.30 : summing up

34

thanks!

thanks very much for coming along

you can talk to me anytime – you should have my details by now, or go here:

twitter: dmje

blog: http://electronicmuseum.org.uk or http://blog.eduserv-psg.net/

Museums and the Web Mashup Workshop

Technology

Transcript of Museums and the Web Mashup Workshop