Mashups Presentation

OVERVIEW

What is a mashup?

Types of Mashups

Why Mashups?

Anatomy of a Web Mashup

Mashup Examples – Wikis, Blogs and other Web 2.0 Tools

HOW TO

Mashup Spaces

Mashup – Images

Mashup - Video and Audio

Mashup – Bookmarks

Mashup – Microblogging

Mashup - Facebook

How can I use Mashups?

Which Tools? Links and Resources

Web 2.0 City. Source: gualtierocatrame - http://www.flickr.com/photos/gualtierocatrame/463128886/

DEFINITIONS

What is a Mashup? Web 2.0 Applications

The compounding (“mashing”) of two or more pieces of complementing web functionalities to create a powerful web application. This is usually achieved through the use of Application Programming Interfaces (APIs - the defined, and generally published, interface of a software or hardware that can be addressed and used by another software.

(Source: Six Things - A Quick Web 2.0 Glossary, http://www.brownbatterystudios.com/sixthings/2006/02/24/a-quick-web-20-glossary/)

DEFINITIONS

Examples of Web Application Mashups include:

A huge range of tools to combine Googlemaps data with other sources – including:

A mashup of US Electoral Map and Google Maps will allow you to interact with Google maps to calculate 2008 US Electoral vote

attendr - a GoogleMaps mashup for unconferences, gatherings, parties, etc that shows the locations of attendees and draws relationship connections between people; and my personal favourite

- Maps of breweries and bars across the several cities, which you can use to plan a brewery tour!

Flickr Mashups: used to aggregate, share and remix Flickr photos in a plethora of ways – including:

Big Huge Labs, which allows you to do fun stuff with your photos including mosaics, polaroid effects etc.

Flickr CC, which is a tool created to do creative commons searches on the vast library of images available on Flickr and is owned by Australia’s very own Peter Shanks!

And many many others…..

DEFINITIONS

What is a Mashup? Music and Video

… In music or video, a genre that consists entirely of parts of other songs or videos, edited to appear as one; in new media, a Web site or web application that combines content from more than one source. Chronologically, first there were music mashups, where two or more tracks are combined, often with one acapella track by one artist over a second backing track by another..... Most recently the video mashup has become popular thanks to sites like YouTube.

(Source: Open Content and Public Broadcasting Conference Glossary, http://opencontent.wgbh.org/report/glossary.htm)

DEFINITIONS

Mashup Videos in Response to the Australian Federal Election in 2007 and the US Government Election 2008

The Collected Works of Weird Al Yankovich

Video remakes by Fans on Youtube

Examples of Music and Video Mashups include:

DEFINITIONS

What is a Mashup? Web 2.0 Content Mashups

Using freely available Web 2.0 tools to create a website which aggregates content from a number of Web 2.0 service to create either a community website (for learners or other socially networked groups) or a personalised learning environment (eg. Personal blogs).

WHY CONTENT MASHUPS?

The idea from this presentation came out of the work undertaken during an E-Networks event in 2007 to ‘live-blog’ an online conference event, and provide an example of how Web 2.0 tools can be used to quickly and easily create engaging spaces for both professional development, and also use with learners.

During the conference we created the e-Show n Tell Conference Blog which is still accessible @ http://eshowntell2007.edublogs.org/ and is a good example of a simple mashup using Web 2.0 tools including Edublogs.org, Flickr and Slideshare.net

WHY CONTENT MASHUPS?

Content mashups allow for simple aggregation of content from a range of sources quickly and easily.

Add images from Flickr, Photobucket, Picasa or a range of photosharing services

Add video from YouTube, Google Video or a range of videosharing spaces

Aggregate slides and course notes using tools like Slideshare.net, Google Docs

Embed Social Networking tools in your class blog or PLE

Create an archive of useful content on a wikipage by embedding linkrolls or tag clouds from your social bookmarking service.

Most importantly, Mashups combine dynamic content, which is often driven using RSS feeds, and placed in your ‘web space’ using javascript or HTML code to create automatically updating elements on your website.

MASHUP EXAMPLES - BLOGS

From Mr. “A” to Mr. “Z”

http://teacherman79.wordpress.com

Jeff from Montana’s Personal Blog

Incorporates both Flickr Photos and Videos from Vodpod which are automatically updated by those services

MASHUP EXAMPLES - BLOGS

Cert IV Websites @ TAFE

http://designwebsites.blogspot.com

Blue Mountains TAFE Course Blog

Provides ongoing news and information for students

One Stop Shop for Links to all Course sites

News, Tutorials and articles in the sidebar

Aggregates information from Students blogs and portfolios.

MASHUP EXAMPLES - WIKIS

The Far and Away Project Wiki

http://teacherman79.wikispaces.com/

Collaborative Project for Middle School kids in Montana, USA and Parramatta, Australia.

Incorporates Wiki Functionality with engaging web 2.0 services such as VoiceThread to provide a place for students to collaborate globally.

MASHUP EXAMPLES - WIKIS NSW E-learning Innovations Wiki http://nswinnovations.wikispaces.com Provides a reporting space for NSW Innovations project teams Incorporates simple tools such as Google Maps Embeds to map participants locations A good model for professional development projects and communities of practice. Links all project spaces together - including all project teams individual spaces, resource spaces, traditional websites and the national proejct blog.

SPACES FOR MASHUPS

Additionally, there are lots of tools you can use to ‘mashup’ specific learning resources or assets for your blog, wiki or LMS.

These include:

Moodle Courses

Facebook Groups

Ning Groups

WetPaint Wikis

… ..and many many others!

ANATOMY OF A WEB MASHUP

There are many different ways to ‘mashup’ websites, but for the purposes of this presentation, I’m going to deconstruct one of my own sites – jokaydia.com.

Our blog to support the Islands of jokaydia Community in Second Life, which is a community of practice focussed on developing strategies

for education in virtual worlds.

http://jokaydia.com

ANATOMY OF A WEB MASHUP

The jokaydia.com blog combines content from a range of sources:

Blog posts by facilitators in the central column

Left Hand Column includes links and resources, RSS feeds and other administrative tools

Right-Hand Column includes images, multimedia content and other dynamically driven data.

Wordpress Blog Pages to include permanent content and useful resources

Let’s examine it in a bit more detail!

HOW TO: MASHUP - IMAGES

Left Hand Column includes images from the jokaydia Flickr Group which aggregates images from all jokaydia residents.

This content is embedded in the sidebar using Flickr’s Badge Tools, which allow you to select images by user, group or tag and share them on your blog, wiki or other website. If you are a flickr user, you can experiment with this technique @ http://flickr.com/badge.gne

HOW TO: MASHUP - IMAGES

It is important to note here the ability to incorporate images from multiple sources.

The jokaydia Community are prolific contributors to the jokaydia fotopool on Flickr, so this provides us with both an effective way to keep the blog looking fresh and up to date; and also provides us an opportunity to create a sense of community ownership of the site.

HOW TO: MASHUP – VIDEO AND AUDIO

Videos created by our community members are embedded on the Blog’s sidebar and are regularly updated.

Blip.tv is particularly good at converting and compressing videos in a broad range of formats, and is accessible via most firewalls.

Users can also locate videos on the blip.tv website via the jokaydia tag.

HOW TO: MASHUP – SOCIAL BOOKMARKING

Aggregating useful social bookmarking links on the blog allow a quick and useful way to point to other resources that the community might find useful or interesting, without having to go to all the trouble of a full posting.

New Links from my del.icio.us roll automatically appear in this part of the right-hand column on the blog.

Del.icio.us provides simple ‘Link Roll’ tools that can be used to achieve this technique, aggregating a particular users bookmarks, or a tag collection.

HOW TO: MASHUP – MICROBLOGGING

Twitter Tools

Twitter is a microblogging tool, that allows users to make short, 140 character postings that are received via the web, dedicated Twitter messenger applications or IM tools such as Gtalk.

Twitter provides a quick and easy way to connect to your network and share thoughts, ideas, leads, questions and connections.

Twitter can also be aggregated to a blog, to provide readers with an ongoing link to your real-time activities.

HOW TO: MASHUP – FACEBOOK

Facebook provides a number of different options for creating community and sharing content on your profile.

It allows you to:

Post your flickr, blogs and twitter updates on your Facebook Profile

Create Blog Fan pages using Facebook Apps

Create Groups to draw Community together.

HOW TO: MASHUP – FACEBOOK

In order to promote jokaydia and our resources we use a number of Facebook tools including:

The jokaydia Facebook Group – a social network for our community to meet, share and connect to our activities

The jokaydia Facebook Fan Page – a promotional tool to share our services and online presence

The jokaydia Blog Page – using a Facebook App to share our blog into another network and generate traffic.

To ensure that readers of the blog can easily find us on Facebook, we have incorporated the Facebook Badge and links on the jokaydia Blog’s Left-Hand Column

HOW CAN I USE MASHUPS?

Mashup Techniques can be used to:

Create engaging class blogs which combine images, text and links

Create Learning resources including videos, slideshows and podcasts which combine content from multiple websites and services

Aggregate content from multiple source – ie. Students blogs, podcasts, vodcasts etc

Embed engaging content and dynamic content on pages within Learning Management Systems

Create a PLE – Personalised Learning Environment

Collaborative Knowledge Creation – gluing together content from multiple educators or students.

WHICH TOOLS? LINKS AND RESOURCES

Great spaces to mashup in:

Edublogs: http://edublogs.org/

Blogger: https://www.blogger.com

Wordpress.com: http://wordpress.com/

Wikispaces.com: http://www.wikispaces.com/

Other options include ‘hosting your own’ using the open source Wordpress blogging platform or corporate solutions such as Sydney Institute’s Wordpress install.