In the past, I have profited immensely from using open source projects, foremost flare, but also many other libraries. I would like to give something back by open sourcing my favorite toy, the Elastic Lists project on github: github.com/MoritzStefaner/Elastic-Lists.

Have fun with it! Please keep in mind I am not a developer by training and these are side projects. Especially excuse the sketchy documentation. So if you start working with the code, and run into issues, feel free to file bug reports or add questions to the FAQ.

Heck, and while I am at it, why not publish revisit as well: github.com/MoritzStefaner/revisit

In its five years of existence, the see conference managed to bring quite a few of the most exciting speakers from design, art, architecture and new technologies on stage to talk about their perspective on information visualization.

This year’s conference takes place on April 17, 2010 at the Kulturzentrum Schlachthof Wiesbaden (Germany) and features the following line-up:

• Gideon Obarzanek, the founder of Chunky Move, an Australian dance company known for “genre-defying dance performance”
• Joshua Prince-Ramus, President of REX, a cutting-edge architecture firm
• Nicholas Felton (feltron.com), a New York based information designer, co-founder of daytum.com and probably best known for his personal annual reports
• Hannes Koch from rAndom International, a London-based art and design collective
• Kent Demaine from OOOii, who design future interfaces for Hollywood and, among others, brought us the visionary interface design for Minority Report
• and amystery keynote speaker. (I love mysteries!)

Some tickets are still left, but not terribly many, so better register sooner than later. For those of you who cannot make it, there will be a live video stream of the event, and archived video recordings later. The recorded talks of the past conferences are well worth a visit too, with speakers ranging from Casey Reas over Carsten Nicolai to Stamen’s Eric Rodenbeck, Ben Fry, Zachary Lieberman and many more.

Everybody complains that art, design and research in information visualization should be talking more to each other.

Here is a unique opportunity: Andrew Vande Moere and I will be hosting a symposium at IV10: DAVis, the 5th International Symposium on Design and Aesthetics in Visualisation.

From the call:

“This symposium aims to bring together researchers and practitioners of design, art and related disciplines. The goal is to share their stories and experiences on how the needs and goals of both users and businesses are met through information visualisation.

It supports the publication of research in two general domains: Design and Aesthetics. Design refers to the development of visualisation as a creative design process. Aesthetics refers to the role of user experience in visualisation, as understood in three distinct components: aesthetic experience, experience of meaning, and emotional experience.

This symposium presents an opportunity to explore these issues and their consequences for the field of information visualization. In particular, we encourage the submission of design critiques; case studies, possibly with accompanying evaluation studies or critical reflections; position papers; or reports on the impact that visualization research or visualization use has had on the work and life of people. In this context, the story of failures or abandoned approaches can be as informative as descriptions of success. The fields of application are open, and can reach from traditional screen-based graphs, over innovative multi-touch interfaces, to dynamic media architecture displays.”

So — designers, coders, artists, visualizers — go forth and write!

Update: make sure to check out the submission requirements and procedure up at the IV main page.

Beware: the deadline is tight: March 1. March 21 But honestly, you would not have started earlier, anyways — right? Feel free to get in touch if you have any questions, and we are really looking forward to your submissions.

I contributed to the user interface design chapter in the recent Springer book “Dynamic Taxonomies and Faceted Search – Theory, Practice, and Experience” (online version) edited by Giovanni Maria Sacco and Yannis Tzitzikas. Based on a definition of core principles and challenges, the chapter presents a taxonomy of navigation modes observed in existing applications. On that basis, design patterns for enabling these navigation modes in user interfaces as well as extensions and related approaches are discussed. The chapter closes with a section on personalizing faceted search.

The book itself covers a wide range of topics and current research questions related to Dynamic Taxonomies and Faceted Search from an academic point of view.

You can find a pre-print version of the User Interface Design chapter here. Thanks also to my co–authors Sébastian Ferré, Saverio Perugini, Jonathan Koren and Yi Zhang!

The symposium »Living with Information: Architecture and Visualization« (October 16 , 2009 at FH Potsdam) will juxtapose experiences and results from the MACE project with thoughts and design approaches from practitioners in the fields of design, architecture and technology. Guided by five central questions, we will explore future trends in information visualization, the relationship of visualization tools and creativity plus issues like information over– and underload.

I am really looking forward to the unique speaker combination we put together:

• Miguel Cardoso from bestiario,
• Paolo Ciuccarelli from Politecnico Milano /density design,
• Georgi Kobilarov from FU Berlin / dbpedia,
• Norbert Palz (CV + info) and
• Andrew Vande Moere from infosthetics.com!

In addition, Prof. Boris Müller and I will provide a rear-mirror view and outlook of our activities related to the MACE project… A wide spectrum, but hopefully all held together by the central issue of the workshop and the five questions we prepared for the speakers.

Hope to see you there – register soon — space is limited!

On a related note, the Potsdam–based W3C office opens on the day before, which should be quite interesting, too.

Update: lecture slides here. Thanks to Eric Rodenbeck and the other see#4 speakers for some last minute inspirations!

We recently launched a whole new version of the MACE portal. MACE (Metadata for Architectural Contents in Europe) is a pan-european initiative to interconnect and disseminate digital information about architecture. The idea is to connect and enrich various databases containing eLearning material for architectural contents and to connect and make them accessible in novel ways. The project is co-funded by the European commission. If you are more interested in the background of the project, you can also view our info page here. Personally, I am working half of my time on this project here at FH Potsdam.

So, let me give you a little overview of the portal:

MACE users can search for contents in our faceted search application (using elastic lists, of course :). Contents can be filtered by origin, language, media type, expert classification and competencies.

Alternatively, the portal offers a radial tree visualization of the classification taxonomy that can be used to traverse the hierarchy and find associated contents. It was built using flare, and I added some extra-nice splines and a breadcrumb branch.

Upon clicking the header of a search result, users get to the MACE detail page, a pretty rich widget patchwork for displaying and editing the available metadata. It displays not only basic information such as language, description, usage rights etc., but also allows to associate contents with locations, classification terms, competencies, personal tags, rating and comments. The same page can be reached from a content by using the MACE bookmarklet, allowing users to tag and remember or find related contents while browsing.

By analysing the text of resources, we automatically detect persons and architectural projects. We keep the focus to architecture by additionally querying dbpedia to make sure we actually found persons and buildings of relevance in the architectural world. Dbpedia also provides the metadata for these “real world objects” as well as some pretty well-picked flickr images via their flickrwrappr script. If you are not familiar yet with the dbpedia project, be sure to check it out, these guys are up to something.

Finally, users can find their own resources, or expect those of others, on each user’s own page. It displays not only all resources and tags associated with the user, but also a personalized, automatically generated “intro text” characterizing the person’s activity on MACE.

I am responsible for concept and styling of the portal UI, implemented all the flash parts like the elastic lists and the hierarchical visualizations and also a decent amount of the crazy Javascripts driving the site. For me, it was the first major HTML/CSS/JS project in a long time, and apart from the usual frustrations with large code bases in dynamic languages, I really enjoyed working on it, and especially learning jQuery, which is almost like a new programming language on its own. Very interesting.

We will try and improve on the portal over the next 6 months, and also get a bit more experimental now that all the technology is in place.

If you have any feedback or suggestions, drop us a line or start a thread on our getsatisfaction page! And if you are interested the project and the page, make sure to register to get most out of it!

After lots of experiments with drupal, indexhibit and wordpress, I finally settled for the simple and elegant frog cms. Highly recommended, if you want to fill a custom layout with dynamic content in a very flexible manner.

Finally, the results of a cooperation with the guys from eigenfactor are online!

For the impatient: here’s the direct link: http://well-formed.eigenfactor.org

The site features 4 different visualizations, trying different approaches to mapping information flow and citation structure in the sciences.

A radial visualization based on hierarchical edge bundling does a great job of displaying the overall citation and clustering structure. I love the organic feel the bundled splines bring in, and multiplying the line colors added that deep extra color twist. Aesthetically, my clear favorite. Its downside is that it does not display the direction of information flow very well. Also, I am not 100% happy with the very heavy display when you click a whole cluster, but I guess you cannot have all at the same time.

A stacked column visualization shows how cluster structure and journal importance change over time. It does not display any inter-journal citation information, however. Reminiscent – on first sight – of history flow, or other stacked charts, we were, in fact, inspired by Sankey diagrams, and tried to map change starting from the clustering structure. The truth is, 95% of the data does not change much :) but data-wise, there is a distilled version of, for instance, the very interesting development neuroscience has taken over the years. It is documented already in a paper; we might want to publish a special interactive version for this story alone…

The treemap is probably the most functional of the visualizations. It transports the cluster structure quite well, additionally nicely tells the story how eigenfactor scores sum up to 1, and allows, on click, to get some pretty precise idea about the relation of the journal to others. It is a good counterpart to the radial visualization, with their complementary advantages.

Finally, a map. This is probably the most obvious approach for network visualization, but I couldn’t resist :) especially since it was a 1 day action. I used a spring embedding algorithm based on connection strength to calculate the map coordinates with cytoscape. I was quite pleased with its import, layout and export capabilities. I simply exported as gml, grep’ed the output and voila I had some coordinates to import. Great tool! The distortion lens is custom coded, and just uses two different linear distance scales. No fisheye, since I find these harder to control.

Here is the heart of the distance scaling code, if anyone is interested: var xx:Number = lens.x; var yy:Number = lens.y; var radius:Number = 50; var scale:Number = 5; var scaledRadius:Number = radius * scale; var dist:Number, diffX:Number, diffY:Number, diffUniX:Number, diffUniY:Number; for each (var n:Node in data.group("leaves")) { diffX = (n.props.x - xx); diffY = (n.props.y - yy); dist = Math.sqrt(Math.pow(diffX, 2) + Math.pow(diffY, 2)); if(dist < radius) { n.x = xx + scale * diffX; n.y = yy + scale * diffY; } else { diffUniX = diffX / dist; diffUniY = diffY / dist; n.x = xx + diffUniX * (scaledRadius + dist - radius); n.y = yy + diffUniY * (scaledRadius + dist - radius); } }

All visualizations implemented using flare, my favorite visualization framework. Amazing work, Mr Heer!

For all visualizations, the data basis came from the eigenfactor team, calculating both importance values for individual journals, as well as grouping them hierarchically according to their citation flow “neighborhoods”. You can find lots more information on the eigenfactor site.

The cooperation started when the eigenfactor team used a customized version of the good old relation browser; later, they got in touch with me to produce some more visualizations. We started work in summer 08, and after lots of scribbles, experiments, prototypes, adjustments and a little visit in Seattle autumn, we can finally present the results. I quite enjoyed the cooperation, science and design can be an explosive mix :) So, thanks to Carl Bergstrom, Martin Rosvall, Ben Althouse, and Jevin West.

Anyways — feedback welcome! Btw if you want to blog about it — here are some screenshots.

Update: Slides are online. Will upload the missing videos (blank slides) soonish on vimeo. Please excuse the funky template, that was part of the xtopia requirements…