Module 4: Web 2.0

Carlos Delgado Kloos Dep. Ing. Telemática Universidad Carlos III de Madrid

From Feeds to Blogs

Carlos Delgado Kloos Dep. Ing. Telemática Universidad Carlos III de Madrid

© Carlos Delgado Kloos, UC3M 2004 1 Blogs

 Web-logs

 Based on the concept of RSS feeds – The notion of time is key

MIIT 2009/10: GIMI 4: Web 2.0 3

Blogging sites

 Applications  Services – Drupal – Blogger – Elgg – Typepad – Joomla! – Wordpress – Movable Type – … – Wordpress – …

MIIT 2009/10: GIMI 4: Web 2.0 4

© Carlos Delgado Kloos, UC3M 2004 2 Terms

 Permalink – Permanent link (of a post)  Comments – Replies to a blog post  Blogroll – List of (other) blogs on a blog  Linkback – Notification about a page being linked – 3 methods: Refback, Trackback, Pingback  Blogosphere – The set of all blogs

MIIT 2009/10: GIMI 4: Web 2.0 5

Blog Search Engines

 Technorati – www.technorati.com

 Blog search engine – www.blogsearchengine.com

 BlogScope – www.blogscope.net

 Google blog search – blogsearch.google.com

MIIT 2009/10: GIMI 4: Web 2.0 6

© Carlos Delgado Kloos, UC3M 2004 3 From Blogs to Microblogs

Carlos Delgado Kloos Dep. Ing. Telemática Universidad Carlos III de Madrid

Microblogs

 Limited-length posts

 Relevant or irrelevant information

MIIT 2009/10: GIMI 4: Web 2.0 8

© Carlos Delgado Kloos, UC3M 2004 4 Content

MIIT 2009/10: GIMI 4: Web 2.0 9

Microblog sites

MIIT 2009/10: GIMI 4: Web 2.0 10

© Carlos Delgado Kloos, UC3M 2004 5 Twitter

 twitter.com

 “the SMS of the Internet”

 140 characters (compatibility with SMS)

 Key people – Jack Dorsey – Evan Williams – Biz Stone

MIIT 2009/10: GIMI 4: Web 2.0 11

Twitter in the media

 TIME magazine cover story – “How Twitter will change the way we live” – www.time.com/time/business/article/ 0,8599,1902604,00.html  Sports Illustrated – “Twitter craze is rapidly changing the face of sports” – sportsillustrated.cnn.com/2009/writers/ the_bonus/06/05/twitter.sports/  IEEE Internet Computing – “Information overload: 140 characters at time” – Jul-Aug 2009

MIIT 2009/10: GIMI 4: Web 2.0 12

© Carlos Delgado Kloos, UC3M 2004 6 Twitter by Dilbert

MIIT 2009/10: GIMI 4: Web 2.0 13

Twitter clients

See also: http://www.twitstat.com/twitterclientusers.html MIIT 2009/10: GIMI 4: Web 2.0 14

© Carlos Delgado Kloos, UC3M 2004 7 Browser add-ons

 Power twitter

 https://addons. mozilla.org/ en-US/firefox/ addon/9591

MIIT 2009/10: GIMI 4: Web 2.0 15

Other twitter-related tools

 tweetit.net  twitthis.com

MIIT 2009/10: GIMI 4: Web 2.0 16

© Carlos Delgado Kloos, UC3M 2004 8 Terminology

 #topic (hash tag): topic that can be searched – See also http://www.hashtags.org

 @user: addressing a specific user

 RT message: re-tweet – Recently changed retweeting to new way

 D user: direct message to user

MIIT 2009/10: GIMI 4: Web 2.0 17

Microblogging

 The real-time web

MIIT 2009/10: GIMI 4: Web 2.0 18

© Carlos Delgado Kloos, UC3M 2004 9 Real Time Search

 Scoopler scoopler.com

 Topsy topsy.com

 OneRiot oneriot.com

 TweetMeme tweetmeme.com

 Twazzup twazzup.com

 Collecta collecta.com

 CrowdEye crowdeye.com

MIIT 2009/10: GIMI 4: Web 2.0 19

Flyar

 ww2.ydreams.com/flyar

MIIT 2009/10: GIMI 4: Web 2.0 20

© Carlos Delgado Kloos, UC3M 2004 10 Twittervision

 beta.twittervision.com

MIIT 2009/10: GIMI 4: Web 2.0 21

Flickrvision

 www.flickrvision.com

MIIT 2009/10: GIMI 4: Web 2.0 22

© Carlos Delgado Kloos, UC3M 2004 11 Wikipediavision

 Anonymous edits to Wikipedia in real-time

 www.lkozma.net/wpv

MIIT 2009/10: GIMI 4: Web 2.0 23

From Widgets to Mashups

Carlos Delgado Kloos Dep. Ing. Telemática Universidad Carlos III de Madrid

© Carlos Delgado Kloos, UC3M 2004 12 Mashups

 A mashup is a web application that combines data from more than one source into a single integrated tool.  A typical example is the use of cartographic data from Google Maps to add location information to real-estate data from Craigslist, thereby creating a new and distinct web service that was not originally envisaged by either source. -- Wikipedia

MIIT 2009/10: GIMI 4: Web 2.0 25

Examples of Mashups

 www.programmableweb.com/mashups

 www.webmashup.com  mashupawards.com  www.jumpcut.com/view?id= C086AA92568811DCAB02000423CF381C  www.youtube.com/ watch?v=-GeU3Rp7wnY

MIIT 2009/10: GIMI 4: Web 2.0 26

© Carlos Delgado Kloos, UC3M 2004 13 New mashups in

 Growth

MIIT 2009/10: GIMI 4: Web 2.0 27

Mashup, Widget?

 So, what are the differences and commonalities between mashups and widgets?

MIIT 2009/10: GIMI 4: Web 2.0 28

© Carlos Delgado Kloos, UC3M 2004 14 Mashups vs. Widgets

MIIT 2009/10: GIMI 4: Web 2.0 29

Mashup Widget

MIIT 2009/10: GIMI 4: Web 2.0 30

© Carlos Delgado Kloos, UC3M 2004 15 Mashup Platforms

 Yahoo! Pipes – pipes.yahoo.com  Google MashupEditor – editor.googlemashups.com  Microsoft Popfly – www.popfly.ms  IBM Alphaworks – services.alphaworks.ibm.com

MIIT 2009/10: GIMI 4: Web 2.0 31

Mashup Platforms

 Mozilla Ubiquity • ubiquity.mozilla.org

MIIT 2009/10: GIMI 4: Web 2.0 32

© Carlos Delgado Kloos, UC3M 2004 16 Yahoo! Pipes

 pipes.yahoo.com  Like Unix pipes, simple commands can be combined together to create output that meets your needs: – combine many feeds into one, then sort, filter and translate it. – geocode your favorite feeds and browse the items on an interactive map. – power widgets/badges on your web site. – grab the output of any Pipes as RSS, JSON, KML, and other formats.

MIIT 2009/10: GIMI 4: Web 2.0 33

Yahoo! Pipes

MIIT 2009/10: GIMI 4: Web 2.0 34

© Carlos Delgado Kloos, UC3M 2004 17 Data Types

 datetime  items – utime: 1188419280 – structured lists of data,  location containing – London (quality!) – for an RSS feed:  number • title, description, link, – 5 pubDate  text – for googlebase: – hello • category, location, description, expiration  url date – http://mac.com

MIIT 2009/10: GIMI 4: Web 2.0 35

Source Modules

( items) MIIT 2009/10: GIMI 4: Web 2.0 36

© Carlos Delgado Kloos, UC3M 2004 18 Transformation Modules

(items  number)

(items  items)

MIIT 2009/10: GIMI 4: Web 2.0 37

Data Modules

Parameters

MIIT 2009/10: GIMI 4: Web 2.0 38

© Carlos Delgado Kloos, UC3M 2004 19 Google Mashup Editor

 code.google.com/gme  editor.googlemashups.com/editor  Google MashupEditor is an AJAX development framework and a set of tools that enable developers to quickly and easily create simple web applications and mashups with Google services like Google Maps and Google Base.  Google Mashup Editor is a great tool for grabbing information from feeds and letting users see and manipulate it.

MIIT 2009/10: GIMI 4: Web 2.0 39

Google Mashup Editor

MIIT 2009/10: GIMI 4: Web 2.0 40

© Carlos Delgado Kloos, UC3M 2004 20 Structure

MIIT 2009/10: GIMI 4: Web 2.0 41

Example 1

Hello World!

story title

digg count

MIIT 2009/10: GIMI 4: Web 2.0 42

© Carlos Delgado Kloos, UC3M 2004 21 Example 1

Hello World!

story title

digg count

MIIT 2009/10: GIMI 4: Web 2.0 43

Example 1

Hello World!

story title

digg count

MIIT 2009/10: GIMI 4: Web 2.0 44

© Carlos Delgado Kloos, UC3M 2004 22 Example 1

Hello World!

MIIT 2009/10: GIMI 4: Web 2.0 45

Example 1

Hello World!

MIIT 2009/10: GIMI 4: Web 2.0 46

© Carlos Delgado Kloos, UC3M 2004 23 Example 1

Hello World!

MIIT 2009/10: GIMI 4: Web 2.0 47

Example 1

Hello World!

MIIT 2009/10: GIMI 4: Web 2.0 48

© Carlos Delgado Kloos, UC3M 2004 24 Example 1

MIIT 2009/10: GIMI 4: Web 2.0 49

Example 2

MIIT 2009/10: GIMI 4: Web 2.0 50

© Carlos Delgado Kloos, UC3M 2004 25 Example 2

MIIT 2009/10: GIMI 4: Web 2.0 51

Example 3

MIIT 2009/10: GIMI 4: Web 2.0 52

© Carlos Delgado Kloos, UC3M 2004 26 Example 3

MIIT 2009/10: GIMI 4: Web 2.0 53

Example 3

MIIT 2009/10: GIMI 4: Web 2.0 54

© Carlos Delgado Kloos, UC3M 2004 27 MS Popfly

 www.popfly.ms, www.popfly.com

 Popfly is the fun and easy way to build and share mashups, gadgets, and Web pages.

 It’s made up of online visual tools for building Web pages and mashups and a social network where you can host, share, rate, comment and even remix creations from other Popfly users. -- Microsoft

MIIT 2009/10: GIMI 4: Web 2.0 55

MS Popfly

MIIT 2009/10: GIMI 4: Web 2.0 56

© Carlos Delgado Kloos, UC3M 2004 28 MS Silverlight

 silverlight.net  Microsoft® Silverlight™ is a cross-browser, cross-platform plug-in for delivering the next generation of .NET based media experiences and rich interactive applications for the Web.  Silverlight offers a flexible programming model that supports AJAX, VB, C#, Python and Ruby, and integrates with existing Web applications. --Microsoft

MIIT 2009/10: GIMI 4: Web 2.0 57

MS Silverlight

MIIT 2009/10: GIMI 4: Web 2.0 58

© Carlos Delgado Kloos, UC3M 2004 29 IBM Alphaworks

 DAMIA

 QEDWiki

 IBM Mashup Center

MIIT 2009/10: GIMI 4: Web 2.0 59

IBM DAMIA

 services.alphaworks.ibm.com/damia  Through a Web-based interface, IBM DAMIA provides easy-to-use tools that developers and IT users alike can use to quickly assemble data feeds from the Internet and a variety of enterprise data sources.  The benefits of this service include the ability to aggregate and transform a wide variety of data or content feeds, which can be used in enterprise mashups. --IBM

MIIT 2009/10: GIMI 4: Web 2.0 60

© Carlos Delgado Kloos, UC3M 2004 30 IBM DAMIA

MIIT 2009/10: GIMI 4: Web 2.0 61

IBM QEDWiki

 services.alphaworks.ibm.com/qedwiki/  QEDWiki is a browser-based assembly canvas used to create simple mashups. A mashup maker is an assembly environment in which the creator of a mashupuses software components (or services) made available by content providers.  QEDWiki is a unique Wiki framework in that it provides both Web users and developers with a single Web application framework for hosting and developing a broad range of Web 2.0 applications --IBM

MIIT 2009/10: GIMI 4: Web 2.0 62

© Carlos Delgado Kloos, UC3M 2004 31 IBM QEDWiki

 www.youtube.com/watch?v=63qIq9t9Gqs

MIIT 2009/10: GIMI 4: Web 2.0 63

Mozilla Ubiquity

 Firefox extension

 ubiquity.mozilla.com

 labs.mozilla.com/2008/08 /introducing-ubiquity/

 wiki.mozilla.org/Labs/Ubiquity

MIIT 2009/10: GIMI 4: Web 2.0 64

© Carlos Delgado Kloos, UC3M 2004 32 Other Mashup Platforms

 fwicki.com

 jackbe.com

 openkapow.com

MIIT 2009/10: GIMI 4: Web 2.0 65

From Widgets to Mashups

Carlos Delgado Kloos Dep. Ing. Telemática Universidad Carlos III de Madrid

© Carlos Delgado Kloos, UC3M 2004 33