Go, Do, Be.


03/26/2009  — 

Twitter-Based Surf Report Flowchart

I've been mucking around with Twitter and Facebook lately. There are a few folks who have been using these services to post info about how the surf is. I don't live close to the beach (yet), so I like to see what's happening before I jump into the car and make the trip.

I sent a message from my phone this morning. Even though the surf was lame. The message was published all over the place (microsyndication). Here's how it worked:

  1. I emailed a photo to twitpic.com which...
  2. updates my status on Twitter which...
  3. the @StokeReport user follows. If my tweet contains "SMLM", stokereport will publish my tweet on stokereport.com (and even pull the image off twitpic it seems, nice!).
  4. also, http://greacen.com has that little widgety thing over there on the left. Your browser will pull the image from twitpic and put it onto this page.
  5. also, Twitter will pass my status update on to Facebook.com

Guess what? Most of these nodes along the way have their own RSS feeds for others (services or people) to slurp & read.

Thinking about this plinko-esque publishing flow is a little dizzying. I've been working on web site flows for a few weeks now. It's often helpful to map out a flow to see what's really going on. Graphviz is an open source tool for producing network diagrams and flow charts that I've been using for mapping high-level flows. Here's what a map looks like for the publishing flow I described earlier:

digraph TwitterSurf {
ratio = fill;
node [style="rounded,filled,bold" shape="box" fillcolor="skyblue"];

/* Set up specific shapes */
Phone [style="rounded,filled" shape="oval" fillcolor="grey"];
"RSS Aggregators" [style="rounded" shape="box3d"];

/* relationships */
Phone -> "twitpic.com" [label="Email with attachment"];
"twitpic.com" -> "twitter.com" [label="twitter api"];
"twitter.com" -> "facebook.com" [label="facebook/twitter bridge"];
"twitter.com" -> "stokereport.com" [label="if post contains 'SMLM'" style="dotted"] ;
"twitpic.com" -> "greacen.com" [label="widget/embed" color="red"] ;
"twitter.com" -> "RSS Aggregators" [label="rss feed" color="darkorange"] ;
"facebook.com" -> "RSS Aggregators" [label="rss feed" color="darkorange"] ;
"stokereport.com" -> "RSS Aggregators" [label="rss feed" color="darkorange"] ;

If you ignore the []s, it looks like a terse version of our list up above. Here's the flowchart those instructions produce:

Surf Report Publishing Flow

Kinda neat, huh? I find the way this goes from text to sitemap really intriguing. This -> that; that -> next; other -> next; makes sense to me. Graphviz does a great job of putting this all together in an easy-to-digest graphic.

There are a few rails front ends to graphviz (demo) that might make a web tool for this possible. I could see this becoming a handy planning tool for our organization.


  • Anyone ever use a tool like this for making sitemaps or high-level flows? What tools work well for modeling these interactions?
  • What other publishing tools are you using to propel your tweets? (where's my linkedin hook?)
  • Has anyone run into ownership issues with this plink-esque publishing?
  • Does this have a name? Let's call it microsyndication.
  • What's the best way to get metrics for this kind of publishing? Is there a way to measure in this distributed/microsyndicated system? How many people read my surf report?

Thanks for reading.