Sounds in presentations

I am sitting at my studio desk now wondering where the wireless phone is. I can hear its ring and it sounds like it is coming from the house. Did Chris take the studio phone into the house? She says no. Then what the hell is happening? I have never been able to hear the neighbors' phones. It turns out that the sound is background noise in a video interview I am listening to! I have had the same experience when listening to pod-casts: I hear an email arrive and so I check my mail; I hear a text message arrive and I check my phone; while driving I hear an ambulance and I pull over. Perhaps these are just signs of my declining mental health or perhaps there is just too much directionless noise in our lives. Our physicality did not evolve for this.

My very first posting to this blog was about sound <http://calliopesounds.blogspot.com/2007/07/i-had-weird-moment-today.html>.

Gobby and reviewing some source code

Evans Lin and I used Gobby <http://gobby.0x539.de/trac/> last night to review a sub-system that he is implementing. It worked but was less useful than anticipated.

1. Gobby is a peer-to-peer networked application and so your application is both a server and a client. This kind of networking does not play well between corporate and ISP firewalls. The only way we were able to communicate was to have three instances of Gobby running: One for me, One for Evans, and one running on my home Linux box acting as a server. And even then, Evans needed to ssh tunnel to the Linux box. To effectively use Gobby in a WAN much consideration needs to be given to network connectivity.

2. As anticipated, Gobby's document management is very weak. The documents are listed alphabetically with no meta-data about ownership, modification time, directory path, revision number, etc. I also found the floating document list to get in the way more time than not.

3. When Evans and I were discussing our first document Evans asked if I was seeing his highlighting. I was not. We both assumed that not only would you see other's changes but you would also see other's highlighting. This is a good example of not knowing what you want until to actually trial your tools.

4. Gobby knows almost nothing about the documents it is presenting and editing. It does highlight the syntax of the document based to the document's file name extension. However, our experience with IDEs is that we want really good navigation between source code elements. For example, with Java source code we want, at a minimum, 1) class name to definition source file, 2) method name use to definition location in source file, and 3) method name definition to locations of use.

5. Gooby has a instant-messaging feature but we used Skype's voice chat. Gobby as an extension to Skype would be more useful.

Overall, Gobby has too many network connectivity issues and not enough document navigation features. If Gobby were to be implemented today then it should be a web application built using the Etherpad <http://etherpad.com/> and Bespin <https://bespin.mozillalabs.com/> toolkits with a little of the Nautilus file manager <http://live.gnome.org/Nautilus>.

A tool for informal review of a tree of documents is needed. (As opposed to a set of patches for which there are great tools. For example, Rietveld <http://codereview.appspot.com/>.) So, I will keep looking. Tell me if you find something good.

Streaming content for non-media applications

The vast majority of web app and mobile app use JSON or XML on the wire to transfer data. It is relatively easy to design a utility schema and textual data on the wire is easier to debug. The schema designs, however, tend to emphasize an analytical perspective rather than a performance one. For example, the schema for hierarchal data will typically look like this

node := data children
children := node*
data := field+
field := name value
name := string
value := string

The problem with this design is that it you can only know about the structure of the data only after reading the whole document. You can not do anything for the user between making the request for data and getting the last byte of the response.

I don't know about you, but I hate waiting for all the data when I don't want it. When I am in browsing mode or manual indexing mode [1] I only want to get the gist and move along quickly. For example, if I am flipping through a list of the movies playing at the local cinema I don't need an image of the movie's poster. What I do need is to know that there are 6 movies, the 6 titles, and the next two showings of each movie. When I settle on a movie then I might be interested in seeing the promotional poster, trailer, and reviews and so am willing to wait for this data to fill-into the UI. (Don't have me press a "more details" button, please!)

Most schema designers will create something like this

movies := (movie)*
movie := title rating director casting poster-url trailer-url movie-reviews showtimes
movie-reviews := star-rating reviews
director := person
casting := person part
person := string
part := string
showtimes := showtime+
showtime := start-time end-time
start-time := number ':' number
reviews := review*
review := person star-rating comment-string
...

You get the idea: A straight forward and clear hierarchical organization of the data. The problem with this design is that for web apps or mobile apps the app needs to read far more bytes than it needs to enable browsing and manual indexing. It needs to read all the bytes up to the last movie's node first byte just to know that there are 6 movies. That could be several thousand bytes of data just to know the number 6.

Network performance is not instantaneous. Cell network performance is worse than network performance. Schema designers need to stop designing data structures as though the data will be instantaneously transferred from the host to the client. We don't do this for audio or video and we should not do it with other data either. Data on the wire should be designed more as packets to be explicitly organized. And it should be ordered so as to ensure the application's usability remains high even under poor network throughput conditions.

In the case of the movie listings, the following is a better data structure

movies := count id* ( title | showtime | poster-url | trailer-url | .. )*
title := id 'title' string
showtime := id 'showtime' number number number number
poster-url := id 'poster-url' url
trailer-url := id 'trailer-url' url
review := ...

You get the idea: Link the related data explicitly with ids, tags, and data rather than implicitly by position in the hierarchy. Next, order the transfer of data to the client such that the client can use progressive disclosure. The user will now be able to see some structure and and some content and perform some interaction with the application before the whole structure and all the content is delivered.

In the case of the movie listings it might look like

6 m1 m2 m3 m4 m5 m6 ;
# now get the titles and next showtimes for the movies
m1 title Inception ;
m1 showtime 6:30 ;
m1 showtime 3:10 ;
m2 title The Sorcerer's Apprentice ;
m2 showtime 4:50 PM ;
m2 showtime 7:20 PM ;
m3 title Despicable Me ;
m3 showtime ...
m3 showtime ...
m4 title ... ;
m3 showtime ...
m3 showtime ...
m5 title ... ;
m3 showtime ...
m3 showtime ...
m6 title The Last Airbender ;
m3 showtime ...
m3 showtime ...
# now get the remaining showtimes
m1 showtime 12:00 ;
m1 showtime 9:40 ;
m2 showtime 11:45 AM ;
m2 showtime 2:15 PM ;
m2 showtime 10:00 PM ;
...
# now get the star-ratings for the movies
...
# etc

I am just using semi-colon delimited encoding simplify the example. There is no reason to abandon using JSON or XML as the encoding. You must, however, use a streaming JSON or XML parser so that the application client is able to get at the data as soon as it arrives.

This lesson was taught to me by David Durand when we were working on MAPA at Dynamic Diagrams. Part of MAPA was a Java applet that displayed a map of a location within a web site. The maps needed to display the canonical path to the location, the local structure of the site around the location, and the kinds of pages there. The data structure we used to communicate the data needed to display the map had the structural data up front so the applet could start rendering the map (in another thread). Meanwhile, the details about each page came trickling in and could be rendered piecemeal as it arrived.

It is only now that I more regularly use mobile apps that I really want his lesson to be spread as far as possible because mobile app usability in conjunction with cell network activity just plain sucks. I don't think the primary reason for this condition has to do with hardware, or the network, and, probably, not the algorithms. That leaves the data.

[1] Manual indexing is when you have a list of 10 items and you flip through them until you find the one item that you want. I am sure there is a interaction-design term for this but I don't know what it is.

RFPs that discourage response

Integrated Computer File Integrity Monitoring Infrastructure via http://www.transitchicago.com/

Wow! It is not until page 48 that you finally get some detail on what this RFP is asking for. And, of the 61 pages only 2 are about the work. I thought (mostly in passing) I might submit a proposal regards this request but the effort to complete the submission is by far more time consuming than the completion of the work itself. No wonder government costs are so high and RFPs are submitted by companies filled by mid-level employees.

Best jig ever: McDonald's Bun Troubleshooting Tool

http://englishrussia.com/index.php/2010/07/06/mcdonalds-how-it-works/

Animag Photo Stands

I love these photo stands. The price is high, but this does inspire me (the good Scott that I am) to make them myself. All you need is to pickup plastic animals (or other things you can cut in half!) from the yard sales (25 cents each), a hack saw (1 dollar), some epoxy glue, and two neodymium magnets per photo stand (50 cents each). Total cost for 4 photo stands is $6 and a lot of fun.

I bought a big box of these magnets for some LED throwies but do you think I can find them now? No.

Using logrotate to manage Apache Tomcat's catalina.out log file

Apache Tomcat does not roll its catalina.out log each day (or after a given size). It is a small annoyance but nevertheless it is an annoyance. The solution is to have logrotate do for you. Add the following to the crontab

0 0 * * * /usr/sbin/logrotate -v --state $HOME/var/logrotate.status $HOME/etc/logrotate.conf

Set the logrotate.conf to

$HOME/lib/apache-tomcat-5.5.28/logs/catalina.out {
  daily
  rotate 10
  copytruncate
  compress
  missingok
}
# END

Notes: I run Tomcat from within its own user directory and so all paths are relative to $HOME. Logroate does not perform environment variable substitution on the configuration and so replace $HOME in logrotate.conf with the actual path.

Manual duplex printing with OSX presets

I have wanted to be able to manually print duplex for sometime but never scratched the itch until today. With a quick Google search and I discovered

http://www.maclovin.de/2009/03/manual-duplex-printing-with-osx-presets/

The basic plan is to print the document twice. The first print prints only the odd pages. The second print prints only the even pages and (very importantly) with a reverse page orientation. So, print the document using the first settings. Next, take the stack of pages from the output tray and place them in the input tray as is, that is, don't flip them or turn them in anyway. Lastly, print the again document using the second settings. The result is a duplex document with the pages in the correct order in the output tray.

Max OS X allows for creating printing presets and so I have created a "Duplex Pass 1" and a "Duplex Pass 2" presets. The only bug is that the "Reverse page orientation" setting (aka checkbox) seems to be independent of the preset so be sure to make sure it is unchecked for pass 1 and checked for pass 2.

Sidewalk Graffiti Provides Navigational Assistance For Subway Commuters

"A considerate cartographer wielding a stencil and a can of spray paint has left a helpful navigational compass at the top of the stairs outside the NRW train at Prince Street for commuters exiting the station. As even native New Yorkers cant attest, everyone has exited a subway station and needed a moment to reorient themselves; a directional compass will make it that much easier. The unknown compass crusader stenciled the sidewalk at the uptown 6 train station on Spring Street as well. "

http://nyctheblog.blogspot.com/2010/06/sidewalk-graffiti-provides-navigational.html

I love simple, unobtrusive signage. It can be used in physical space and virtual space. Brainstorming on this example from NYC that painted a compare rose at the exit of subway stations you could use the same technique too

* point to bathrooms near parking

* point to information booths

* point to insert-your-favoriate-coffee-franchise-here

What would you point too?

Helping out Instapaper

The Instapaper iPhone app is wonderful for reading web pages later. Some web site's content does not show up very well because the Instapaper parser can't determine which HTML elements contain the content and what is ephemera. To help it, web sites can add CSS classes that point directly at content and non-content. Add the "instapaper_body" class to the parent content element and "instapaper_ignore" to non-content within the content element. See Preview: Community text-parser configuration for more detail.

I can't swipe horizontally to read email

Yesterday I walked into the Burlington Mall's Apple Store and tried out the iPad for the first time. (I have decided to buy the new iPhone 4 rather than an iPad and so the impulse to have one has waned.) It was much smaller than I expected but this does make it more book-bag friendly. I was very impressed with its speed especially compared to my iPhone 3G. I really wanted it to have a cover. The screen just screams at you "Please take care of me! I am going to be scratched." I don't want a sleeve: Where would I put it when it is not in use? I want a cover that works something like a triptych that folds flat into the back of the iPad or can be folded for use as a stand.

I have been thinking about interface design for the iPhone and iPad for a while now. I have been working through ideas with the design of an issue tracking application as this is a tool I will use every day. (I am a software developer, after all.) I am greatly inspired by Mag+ design. It is such a deep source of ideas. The Mag+ magazine is virtually laid out in a very strong 2d space: The horizontal is used to hold the articles side by side and the vertical is used to hold the article's content. This is a very easy visual model to internalize and it can be used for lots of different kinds of content with strong peer relationships and long content. I had assumed that Apple had this idea too. You see it in their photograph applications, but I was wrong. When reviewing the iPad's email application I was shocked that I could not swipe to view the next or the previous email. This was such a natural gesture that I assumed I did something wrong. As far as I can tell, I did not. Afterwards I realized that I can't swipe horizontally with the iPhone either.

The A Future of Information Interfaces for Emergency Management

The video The Future of Information Interfaces for Emergency Management is a good envisioning of the very possible with the possible exception of the "grab and drop" transfer of visualizations between physical machines. The front line responders all have head mounted video and, I would assume, other environmental sensors. The amount of information given to the front line was less than what I would have expected. That is, there was too much emphasis on centralized management and control when distributed management and localized control is a better approach. Other interesting features in the video include

* big displays with three-heads being common
* virtual whiteboard+touch screen that shows the distant participant as if on the other side of the device.
* pie menus are finally (!) showing their strengths in a touch-screen world.
* more direct touch interaction with specialized virtualized controls.
* heads-up display on the truck's windshield.

MonoTouch and Apple's Section 3.3.1: Two Theories

I do believe that Mono has meaning for developers. Everytime I listen to the Mono folks I hear them saying the right things. Here is another one of the right things:

MonoTouch and Apple's Section 3.3.1: Two Theories

"[...] MonoTouch has been misrepresented, initially by Gruber and by most people covering the debate over section 3.3.1. Probably because few of them have actually used MonoTouch or because they are not familiar with .NET. Probably folks think that MonoTouch is .NET, and .NET is Microsoft's Java and draw their own conclusions.

MonoTouch brings the C# language and the core of .NET to the iPhone, but does nothing to provide a cross-platform UI experience or for that matter any sort of mobile device cross-platform APIs.

We bring the C# language, garbage collection, a type safe system that help reduce errors, make programmers happier and more productive on the iPhone while getting access to every single iPhoneOS API that they want to.

We have also been able to expose new APIs that Apple has exposed in record time thanks to the fact that we are not really an abstraction layer over the iPhoneOS, but merely a compiler that talks to the native APIs. [...]"

JConsole and JMXMP

For the record, if you want to use jconsole with an MBean server using JMXMP you need to run it using

java \
  -classpath $JAVA_HOME/lib/jconsole.jar:$JAVA_LOCAL_LIBS/jmxremote_optional.jar \
  sun.tools.jconsole.JConsole \
  "service:jmx:jmxmp://$JMXMP_HOST:$JMXMP_PORT"

Other incantations just don't work. Define JAVA_HOME, JAVA_LOCAL_LIBS, JMXMP_HOST and JMXMP_PORT appropriately. Now, back to work.

Network activity records and the common good

The record of activities of users of Google, Facebook, Twitter, etc have enormous use in the service of the common good [1]. Google shows us how searching on flu and flu related terms bests the CDC's reportage on outbreaks by two weeks. Facebook's shear population size and its tools for instant affinity groups sees people helping people under good and adverse circumstances. And lack of Twitter activity is the same warning signal grasshoppers give [2]. The upshot of this is that in our current networked world these private institutions need to start making this activity record public.

At one time most decent roadways were private enterprises. They supported commerce and so tolls were used to support them. At some point, roads were seen as too valuable to be held in private hands and government took over the task of building and maintaining decent roadways. The same story can be told about potable water. But why did this not happen to the electric grid or the telephone infrastructure? I don't have an answer today but I do want to find out. I think the answer will lead to a better understanding as to our rights as citizens to having the activity records available for the common good.

[1] http://en.wikipedia.org/wiki/Common_good
[2] The Origins of Knowledge and Imagination. Jacob Bronowski. http://bit.ly/akd0gR

Whitelines Hard Bound A5 Squared Notebook

Oo, these are lovely. http://www.amazon.com/dp/9186177257/ref=pe_606_15192560_pe_ar_t8

Varanasi has an almost perfect web site

Varanasi, http://www.varanasi-indian.com/, has an almost perfect restaurant web site. Just one page containing the menu, hours of operation, and location. And one page that works with a mobile browsers as well as a desktop browsers. No Flash. No extra navigation. No big pictures. No complex layout. It was a pleasure to use.

The food, by the way, is fantastic. I really enjoyed the Punjabi Eggplant with spice level 4.

Ranks and snap lines in Instaviz

A Graphviz features is the abilty to align nodes using "ranks" [1]. Does Instaviz [2] offer a means of using ranks? If not, I imagine a means of dragging a node to "snap" to one of several equidistant lines drawn on the canvas. In this way, the user is able to specify some node organization and still allow Instaviz to automatically layout the graph as a whole. (I think it is reasonable to limit the snap lines to be in one direction only per graph.)

[1] http://www.graphviz.org/pdf/dotguide.pdf
[2] http://itunes.apple.com/us/app/instaviz/id299022481?mt=8

UpdateFor example, I want a graph to have have three ranks: The first rank contains the nodes A, C, and E; The second contains B, D, F; And the third contains X. Without ranks the following definition

digraph rankexample {
 A -> B -> X;
 C -> D -> X;
 E -> F -> X;
 C -> X;
 X -> C;
}

Creates this graph:

However, adding ranks (i.e. the "snap lines") to the definition

digraph rankexample {
 { rank = same; A; C; E; }
 { rank = same; B; D; F; }
 { rank = same; X; }
 A -> B -> X;
 C -> D -> X;
 E -> F -> X;
 C -> X;
 X -> C;
}

I get the layout I was looking for:

Addressing the needs of individual and groups with predictability

There has been some good observations of failures to help customers affected by Iceland's volcano eruption. David Weinberger's blog has a typical posting http://www.hyperorg.com/blogger/2010/04/18/volcano-1-internet-0-01/. I think the roots to this problem are that money and effort is being spent on

1. style over substance, and
2. individual-casting over broad-casting.

The style over substance argument is very easy to see. Every travel website that I have used obscures the process's workflow (and the broader information architecture) with abusive Web 2.0 techniques. Most of these techniques require an inordinate number of communications between the browser and the server. The upshot is that under moderate load the website fails to respond with predictable timing. Without this predictability customers are greatly frustrated and this leads them to use a telephone where they can at least know what their predicted wait time is!

The casting issue is more difficult to see. There are more casting groups then just "me" and "everyone else". Depending on your service, customers can be group into multiple and overlaps groups. For example, specific airport groups, country groups, traveling with children groups, etc. Each of these groups have common and unique information and advice needs in times of emergency (and times of calm!). The general public group is, generally, the most useless group unless there is system-wide failure. Without addressing the needs of affinity groups you are not truly servicing the needs of your customers.

The upshot is, let's spend less money and effort on individual-casting with technical acrobatics and instead balance the money and effort on addressing the needs of individual and groups with predictability.

This posting was inspired by Mark Bernstein's posting http://www.markbernstein.org/Apr10/InternetFailure.html

Always include a telephone number

Whenever you find yourself typing or saying "call me" ALWAYS include a telephone number. It it only 7 numbers locally and 10 nationally. Obviously, this is a pet peeve of mine.