What can ant colonies teach front-end architects?

I just read a great article on Embracing Complexity by the Harvard Business Review and I got a crazy idea about using the same “ant colony” metaphor to describe UIs design and architecture.

Image from zazzle.ca

There is a lot to learn from an ant colony and these lessons can be applied to many complex problems as the article describes. It is difficult to understand how an ant colony works if you just look at the individual ants. Just like in a complex system, you can’t fully understand it by simply looking at the individual components.

A great lesson from these ant colonies is that ants don’t get the “global system” however their local interactions results in this complex system; the ant colony. Nature is full of these complex & adaptive systems that just work; no leadership; no congress; no committee to make decisions. However us humans like to think of things as “cause and effect” and in software engineering this translates to “sequential programming”. We look at the systems we are trying to build as a chain of steps; doStep1(); doStep2(); etc. We need to break out of this cause & effect paradigm. We can take this a step higher and even compare this to the most popular software engineering process; the waterfall.

We can look at application user interfaces as complex systems that is broken down into individual components that communicate together in the “local” context i.e. the current user view. The whole is greater than the sum of the parts. These applications we are building are really event-driven just like any system that exists in nature. Decisions lead to cascading events. A user clicks on a button, some components choose to respond to that event. Or the server emits some signal that some other components would choose to respond to.

So how do you take these lessons from an ant colony and apply it on your next UI project? Think events, stop thinking functions.

  1. Break your UI into small components and widgets with related functionality
  2. Use the publish/subscribe mechanism within your framework. You can have a look at my post about Dojo’s Publish and Subscribe.
  3. Design your components to communicate with each other using events. Widgets communicate with other widgets around them i.e. local communication
Embrace complexity in your UI projects – it will only get more complex for you as your users demand richer interactions.


This entry was posted in front end architecture, thinking out loud, web apps. Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>