Microsoft Popfly - A use-case illustration

From now on, I am extending the scope of my blog from just Blogger hacks to include technology reviews also. I am planning to sign up for invite-only and beta websites/services and write posts describing the usage of the website or service (with illustrations). This is to give you an idea of what they have got to offer early enough. To start with, I am covering the Microsoft Popfly Alpha mashup and website building service for non-techies. As the service is in private alpha, you need to sign-up with your email id and they send you an invitation after some time.

Once you got the invitation and logged in to the website, you will see three options:

• Create a webpage with the wysiwyg editor (no html knowledge required)
  
• Create a mashup using the various web services available (no need to code)
• Share your projects with others in the community
  

As WYSIWYG website building is not something new, I will walk you through the mashup creation only.


Microsoft provides a list of pre-built blocks to create mashups. Predominantly there are two types of blocks:

• Data producer blocks such as Flickr, Facebook, RSS that provide photos, feeds etc as output.
• Data consumer blocks such as PhotoTiles, Slideshow, NewsReader that take the data produced and display it in a nice way using slideshows, tiled display etc.
  

Here, the use-case that I am going to demonstrate is to obtain photos from Flickr and show them in a nice tiled fashion. I first select a data producer block by selecting the Flickr block.


I get a red-colored box like this for flickr (which actually rotates upon mouseover!). The message "You have a key" below the box indicates that I have provided an API key from flickr to authorize my usage. Before providing the key, you will see an error "Missing key".

Click on the Missing key message and you will get this lightbox to input the key. You can use my key if you don't want to obtain a new one from Flickr (0659eaf9c8e9830405cd87f5ccfa7dcb).

Once the key issue is resolved, you can click on the tool-like icon to the right of the block to edit the settings of the block. You will get something like this where you can edit the text that you want to search with and the number of photos that you want the block to output. After editing, click the big-size tool icon to go back.

Next, I will add another block that will display the photos nicely. You can search the blocks with the term 'photo' and you will see a few blocks named Photoshow, Photosphere etc. The one I liked (and the one that worked well) is PhotoTiles. So, I selected it.


And the block shows up in the canvas. Ignore the default display in the background (they should fix it, it's annoying!).


And the way you connect them, is by clicking on the blue-colored output point of flickr block and then clicking the yellow-colored input point of PhotoTiles block. A line forms between them indicating that they're connected (I wonder how Yahoo Pipes did the same too! Maybe this is the most logical representation).


Now if you click on "Preview", you can see the final result of your mashup. It will be something like shown below. You can click on any individual photo and it will be displayed bigger. (Clicking on customize at the bottom will take you back to the canvas).

After saving the mashup, you need to share the mashup if you need options like "embed it in your website", "Download as Gadget" etc. It will provide you with an iframe code to embed your creation to your blog or website.


You can see the mashup embedded in my blog in the second column. This is very simple mashup that I created with Popfly. It is possible to combine the data from many services and create complicated mashups. Here are my opinions about Popfly based on my experiments.

Pros:

• Stunning user interface using their Silverlight platform.
• Once you create your mashup, you can create a website also with Popfly to embed the mashup in (I will check if there's anything to write about regarding the website building option).
  

Cons:

• Pages load terribly slowly, maybe because Silverlight is heavy. They should really improve the speed if they expect serious development with Popfly. Even the popfly widget in my blog will load very slowly!
• I don't see any equivalent for the built-in operations like Sorting, Filtering etc that are supported by Yahoo Pipes.

Coming soon:

• Review of the beta release of MyLiveSearch, a new search engine effort claiming to be an innovative approach never done before.
• Review of the beta release of Radar Networks' semantic web services product.