The Anatomy of a Web Application

Web Production consists of three core disciplines: User Experience Design, Interface Design and Development, and Software Design and Development. As a practitioner of each of these disciplines, I have long noted the great divide between the communities. The software community deals with software design and development, the interface community deals with interface design and development, and the user experience community deals with user concerns, or more specifically, the web application’s purpose.

The simple fact is, that in any web application, the degree to which the activities of each of these disciplines are done well will determine the application’s value. Weaknesses in any of these areas within an application will decrease the value of the application. Given this critical postulate, I’ve been working lately to model the interdependence between server software, the interface, and the user experience. This is the resulting model:

The Anatomy of a Web Application - Jason Stonebraker, 2011

The Anatomy of a Web Application - Jason Stonebraker, 2011

Most of this diagram is a whole lotta duh. But what is notable to me is the positioning of User Experience. The User Experience doesn’t wrap the interface or the software, nor does it sit atop it. It intangibly exists between a user’s expectations and his/her actual interaction with the application. Given this, one can see that an application’s purpose should always model the user’s expectations. That is not a new notion, it is sadly, simply not always done.

What sits atop as the primary driver is the application’s purpose, meaning purpose is the third element of a web application. It carries significant weight, and is as much a part of an application as the interface and the software. I don’t know about you, but that’s super interesting to me.

In any case, I’m very happy with this diagram at the moment. I believe it accurately models the interdependence of the three core disciplines, and may serve as a tool for better uniting them.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: