Upload
mike-ellis
View
2.500
Download
1
Embed Size (px)
DESCRIPTION
Slides from the Mashup Workshop at Museums and the Web 2008
Citation preview
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.
1.30-2.00: introductions
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 (!)
1.30-2.00: introductions
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]
1.30-2.00: introductions
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”
1.30-2.00: introductions
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.
2.00 – 2.30: what are mashups and why use them?
9
in one sentence
“mashups let you do more with less”
2.00 – 2.30: what are mashups and why use them?
10
mapping
“Museums in Paris with free admission”
http://www.archi-nova.net/paris/tips.html
2.00 – 2.30: what are mashups and why use them?
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
2.00 – 2.30: what are mashups and why use them?
12
mapping
1. Page loads the API
2. Call includes your key
3. Initialize() is called
4. Your data is included here
2.00 – 2.30: what are mashups and why use them?
13
timeline
From UK Natural History Museum “dinosaur directory”
http://simile.mit.edu/timeline/examples/
2.00 – 2.30: what are mashups and why use them?
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
2.00 – 2.30: what are mashups and why use them?
15
timeline
1. Page loads the API
2. Options for display
3. Your data
4. Display it
2.00 – 2.30: what are mashups and why use them?
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
2.00 – 2.30: what are mashups and why use them?
17
RSS
From me (!) – “RSS to Image”
http://electronicmuseum.org.uk/experiments/rss-to-image/
2.00 – 2.30: what are mashups and why use them?
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
2.00 – 2.30: what are mashups and why use them?
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
2.00 – 2.30: what are mashups and why use them?
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
3.00 – 3.30 : a mapping mashup case study
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
3.00 – 3.30 : a mapping mashup case study
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
techniques and tools4.00 – 5.00 : mashup techniques and tools
30
MS PopFly
• nice but confusing interface
• requires Silverlight
• webpages, too
techniques and tools4.00 – 5.00 : mashup techniques and tools
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/