MASHUPS Mashups = Remixed Data Data + APIs Data + Other Data Data + Functionality

Mashups: Why? "We know we don't have a corner on creativity. There are creative people all around the world, hundreds of millions of them, and they are going to think of things to do with our basic platform that we didn't think of. – Vint Cerf Vint Cerf

A mashup is a Web page or application that uses and combines data, presentation or functionality from two or more sources to create new services. The term implies easy, fast integration, frequently using open API ( Application Programming Interface) and data sources to produce enriched results that were not necessarily the original reason for producing the raw source data. Mashup

Allow information to be viewed from different perspectives (e.g., view real estate data on a map) Combine data from multiple sources into a single unified view (e.g., compare gas prices in the neighborhood). Enrich raw data with new information (e.g., view eBay real estate auction along with Amazon) Good ideas behind Mashup

Mashups have recently exploded on the web, for two main reasons. First, many of the major internet companies, such as Yahoo!, Google, and Amazon,have opened up their data to be used with other data sources without a lengthy licensing negotiation. In just a minute or two, you can set up and use the data resources they make available. The other reason for this rapid growth is the advent of new tools that make creating mashups easy for anyone, regardless of their technical know-how.

a)Web Portals: Yahoo! provide information of different kinds under a single unified theme. Recent Common Services! (Similar to mashup)

b) Web Information Aggregators: (MySimon) etc. provide price comparison services for many products. Recent Common Services! (Similar to mashup) c) RSS (Really Simple Syndication): collect feeds from different news sites to create a news channel.

Web Portals & Web Information Aggregators vs. Mashups

Mashups have several different colloquial interpretations, which has resulted in some confusion regarding the term and its use. Mashup Types

1. Mapping mashups Mapping mashup allow users to navigate most of the globe through a Web interface, viewing varying levels of resolution through maps, satellite imagery, or a combination. One of the big catalysts for the advent of mashups was Google's introduction of its Google Maps API. This opened the floodgates, allowing Web developers to mash all sorts of data onto maps.

2. Video and photo mashups The emergence of photo hosting and social networking sites like Flickr with APIs that expose photo sharing has led to a variety of interesting mashups. Because these content providers have metadata associated with the images they host (such as who took the picture, what it is a picture of, where and when it was taken, and more), mashup designers can mash photos with other information that can be associated with the metadata.

3. Search and Shopping mashups To facilitate mashups and other interesting Web applications, consumer marketplaces such as eBay and Amazon have released APIs for programmatically accessing their content. Hundreds of shopping mashups exist ranging from commercial desktop applications to comparison shopping web sites to whimsical hacks.

4. News mashups News sources (such as the New York Times, the BBC, or Reuters) have used syndication technologies like RSS since 2002 to disseminate news feeds related to various topics. Syndication feed mashups can aggregate a user's feeds and present them over the Web, creating a personalized newspaper that caters to the reader's particular interests.

A mashup application is architecturally comprised of three different participants that are logically and physically disjoint (they are likely separated by both network and organizational boundaries): API/content providers, the mashup site, and the client's Web browser. Mashup architecture

The API/content providers. These are the providers of the content being mashed. It denotes the process by which a tool attempts to extract information from the content provider by attempting to parse the provider's Web pages. The mashup site. This is where the mashup is hosted. Interestingly enough, just because this is where the mashup logic resides, it is not necessarily where it is executed. On one hand, mashups can be implemented similarly to traditional Web applications using server-side dynamic content generation technologies like Java servlets, PHP or ASP. The benefits of client-side mashing include less overhead on behalf of the mashup server (data can be retrieved directly from the content provider). The client's Web browser. This is where the application is rendered graphically and where user interaction takes place.

Microsoft Popfly: Microsoft Popfly is Microsoft's Mashup Editor. Its very useful to an end-user and requires little technical understanding. Popfly is built on Microsoft Silverlight. Mashup tools

Yahoo Pipes: Yahoo Pipes is Yahoo's flash-based tool to aggregate, manipulate, and mashup content from around the web. Yahoo Pipes was one of the first mashup editing tools to come out. It appears to be targeted to the slightly more technical people. However it has a drag-drop interface. Its quite easy to use. Mashup tools

Google Mashup Editor: The Google Mashup Editor (GME), is defiantly the most advanced out of all the ones. Most powerful, and It's basically got a tag based markup language, that lets you also embed HTML into your results. Mashup tools

Innovation potential: fusion of multiple services. More services at a low cost with reusable components. Use of Open APIs: allow to diffuse content of service adapted to the needs of users. Security problems: aggregation of own site with application coming from unknown source using APIs not fully understood by developer. Pros and Cons

Itinerary Planner Mashup (IPM). IPM is a Single-page application that allows users to create an itinerary of the destinations (cities) that they plan to visit and display these destinations on a map. Users can display additional information about each destination including weather data (derived from Yahoo Weather RSS feeds) and other local information (derived using the Google Ajax Search API). Itinerary Planner: A Mashup Case Study

1.User Interface Design The Trip Planner floating pane allows users to type the country name into a combo box widget; the Trip Planner then populates the list-box with the list of major cities and charts the route on the map as illustrated in the Figure below. When users select (click on) a place marker on the map, the application displays the current weather information using the Yahoo weather RSS feeds. Itinerary Planner: A Mashup Case Study

Selecting a destination from the list-box and clicking the Google icon causes the application to launch a new floating pane containing the search results that relate to the selected destination. The search floating pane includes Video, Blog, News, Book, Local and Web results as shown in the Figure below. The place markers on the map are numbered according to the order specified in the Trip Planner list and the colors indicate the start (green) and end (red) of the trip. Itinerary Planner: A Mashup Case Study

2. Data Integration Design The Google Maps API retrieves Google Maps, the Google Ajax Search API allows customized display of Google Search results and the Yahoo RSS Weather feeds provide the current weather and forecast information. While the Google Maps API and the Google Ajax Search API are accessed directly by the client-side Javascripts, the Yahoo RSS feeds are retrieved by a server-side PHP script. The PHP XML_RSS Parser was used to process the RSS feeds Itinerary Planner: A Mashup Case Study

Web Mashup genres Mapping mashups Google Maps, Yahoo Maps, Microsoft Virtual Earth Video and photo mashups Flickr, Youtube Search and Shopping mashups eBay, Amazon News mashups Diggdot.us= Digg.com + Slashdot.org + Del.icio.us Example:

Mashup Editors Google Mashup Editor Microsoft Popfly Yahoo pipes IBM Assemble Zero Web application from Yahoo! With GUI for building Mashup applications Combine many feeds into one, then sort, filter and translate it Geocode favorite feeds and browse the items on an interactive map. Grab the output of any Pipes as RSS, JSON, KML, and other formats You can publish your pipes and share with others