Archive of published articles on March, 2007

Back home

Elastic Lists – Visualizing Metadata

29/03/2007

image This project is an example of the “elastic list” principle for browsing multi-facetted data structures. The data is based on the Noble prize winners dataset used in the Flamenco facet browser. Elastic lists enhance traditional facet browsing approaches by, visualizing relative proportions (weights) of metadata values by size, visualizing unusualness of a metadata weight by brightness and animated filtering transitions. To use the application click any number of list entries to query the database for a combination of the selected attributes. If you create an “impossible” configuration, your selection will be reduced until a match is possible. You can also switch on little sparklines to see the temporal distribution of each metadata value. While I’ve seen this concept used several times before the elastic list interface was very fresh. Thanks!

Read more

No Comments

Twittervision – Geographic Twitter Visualization

23/03/2007

image Twittervision is a real-time geographic visualization of posts to Twitter. The application is basically a mash-up of the Twitter API and Google Maps. The interaction is smooth and fast and gives you a great vision into who’s Twittering around the world and at what speed. If you’re as big of a fan of Twitter as I am you spend far too much time viewing the Twitter map. In order to try out the application just sign up for twitter and post. You must have a location and an image defined to appear on the public feed (and to be located on the map). Hats off to David Troy who spent his free time to develop this fun visualization of Twitter.

Read more

No Comments

Max Kiesler’s Post on Wired.com

17/03/2007

Thanks to Michael Calore of wired.com for featuring my post ” Round-up of 30 AJAX Tutorials ” on Webmonkey’s blog Monkey Bites.

No Comments

Validate.js

6/03/2007

AJAX routine to validate form based input. The script is easy to use and works on everything I’ve tried it on. If you use forms and AJAX on your website you should check this one out.

Website: http://www.mutationevent.com/projects/validate.js/index.php

No Comments

ScreenVader – Algorithmic Music, Images and Video

6/03/2007

image In many ways this site feels like an exploration. There is no about section or faqs, so when you arrive you’re not really sure what to expect. As I found out, it turned out to be a wonderful visual experience. The site provides several free software packages that allow you to compose algorithmic music, image and video presentations. The results are stunning as you will see from the examples on the site. While it takes a little getting use to, the flash based navigation is fun easy to use. The downloads are available for Mac and PC.

Read more

No Comments

20 Trusted AJAX, DHTML and JavaScript Tool Sites

6/03/2007

I started posting about AJAX shortly after the term was coined by AdaptivePath’s Jesse James Garrett in 2005, and in the beginning most of the examples, tutorials and references were produced by programers interested in the subject. Today many of the so-called AJAX, DHTML and Javascript sites are splogs, or other types of traffic generating ad platforms. My question is always who can I trust for tested quality scripts and tools? While there are probubly hundreds of trustworthy sites out there these are the ones I go to when I’m looking for ideas and inspiration. This is not the definitive list of trusted sites so if you have a site you trust for AJAX, DHTML and Javascript tool please let myself and the community know of them through the comments section of this post. Thanks to all of the individuals who spent their free time to put up these wonderful resources.

AJAX Tools

AJAX Patterns
AjaxPatterns.org began as a collection of design patterns, which formed the basis of the book, Ajax Design Patterns, and grew into a publicly editable wiki on anything and everything Ajax. All pages (except this homepage) are now editable, no registration required. Feel free to contribute!

FiftyFourEleven
Ajax examples (XMLHttpRequest examples), code snippets and proof of concepts – the links below should help get you started on building your own functions with XMLHttpRequest and Ajax.

Google Web Toolkit – Build AJAX apps in the Java language
Google Web Toolkit (GWT) is an open source Java software development framework that makes writing AJAX applications like Google Maps and Gmail easy for developers who don’t speak browser quirks as a second language. Writing dynamic web applications today is a tedious and error-prone process; you spend 90% of your time working around subtle incompatibilities between web browsers and platforms, and JavaScript’s lack of modularity makes sharing, testing, and reusing AJAX components difficult and fragile.

Kabuki Ajax Toolkit
The Kabuki Ajax Toolkit (AjaxTK) is now available for separate download for object-oriented UI programmers that want to deliver some of that Zimbra Ajax richness within their own web applications.

MiniAjax
A showroom of nice looking simple downloadable DHTML and AJAX scripts.

Moo.ajax
Moo.ajax is a very simple ajax class, to be used with prototype.lite from moo.fx. It’s roughly based on the prototype one, so their usage are very similar.

Nomadic Functions
Why include ten .js files (ala Yahoo UI) to create one simple effect? This may be a drastic example, however, in any case, even when using MooFX’s small 2k library you are including a lot of filler code. What’s the solution? Nomadic Functions. Nomadic functions are small, optimized, and fairly specific. An example may be anything from a simple Drag & Drag function, to a AJAX Star Rating, or a Text Scroller. They are like widgets… but even smaller.

Oracle – Web 2.0 and Ajax Resources
On this website you will find hype free Ajax and Web 2.0 collateral, samples and pointers that you will find useful when building web applications today. In addition to having a strong focus on today’s Web 2.0 technologies and Ajax, this page will also expose component information, best practices and hints and tips about the ADF Faces Rich Client components in JDeveloper 11.

Sun – Ajax Developer Resource Center
Details on AJAX App Development, Free Articles, Tips, Tools & More.

Yahoo! User Interface Library
The Yahoo! User Interface (YUI) Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML and AJAX. The YUI Library also includes several core CSS resources.

DHTML Tools

DhtmlGoodies

DhtmlGoodies was launched the 6th of September 2005. The site is developed and maintained by Alf Magne Kalleland from Norway. The purpose of this site is to provide you with a library of well working DHTML and AJAX scripts.

Dthmlsite
At DHTMLSite, you will find a directory of useful AJAX/DHTML scripts and tutorials.

Dynamic Drive
One of the largest and best places on the internet to find DHTML scripts and tutorials.

Javascript Tools

DZone Snippets – Javascript
Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Face
FACE was developed to allow standards-compliant web developers to put more life and energy into their pages, without having to learn Javascript or Flash: all it takes is basic math skills and a good understanding of CSS. FACE is built entirely from JavaScript and the CSS that you provide to control the animation.

Javascript Toolbox
This site is intended to be a repository of code and reusable libraries which address common needs that many web developers encounter. The code found here is based on standards but also tries to be backwards-compatible for browsers which don’t support the standards. The information on the site emphasizes standards-compliance for best results, and best practices which should be followed. This is not a site containing snippets of code submitted by anonymous, unreliable coders. All code on the site is written by one person, in a consistent fashion, tested thoroughly, and used in practice by thousands of web sites around the world.

PublicWarehouse – Javascript Database
An amazing list of scripts in almost any category you can think of.

Remedial JavaScript
The JavaScript Programming Language suffers from premature standardization. Some feature omissions can be corrected by adding new functions and basic methods to our standard programming toolkit. That is what we will be doing here. There are functions that I feel should have been in the Standard and required in every implementation. Fortunately, JavaScript is such an expressive language that we can easily fix the omissions locally.

Ten Javascript Tools Everyone Should Have

Javascript frameworks have exploded on the scene over the last few years but they’re no replacement for a good toolbox: those little snippets of code you seem to include in every single project. Here’s my list of 10 essential Javascript tools everyone should have at their fingertips!

Top 10 Custom JavaScript Functions of All Time
If there was ever a universal common.js shared among the entire develosphere, you’d fine these ten (plus one bonus) functions. It would be the swiss army knife no developer would go into production without. They have no doubt been tested tried and true and have proven usefulness and helpfulness to all those who’ve used them. So without further ado, here are what I believe to the top ten greatest custom JavaScript functions in use today.

No Comments

Highslide JS

5/03/2007

Highslide JS is a piece of JavaScript that streamlines the use of thumbnail images on web pages. The library offers these features and advantages, no plugins like Flash or Java required. Popup blockers are no problem. The images expand within the active browser window. Single click. After expanding the image, the user can scroll further down or leave the page without restoring the image. The approach uses two separate images. No heavy full-size image packed into thumbnail display size! The full-size image is loaded in the background either on page load or when the user clicks the thumb. You specify this option in the script’s settings. Compatibility and safe fallback. If the user has disabled JavaScript or the JavaScript fails in any way, the browser redirects directly to the image itself. This fallback is able to cope with most exceptions and incompatibilities.

Website: http://vikjavev.no/highslide/

No Comments

Box Grid – Blog Content Visualization

5/03/2007

image As I’ve mentioned in earlier posts I’m very interested in new ways to present blog content. Data streams, attention data and rss blending all address this issue, however, they all still relay on activities presented in a liner fashion. While the standard blog layout works well for discovery I’m wondering if there is a way to display blog data in a new paradigm . Box Grid was originally developed as an experimental blog site. The two things I find most fascinating about Box Grid are the fact that it was originally released in 2002, and that does not use flash. The interface is all CSS and javascript based. While this type of content visualization will not work for every blog it’s a place where we can start to imagine new ways to surf a blog. The source code is also downloadable!

Read more

No Comments

Breathing Earth – What’s Your Countries Impact?

4/03/2007

image This visualization shows the carbon dioxide emission levels for every country in the world, as well as their birth and death rates – all in real-time. The site was created by David Bleja (a.k.a. Stillwater). All of the data used in the visualization comes from the World Factbook and the United Nations. To see it in action just mouse over any country and the application will display population, CO2 emissions, death and birth rates. Another column keeps a running tally of CO2 emissions, death and birth rates for the world in the time you’ve been on the site. This is a very insightful way to show the impact different countries have on climate change.

Read more

No Comments

Quintura Kids – Child Friendly Search Visualization

3/03/2007

image If you have children you know that many search engines retrieve sites you may not want them to see. If you’re a kid you know how boring most search engines can be. “Quintura, Inc. is the next-generation web search company that was launched with a mission to make Web search easier and faster by adding context or meaning to keywords and visualizing search. The patent-pending technology of Quintura is based on over a decade of the founders’ innovative research and development in the area of neural network and artificial intelligence”. Quintura also has a wonderful search for standard use, and a women’s version is planned soon. So far I love both versions that are public.

Read more

No Comments

Greatfirewallofchina – Is Your Website Censored?

2/03/2007

image This is a site which lets you see in real-time if any website is blocked or censored in China. They’ve created a website in China and they route your url request on greatfirewallofchina.org through to their server in China. The server in China opens the url and the result is send back. Their testing is only based on one server on one location in China. They do have different backup servers in different locations in China in case one goes down. Other locations and other servers may give you different access to the various websites. While the animation is really just an activity indicator, I felt it was an effective way of showing not only that there was something load, but also a sense of what I was waiting for (e.g. waiting for the server connections in each country). Nice job!

Read more

No Comments

Really easy field validation

1/03/2007

Here’s a form validation script that is very easy to use. The basic method is to attach to the form’s onsubmit event, read out all the form elements’ classes and perform validation if required. If a field fails validation, reveal field validation advice and prevent the form from submitting.

Website: http://tetlaw.id.au/view/javascript/really-easy-field-validation

No Comments

ClickHeat

1/03/2007

ClickHeat is a downloadable visual heatmap of clicks on a HTML page, showing hot and cold click zones. Key features include, low logging activity: a very few function calls to log a click, no server load rise should be noticed; a keyword is used to define the page upon Javascript code load, allowing you to group same pages and Screen sizes and browsers are logged, making possible the tracking of liquid-layouts.

Website: http://www.labsmedia.com/clickheat/

No Comments

Visuwords

1/03/2007

image Visuwords online graphical dictionary is a way to look up words to find their meanings and associations with other words and concepts. Produce diagrams reminiscent of a neural net. Learn how words associate. Visuwords uses Princeton University’s WordNet, an opensource database built by University students and language researchers. Combined with a visualization tool and user interface built from a combination of modern web technologies, Visuwords is available as a free resource to all patrons of the web. To use the dictionary just enter words into the search box to look them up or double-click a node.

Read more

No Comments