MudLog

We’re currently developing an authentication system that would enable single login to all the web applications we make in the PLW. But the idea of developing a central login system isn’t new: Microsoft’s Passport has been around for years and Google uses a similar system (also, see Google Account Authentication). We’re not really after that. We just want to have a system in place so that we don’t have to maintain individual login systems nor user information every time we build a new application. Since we’re thinking about implementing an authentication system, it’s good to think about authentication systems in general.

It’s crazy how many accounts we have. It’s even crazier to see how often we share common usernames and passwords. Traditionally, authentication is done through matching unique usernames to some alpha-numeric password. I’m no security expert, but this seems secure enough. However, many websites select users’ email addresses as their unique username, and since users are allowed to choose their own passwords, many end up setting the same password.

What happens when one of these sites compromises your information. They essentially have access to all other accounts that share the same username and password. Using an email address as a username is also a bad idea, since it’s a unique identifier that is attached to one name. It’s just as bad as schools using social security numbers as student numbers.

With our system, we go back to the old fashion way of using physical metaphors. Our metaphor is the locker. Usernames are mapped to a locker number (which also has a location) and the password is a combination lock. Usernames no longer have personal identifiers attached to it, and the combination lock gives the user the understanding that if you forget your combination, you’re sort of screwed. You have to ask someone with a master key or get a locksmith to cut it off.

Here’s the combination lock, using canvas and written in JavaScript. Works best if you use a PowerMate; mapping rotate right to right arrow key, rotate left to left arrow key and button press to the enter key.

Finally, I finished what once was called PLWicense. It is now renamed to something a little more descriptive, called MadLicense. MadLicense is a Mad Libs-style license creator. Users are given a license template based on popular open source licenses (for now the MIT and Apache Licenses, but more to be added) with only specific modifiable words. In a way, it makes license creation easy, but also challenging since only certain words are modifiable. With this restriction, it forces users to creatively place words to come up with an applicable license for themselves.

This is Kyle’s trip report, published here since he doesn’t have a blog.

Having never heard of Edward Tufte (ET) prior to my visit, I hadn’t any idea what to expect.

After obtaining ET’s 4-book collection and a folded sheet of orange 11″x 17″ paper, I entered the conference hall. I immediately realized the attendees were neither engineers nor designers. The average attendee age must have been around 35.

ET began the first half of his presentation promptly at 10, asking attendees to open to various points of his books. He briefly explained a few key ideas, and began a long iteration through his “Fundamental Principles of Analytical Design”. These principles were often mentioned immediately following references to rather high-level scientific inquiries: A chart representing SARS outbreaks, Galilean planetary observations, Minard’s map of Napoleon’s invasion of Russia in 1812, and a 1930’s epidemiological study of a London-based Cholera epidemic.

As time goes on, ET professes, the ability of scientists to make use of his design principles will become increasingly important. The resolution at which scientific inquiry operates increases, and as this happens, a much greater degree of clarity must be made when making scientific assertions. It became clear through the course of the first half of the lecture that ET is not a scientist, and didn’t seem to have a solid grasp of those scientific concepts he asserts require his principles to be appropriately represented.

Following lunch, the presentation took a rather dramatic turn. ET abruptly stopped talking about the fundamentals of analytical design, and became more of a snake-handling preacher condemning the over-simplification of scientific content of Microsoft and its PowerPoint presentation software. He spent two hours discussing how software designed for simplification and abstraction (PowerPoint) was responsible for the 2003 Columbia disaster. Attendees nodded in unison.

Following this, ET proceeded to give attendees insight into how to give effective presentations. This was more or less a self-congratulatory pat on the back for ET, as each of his suggestions were each an integral component of the presentation he had just presented, including the supreme importance the folded orange 11″ x 17″ piece of paper, which most people used only to determine the time of the lunch break.

In the first half of the talk, attendees were expected to formulate an appreciation for the necessity of effective information representation and visualization. ET stressed the importance of the principles of scientific inquiry through clarity, detail, and comparison. In the second, he abandoned these assertions. Rather than discuss all of the issues involved with a highly visible NASA decision involving the lives of many people, he picked just one (the presentation format of a single report), asserted its lack of detail, and hastily sketched a line of causality between simplification and death. To give ET some credit, however, “show causality” is Analytical Design Principle #2.

I remain skeptical that ET’s ideas can be applied to pure scientific research. There are reasons why his examples are either outdated or the product of high-level socially-oriented organizations such as the Harvard School of Public Health. There are simply too many variables, and too many assumptions embedded within the frameworks of most scientific research to be represented as he suggests. Perhaps he should spend more time reading Thomas Kuhn and less time analyzing PowerPoint presentations.

Fortunately, our work at the Media Lab sits at an unusual position between pure research and corporate interest. The work we do is not extremely fine-grained and thus lends itself better to ET’s principles than pure research. ET’s books have been useful to me while learning more about the fundamentals of design through the avoidance of unintentional optical clutter and the how contrast between data and background reduces optical noise.

Criticism aside, I was pleased to have attended ET’s presentation.

Eariler this week, us first year students from PLW took a quick trip to New York to attend Edward Tufte’s workshop. The train ride into New York was plesant, but the ride back was a total disaster. Also, thanks to my good friend Jeff (happy birthday buddy!) for letting me crash at his place. Anyway, back to the workshop, here’s the trip report.

To Tufte or not to Tufte…
Trip Report for Tufte Trip, August 23, 2006. New York City.
Takashi Okamoto

Overall, I enjoyed the Ed Tufte workshop in New York. His talk was divided into two parts, pre-lunch and post-lunch sessions. The first half of the workshop was great. He explained in detail, the “Fundamental Principles of Analytical Design,” which breaks down to:

1. Comparisons
2. Causality, Mechanism, Structure, Explanation
3. Multivariate Analysis
4. Integration of Evidence
5. Documentation
6. Content Counts Most of All

He emphasized that “content” is most important; design won’t help if the content is weak (Principle 6.) So get better content! “Resolution” is the other key point, and he claimed that advances in science and our technical ability to achieve higher resolution is equivalent. Relating to higher resolution, he said everybody should work with two monitors in order to aid in comparison. So having two monitors is very important! Good thing John sets all of us up with a two monitor setup. Tufte says content needs to be dense, you shouldn’t cherry pick anything, and that the high resolution design will make that dense information more accessible. Cherry picking relates to something he emphasized over and over throughout the workshop. The main point to the workshop seemed to be about one thing: Content Integrity. As presenters of content, we need to make sure the content is credible, and not cherry picked to advance our own agenda; and as consumers of content, we need to make sure we question the validity of the content. He pushed this point over and over again.

In terms of technical instruction, the topic floated around Sparklines. Sparkline is “data-intense, design-simple, word-sized graphics,” which is a visual technique that can install high resolution information inline, within texts. I think Sparklines are useful, but only for two dimensional data, where one is temporal. His examples didn’t help much either, since he only talked about stock market data and sports scores, so I felt he made a huge deal about something you can explain in one sentence. He should have talked about links and causal arrows instead.

The second half of the talk was awful and there’s not much to say. He became preachy and cultish and went on and on about how bad powerpoint is. He basically blamed Microsoft for Columbia’s burn up in the atmosphere, because NASA engineers used a badly designed powerpoint presentation instead of writing a full technical report of the foam hitting the shuttle’s wing at lift off. It was so awful I wanted to walk out and curse at him for cherry picking (Kyle passed me a note pointing that out.)

One of my interest at the lab is to make information more accessible. With effective design (and interaction) you can make dense information accessible to a wider audience. Tufte’s workshop did shed new light into this, and I think once I finish reading all of his books, it would make me a better deliverer of information (and hopefully a non-biased credible one.) The lesson on good content is a relevant one for the whole group, especially for PLWire. I think whenever we post new content onto the site, we should make sure that the content is relevant and the viewers find it interesting and comprehendible.

Amber is working on adding audio tags to PLWire, so I began looking at browser support on playing sound files. From simple google searches, it’s easy to see that sound support hasn’t changed since the days of NN4 and IE4. I would assume this is because browsers rely on plugins to do the work, like Java, QuickTime and Flash. All I want is a way to create a sound object, be able to play, stop and to check whether or not the sound is being played.

I guess that’s too much to ask. Playing and stopping sound is easy to do, but if you have a bunch of sound files you want to play sequentially one after the other, you need the ability to see if a sound file is done playing or not. I just wanted a quick solution, so I gave up and decided to use QuickTime. Java Applet seemed too extreme and Flash, well I avoid Flash at all cost.

QuickTime offers scripting capabilities with JavaScript. It exposes a lot of features, which you can modify via JavaScript. But be warned, Apple’s documentation is pretty bad. Anyway, fastforward to the problem and solution.

You have a bunch of QuickTime movies, whether they are video or audio that you want to play one after the other. In QuickTime, QTNEXTUrl() is the method you will want to use. From the documentation:

string GetQTNEXTUrl(int index)

void SetQTNEXTUrl(int index, string url)

Get and set the URL and target for a specified item in a sequence. The URL of the first item in the sequence is invoked when the currently selected movie finishes. If the URL specifies a QuickTime movie and the special target myself, the next specified URL in the sequence is invoked when that movie finishes, and so on. The Set method is equivalent to setting the QTNEXTn parameter in the <embed> tag.

Setting the HTML page is simple. Just use either <embed> or a combination of <object> and <embed>. Something like the following:

<embed controller="true"
target="myself" xsrc="audio/1.mov"
pluginspage="http://www.apple.com/quicktime/download/indext.html"
enablejavascript="true" name="mysound" id="mysound"> </embed>

That will embed a QT with a file “audio/1.mov.” Now we write some simple JavaScript:

// holds all audio files
var audio_files = new Array();
function init() {
audio_files.push("/audio/1.mov");
audio_files.push("/audio/2.mov");
audio_files.push("/audio/3.mov");
// add to sound queue
for (var i = 1; i < audio_files.length; i++) {
document.mysound.SetQTNEXTUrl(i, "<"+audio_files[i]+”>T<myself>”);
}
}

Just call init() during window.onload(), and push all the audio in sequential order to audio_files. That should do it.

We just launched the new PLW site which we call PLWire. We no longer have text, we have a collection of videos, graphics, links and people. I think it’s a fun site, although it wasn’t fun to build. Too many JavaScript issues. Everybody in PLW can add and delete “modules,” but the most interesting part is that no user information is attached — so we don’t know who uploaded and deleted what. My hope is that it’ll somehow create tension, because tension is good. I call this anonymous editing.

BTW: Check out all the videos and pictures from SIGGRAPH. I didn’t end up posting any pictures to this site, because I’m too lazy.

Starting tomorrow, the PLW team will be hanging out at SIGGRAPH. I’m specifically curious about discussion panels surrounding Digital Rights and Licenses, since I’m currently working on PLWicense: an online license creator. More on that in a future entry, but the initial release is ready to go.

Hopefully I’ll have images from SIGGRAPH here during the week, but I’m not much of a picture taker, so who knows. I’ll be at the fashion show for sure. Here is the website I made for it. See you at the bar.

It’s been a fun week but I didn’t get much work done because we had SIMPLICITY events to attend. I did however start working on the new PLW website, which should be completed by SIGGRAPH2006. The PLW team will be there, so I think it’ll be fun and a nice break out of the lab.

It’s new logo Saturday! Here are new logos for OpenStudio (of course I haven’t gotten everybody’s OK) and PLWire (which will be the name of the new PLW service) that I worked on this week.

We’ve been working on OpenCode, our first new tool for the upcoming OpenStudio 2.0. The blog entry can be found here, as well as a brief screen cast.