Tafiti Search Visualization – Overview

If you head over to Codeplex you will find a number of Contoso Quick Applications posted there. Each one demonstrating various aspects of the Windows Live platform and showing you a “real world” style application that makes use of them, along with the source code so that you can easily apply the various techniques to your own web site.

Today another web application has been released. The focus of this application is Silverlight and Windows Live Search. This short article will give you a quick overview of it’s main features without doing a “deep dive” into exactly how it works.

The Context

Most people that I’ve known can relate to this.  You come across a problem and you need to do some online research, say for example, how to integrate Windows Live ID in with your web site. So you hit the Internet and start doing some searches, you find bits of information of one web site, some bits on one blog post, some bits on another. Then you want to find some images for a login and logout button. So you’ve got all these web sites that you need to remember where the information is and you possibly may also need to share you’re research will a fellow worker that’s working on the project with you.

Well this is where Tafiti comes in. Tafiti, which means “do research” in Swahili, is an experimental search front-end from Microsoft, designed to help people use the Web for research projects that span multiple search queries and sessions by helping visualize, store, and share research results. Tafiti uses both Microsoft Silverlight and Live Search to explore the intersection of richer experiences on the Web and the increasing specialization of search. Tafiti is also available as a standalone site for those that don’t want to dig into the code and just use or sample the application first hand, just head over to Tafiti.com.

 initial_screen_thumb Developer

The Deployment Guide

Angus Logan and the crew from SharpLogic have taken a lot of time and effort and created an excellent deployment guide for this Quick Application. Setting it up is slightly more complex than previous Windows Live Quick App’s however the Word document (2007 docx format) included with the download gives you step by step instructions on how to setup and get Tahiti working, including numerous screen shots where applicable. Overall, including registering the application with the search and Windows LiveID sites, setup shouldn’t take you more than 5 minutes.

deployment_guide_thumb Developer  

The Application

When you initially run the application, you will be greeted by a simple search box, in the top left of the application are various links to terms and conditions etc. for this sample application along with a link allowing you to authenticate through Windows LiveID.

So first we sign-in to the application :-

signin_thumb Developer

After logging in you are taken back to the initial search box. Simply enter any search term you like in the search box. This allows for the normal search parameters such as searching for exact phrases surrounded by quotes and exact matches using the “+” sign etc.

liveside%20search_thumb Developer

After you’ve entered a search term you’ll be presented with a screen like above. The main portion of the screen is taken up with the results of your search, the search box has moved over to the left should you want to change your search term. Just below this is an options wheel which I’ll get to in a minute and over on the right is a list of your saved results.  The default search is a web search.

At the top of the search pane you can filter the results on based on another search query, for example, in the main search query I searched on the term “Liveside”, I then filtered the list of results returned on “Angus” and the result was a single article/link :-

filtered%20search_thumb Developer

The filtered search only filters the results that have been returned and are displayed on the page therefore it is very quick to filter.

The Options Wheel

On the left hand side, just below the search box you’ll see the options wheel.

optionswheel_thumb Developer
This gives you various options for defining your search query. The default as mentioned is a standard web search, however here you also have options for searching for pictures, News articles, RSS feeds and to search against your contacts.

Each search term that you enter is saved and is represented on screen by a stack of cards :-

searchcards_thumb Developer

To see a previous search, simply close (Red X in upper left corner) the currently displayed card and the previous search term will appear and the output window will change to reflect this.

Save your search results

On the right hand side of the page, you have 5 “Buckets” in which you can save individual results. For example, if you do a search on Liveside and come across a link you like then simply drag it from the main window over to one of the buckets. The buckets will accept any of the search results, be it a link to a web page from the main web search function, an RSS feed, a picture etc.

buckets_thumb Developer

You can save multiple entries in each bucket, they essentially get stacked and can also label each bucket as a quick reminder. If you have signed in using Windows LiveID, these buckets get saved so that the next time you open the application, your saved searches will re-appear waiting on you.
Clicking on a bucket will show you your saved searches, whether it be articles, pictures etc. or a mixture of each type.

displaysavedsearch_thumb Developer

From here you can either email your saved to results to someone or post the results to your Windows Live Spaces blog site.

Tree View

If you wish something a little more visually exciting for your search results you can select the Tree View link at the top of the main search results list.

treeview_thumb Developer

The result of which is that your search results are displayed on a slowly rotating tree. This only works for standard Web searches and not for any of the other options in the Options Wheel.
Along the bottom is a slider where you can increase or decrease the number of results displayed.
A button in the top left takes you back to the sites main search page and a button in the top right displays the tree view results page full screen, essentially turning it into an interactive screen saver (although not secure as you simply press “ESC” to return back to normal).

What’s Next?

The Tafiti Quick Application shows you some best practices and examples of how to integrate Windows Live Search and Windows LiveID with your Silverlight application. Next we will be taking a more in-depth look at this application and breaking down in a series of “deep dive” articles, so stay tuned.