Mashups Presentation


Published on

Slides for a presentation for the eGems series on using Mashup techniques to create useful spaces for classes, learner groups and communities of practice.

Published in: Technology, Education
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Mashups Presentation

  2. OVERVIEW <ul><ul><li>What is a mashup? </li></ul></ul><ul><ul><ul><li>Types of Mashups </li></ul></ul></ul><ul><ul><ul><li>Why Mashups? </li></ul></ul></ul><ul><ul><ul><li>Anatomy of a Web Mashup </li></ul></ul></ul><ul><ul><li>Mashup Examples – Wikis, Blogs and other Web 2.0 Tools </li></ul></ul><ul><ul><li>HOW TO </li></ul></ul><ul><ul><ul><li>Mashup Spaces </li></ul></ul></ul><ul><ul><ul><li>Mashup – Images </li></ul></ul></ul><ul><ul><ul><li>Mashup - Video and Audio </li></ul></ul></ul><ul><ul><ul><li>Mashup – Bookmarks </li></ul></ul></ul><ul><ul><ul><li>Mashup – Microblogging </li></ul></ul></ul><ul><ul><ul><li>Mashup - Facebook </li></ul></ul></ul><ul><ul><li>How can I use Mashups? </li></ul></ul><ul><ul><li>Which Tools? Links and Resources </li></ul></ul>Web 2.0 City. Source: gualtierocatrame -
  3. DEFINITIONS <ul><li>What is a Mashup? Web 2.0 Applications </li></ul><ul><li>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. </li></ul><ul><li>(Source: Six Things - A Quick Web 2.0 Glossary, </li></ul>
  4. DEFINITIONS <ul><li>Examples of Web Application Mashups include: </li></ul><ul><li>A huge range of tools to combine Googlemaps data with other sources – including: </li></ul><ul><ul><li>A mashup of US Electoral Map and Google Maps will allow you to interact with Google maps to calculate 2008 US Electoral vote </li></ul></ul><ul><ul><li>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 </li></ul></ul><ul><ul><li>- Maps of breweries and bars across the several cities, which you can use to plan a brewery tour! </li></ul></ul><ul><li>Flickr Mashups: used to aggregate, share and remix Flickr photos in a plethora of ways – including: </li></ul><ul><ul><li>Big Huge Labs, which allows you to do fun stuff with your photos including mosaics, polaroid effects etc. </li></ul></ul><ul><ul><li>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! </li></ul></ul><ul><li>And many many others….. </li></ul>
  5. DEFINITIONS <ul><li>What is a Mashup? Music and Video </li></ul><ul><li>… 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. </li></ul><ul><li>(Source: Open Content and Public Broadcasting Conference Glossary, </li></ul>
  6. DEFINITIONS <ul><ul><li>Mashup Videos in Response to the Australian Federal Election in 2007 and the US Government Election 2008 </li></ul></ul><ul><ul><li>The Collected Works of Weird Al Yankovich </li></ul></ul><ul><ul><li>Video remakes by Fans on Youtube </li></ul></ul>Examples of Music and Video Mashups include:
  7. DEFINITIONS <ul><li>What is a Mashup? Web 2.0 Content Mashups </li></ul><ul><li>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). </li></ul>
  8. WHY CONTENT MASHUPS? <ul><li>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. </li></ul><ul><li>During the conference we created the e-Show n Tell Conference Blog which is still accessible @ and is a good example of a simple mashup using Web 2.0 tools including, Flickr and </li></ul>
  9. WHY CONTENT MASHUPS? <ul><li>Content mashups allow for simple aggregation of content from a range of sources quickly and easily. </li></ul><ul><ul><li>Add images from Flickr, Photobucket, Picasa or a range of photosharing services </li></ul></ul><ul><ul><li>Add video from YouTube, Google Video or a range of videosharing spaces </li></ul></ul><ul><ul><li>Aggregate slides and course notes using tools like, Google Docs </li></ul></ul><ul><ul><li>Embed Social Networking tools in your class blog or PLE </li></ul></ul><ul><ul><li>Create an archive of useful content on a wikipage by embedding linkrolls or tag clouds from your social bookmarking service. </li></ul></ul><ul><li>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. </li></ul>
  10. MASHUP EXAMPLES - BLOGS <ul><li>From Mr. “A” to Mr. “Z” </li></ul><ul><li> </li></ul><ul><li>Jeff from Montana’s Personal Blog </li></ul><ul><li>Incorporates both Flickr Photos and Videos from Vodpod which are automatically updated by those services </li></ul>
  11. MASHUP EXAMPLES - BLOGS <ul><li>Cert IV Websites @ TAFE </li></ul><ul><li> </li></ul><ul><li>Blue Mountains TAFE Course Blog </li></ul><ul><li>Provides ongoing news and information for students </li></ul><ul><li>One Stop Shop for Links to all Course sites </li></ul><ul><li>News, Tutorials and articles in the sidebar </li></ul><ul><li>Aggregates information from Students blogs and portfolios. </li></ul>
  12. MASHUP EXAMPLES - WIKIS <ul><li>The Far and Away Project Wiki </li></ul><ul><li> </li></ul><ul><li>Collaborative Project for Middle School kids in Montana, USA and Parramatta, Australia. </li></ul><ul><li>Incorporates Wiki Functionality with engaging web 2.0 services such as VoiceThread to provide a place for students to collaborate globally. </li></ul>
  13. MASHUP EXAMPLES - WIKIS NSW E-learning Innovations Wiki 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.
  14. SPACES FOR MASHUPS <ul><li>Additionally, there are lots of tools you can use to ‘mashup’ specific learning resources or assets for your blog, wiki or LMS. </li></ul><ul><li>These include: </li></ul><ul><ul><li>Moodle Courses </li></ul></ul><ul><ul><li>Facebook Groups </li></ul></ul><ul><ul><li>Ning Groups </li></ul></ul><ul><ul><li>WetPaint Wikis </li></ul></ul><ul><li>… ..and many many others! </li></ul>
  15. ANATOMY OF A WEB MASHUP <ul><li>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 – </li></ul><ul><li>Our blog to support the Islands of jokaydia Community in Second Life, which is a community of practice focussed on developing strategies </li></ul><ul><li>for education in virtual worlds. </li></ul><ul><li> </li></ul>
  16. ANATOMY OF A WEB MASHUP <ul><li>The blog combines content from a range of sources: </li></ul><ul><li>Blog posts by facilitators in the central column </li></ul><ul><li>Left Hand Column includes links and resources, RSS feeds and other administrative tools </li></ul><ul><li>Right-Hand Column includes images, multimedia content and other dynamically driven data. </li></ul><ul><li>Wordpress Blog Pages to include permanent content and useful resources </li></ul><ul><li>Let’s examine it in a bit more detail! </li></ul>
  17. HOW TO: MASHUP - IMAGES <ul><li>Left Hand Column includes images from the jokaydia Flickr Group which aggregates images from all jokaydia residents. </li></ul>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 @
  18. HOW TO: MASHUP - IMAGES <ul><li>It is important to note here the ability to incorporate images from multiple sources. </li></ul><ul><li>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. </li></ul>
  19. HOW TO: MASHUP – VIDEO AND AUDIO <ul><ul><li>Videos created by our community members are embedded on the Blog’s sidebar and are regularly updated. </li></ul></ul><ul><ul><li> is particularly good at converting and compressing videos in a broad range of formats, and is accessible via most firewalls. </li></ul></ul><ul><ul><li>Users can also locate videos on the website via the jokaydia tag. </li></ul></ul>
  20. HOW TO: MASHUP – SOCIAL BOOKMARKING <ul><li>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. </li></ul><ul><li>New Links from my roll automatically appear in this part of the right-hand column on the blog. </li></ul><ul><li> provides simple ‘Link Roll’ tools that can be used to achieve this technique, aggregating a particular users bookmarks, or a tag collection. </li></ul>
  21. HOW TO: MASHUP – MICROBLOGGING <ul><li>Twitter Tools </li></ul><ul><li>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. </li></ul><ul><li>Twitter provides a quick and easy way to connect to your network and share thoughts, ideas, leads, questions and connections. </li></ul><ul><li>Twitter can also be aggregated to a blog, to provide readers with an ongoing link to your real-time activities. </li></ul>
  22. HOW TO: MASHUP – FACEBOOK <ul><li>Facebook provides a number of different options for creating community and sharing content on your profile. </li></ul><ul><li>It allows you to: </li></ul><ul><ul><li>Post your flickr, blogs and twitter updates on your Facebook Profile </li></ul></ul><ul><ul><li>Create Blog Fan pages using Facebook Apps </li></ul></ul><ul><ul><li>Create Groups to draw Community together. </li></ul></ul>
  23. HOW TO: MASHUP – FACEBOOK <ul><li>In order to promote jokaydia and our resources we use a number of Facebook tools including: </li></ul><ul><ul><li>The jokaydia Facebook Group – a social network for our community to meet, share and connect to our activities </li></ul></ul><ul><ul><li>The jokaydia Facebook Fan Page – a promotional tool to share our services and online presence </li></ul></ul><ul><ul><li>The jokaydia Blog Page – using a Facebook App to share our blog into another network and generate traffic. </li></ul></ul>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
  24. HOW CAN I USE MASHUPS? <ul><li>Mashup Techniques can be used to: </li></ul><ul><ul><li>Create engaging class blogs which combine images, text and links </li></ul></ul><ul><ul><li>Create Learning resources including videos, slideshows and podcasts which combine content from multiple websites and services </li></ul></ul><ul><ul><li>Aggregate content from multiple source – ie. Students blogs, podcasts, vodcasts etc </li></ul></ul><ul><ul><li>Embed engaging content and dynamic content on pages within Learning Management Systems </li></ul></ul><ul><ul><li>Create a PLE – Personalised Learning Environment </li></ul></ul><ul><ul><li>Collaborative Knowledge Creation – gluing together content from multiple educators or students. </li></ul></ul>
  25. WHICH TOOLS? LINKS AND RESOURCES <ul><li>Great spaces to mashup in: </li></ul><ul><ul><li>Edublogs: </li></ul></ul><ul><ul><li>Blogger: </li></ul></ul><ul><ul><li> </li></ul></ul><ul><ul><li> </li></ul></ul><ul><li>Other options include ‘hosting your own’ using the open source Wordpress blogging platform or corporate solutions such as Sydney Institute’s Wordpress install. </li></ul><ul><li>You can also explore freely available spaces like: </li></ul><ul><ul><li>Ning groups: </li></ul></ul><ul><ul><li>Facebook: </li></ul></ul><ul><ul><li>Myspace: </li></ul></ul><ul><ul><li>Wet Paint: </li></ul></ul><ul><li>… ..and many many others! </li></ul><ul><li>It’s important to remember to choose the tools that suit </li></ul><ul><li>you, your organisation and your learners! </li></ul>
  26. WHICH TOOLS? LINKS AND RESOURCES <ul><li>Recommended Tools: </li></ul><ul><ul><li>Flickr – Image Sharing: </li></ul></ul><ul><ul><li> – Video Sharing: </li></ul></ul><ul><ul><li>Twitter - microblogging: </li></ul></ul><ul><ul><li> – social bookmarking: </li></ul></ul><ul><ul><li>Google Calendar – Online Calendar Tool: </li></ul></ul><ul><ul><li>Facebook Groups: </li></ul></ul><ul><ul><li>Feed.informer – RSS feed aggregation: </li></ul></ul><ul><ul><li>Creative Commons Licensing Tools: </li></ul></ul><ul><ul><li>Ustream - Broadcasting to your blog, wiki or learning space: </li></ul></ul><ul><ul><li> - Sharing video from your Mobile phone on your learning space: </li></ul></ul><ul><ul><li> Image and Text Montages: </li></ul></ul><ul><ul><li> Embedding Powepoint Presentations: </li></ul></ul>
  28. CONTACTS <ul><li>The notes and resources for this presentation </li></ul><ul><li>are available online at: </li></ul><ul><li> </li></ul><ul><li>Contact Me: Jo Kay </li></ul><ul><li>Freelance Design, Facilitation and Virtual Worlds </li></ul><ul><li>Email: </li></ul><ul><li> </li></ul><ul><li> </li></ul><ul><li> </li></ul><ul><li> </li></ul>