data representation makes the difference

February 11th, 2008

You probably remember ethereal, right? Yeah, the gtk packet sniffer that has been around forever, but people like me who are pretty lame about networks tried it and didn't know what to do with it. In principle it's all very simple: you capture traffic and then you look at the data. Erm... kay. Well, in practice I had a tough time getting something out of that. Even a simple http request when split into an array of tcp packets doesn't really enlighten me that much when I have a little chunk of it here and the next there and so on. There are so many of them that I'm looking for the needle in the haystack.

This is a lesson in user interface design. ethereal is now called wireshark, and it's the same exact gui window that it always has been (with some minor incremental improvements). Here's the difference though. They figured out that data visualization goes so much further when you actually give a thought to representation.

The before picture, googled for an old screenshot of ethereal:

The window is split into three panes. The top one is the one you'll look at first, this is the list of packets we captured. Notice how small the scrollbar is and just imagine we have a large chunk of traffic in front of our eyes. Scroll up, scroll down, sort by protocol, whatever. In the other two panes you have info on the packet that is selected right now. In the middle one you have nicely structured info, in the bottom you have the raw data. This is the way to look at packet content. Btw tcp packets can be up to 1.5kb in size, so it's not exactly a sizable amount of content.

Gear up for the after picture:

Yeap, colors. Really, that's all I had to say. People underestimate what a difference it makes to have the same exact output in contextual coloring. The same data just jumps up at you if you know it's gonna be in red and you don't have to parse the whole chunk of text to get to it. Notice how the old version and this one have the protocol column just the same, but how much easier is it now to spot different types of traffic? It makes a world of difference.

wireshark has another brilliant addition that I don't remember from years ago. You right click on a packet, like the tcp packet selected in the screenshot above that belongs to an http stream, and go Follow TCP Stream. What you now get is a new window with aaaaall the packets that belong to this conversation assembled and you can observe the whole thing in one place. Fabulous. You can also filter the data (on message level, not packet level mind you) on host if you like. It's fantastic.

If you thought *that* was bling, this will really blow you away. wireshark does not only assemble http conversations, it assembles a lot more protocols. For instance, I saw a talk the other day where the guy was demonstrating how he sniffed a voip conversation and then reassembled the whole thing to a simple audio file with a few clicks!

These two features, packets colored by protocol and packet assembly, alone make wireshark about 200% more useful than it used to be. And think about what has changed here. It's still the same data. The only difference is how you represent it.

:: random entries in this category ::