Social Network Design example

8

EXAMPLE

An example may better explain the principles of scope and user needs, and provide a cursory overview of design methods. Let’s start with a list of names.

SPATIAL LOCATION: HOME

These individuals can be placed in a model based on their spatial location.

In this case, they are displayed on a map depicting the town they live in.

9

10

SPATIAL LOCATION: WORK

If their placement is based on where they sit at the office, the model will obviously look quite different.

CONNECTIONS

11

We now know something about where these individuals live and work. But for a social network model to truly show a social network, it cannot just show people on some form of map. It has to depict the connections that exist between these people. For this example, the connections shown are lines depicting chain of command at the company these individuals work for.

12

CONNECTIONS

Stripping away the background, which provides context for the network structure, two entirely different models become apparent when both “home” and “work” spatial references are considered and compared.

Home

CONNECTIONS

Work

13

14

OUTWARD ARROWS

Therefore position of interactors is relative to the connections explained. We could draw work connections on the “home map� but they would not sync with the spatial reference. So while we have two different network models featuring the same information, one spatial reference is relevant to the connections explained while the other is not.

Arrows can be added to the design to provide an additional layer of information. In this case the arrows depict chain of command, starting with the manager and flowing outward in the direction of control.

INWARD ARROWS

The arrows may also flow inward, to show the direction of subordination.

Whether the arrow points from Betsy to Paul or from Paul to Betsy depends not on what is being explained — which is fundamentally the same in either case — but on how it is explained.

manages

reports to

15

16

FIGURATIVE LOCATION

Spatial location conveys where these individuals are located in a literal sense. But the proximity of interactors in a relational sense may be a more apt description of the connections we are explaining. Using manager-to-subordinate connective flow as the context of the explanation, the locations of these individuals can be shown in various figurative ways.

CENTER-OUTWARD IN CONTEXT

17

Using a center-outward model is common for social network design, as it is most conducive to cross-linkage, which is a ubiquitous feature of social networks. For our purpose we can use this model to show us who the boss is (Betsy) and who her subordinates are. We can also see who is subordinate to her subordinates. What we do not see is what these individuals actually do. In other words, this design lacks context.

Providing a text label adds a contextual reference to this network. While we still do not know what these people do, or what their employer (Non Inc.) does, we have a better starting point for further examination. And for someone familiar with Non Inc., this may be all that is needed.

18

CENTER-OUTWARD IN CONTEXT

Further information added within the model provides even greater context for this network. We not only know who works for whom, but who does what.

ORGANIZATIONAL CHART

19

Switching to a top-downward view, we can see that this information fits nicely into the standard organizational chart used by many companies. The “org chart� is another means of providing context, and demonstrates how using multiple viewpoints puts the same information into different perspectives.

20

TYPES OF INTERACTION

Focusing on the connections between Betsy and Juan, we can see the different types of interaction present. The connections have been divided into two main categories, which generally explain their professional relationship. In this case, there are two categories of connective flow from Betsy to Juan — issuing directives and providing financial support.

The connections between Betsy and Juan can also be explained using color. Text labels are not required if the user knows that all values of blue indicate directives and all values of green indicate financing. As the directives and financing Juan receives are subsets of the directives and financing Betsy receives, they are shown as lighter values, indicating they are the same connective type, but are diluted through the downward flow. In other words, Betsy receives higher-level directives than what she imposes on Juan, and provides Juan with only a portion of the financing she receives.

The flow continues forward (or downward, or outward, depending on the design).

Directives and financing dilute further as they flow from Juan to Helga. In this model both color and text are used to explain the connections.

TYPES OF INTERACTION

Juan’s outputs can be shown in similar fashion, with directives and financing channeling through him to his areas of responsibility and to the staff needed to carry out these functions.

What Juan provides back to Betsy can also be generalized. This illustrates a feedback loop, with the connective flow from Betsy to Juan shown above (in blue) and the connective flow from Juan to Betsy shown below (in green).

21

22

PROCESS LOGISTICS

So far, all of this has explained the distribution department of Non Inc. from a chain of command point of view. This explanation may be the only explanation needed, depending on users’ needs. But this information can also be used to explain the process logistics.

As a starting point, here is a very basic viewpoint of Non Inc’s process flow from production to the customer. The first-forward design approach is best suited for this type of explanation.

PROCESS LOGISTICS

To focus the explanation on the distribution system for Non Inc, all nondistribution related processes and connections are muted.

With this filter in place, the workflow between the manufacturing of the product and its delivery to customers can be broken down to show the role of each distribution department employee involved in the process.

23

24

PROCESS LOGISTICS

Now we know what the distribution process looks like from a very close viewpoint.

Putting it back into a bigger picture will require another perceptual shift. For instance, let’s say we want to show Non Inc.’s worldwide production and distribution system.

Starting again with the first-forward design, we have the basic information we need to put this process into a global context. But doing so will require shrinking, condensing, or generalizing specific information.

One way to do this is to substitute names with symbols that scale well. In this case, we’ll use dots, which are used in many social network designs.

Dots can be scaled down to a very small size and still be visually recognizable. This is a good starting point, but each dot still represents individual functions within the larger network we must design. Continuing down this path will lead to a large quantity of very small information that will clutter the design and be counterproductive to the objective of comprehension and usability.

PROCESS LOGISTICS

To prevent this, we can simplify even further by using a single dot to represent the entire distribution process. This way, we go from this

to this.

25

26

PROCESS LOGISTICS

Now each department, function, and interactor type can be depicted as a dot, and the entire flow can be easily seen and explained in a single, compact model.

SPATIAL DEPICTION OF PROCESS

27

Each dot can be depicted spatially by placing it in the approximate location of its respective entity or process. Thus, as manufacturing and distribution are handled from the same facility (Non Inc.’s Rio de Janeiro plant) they can be represented using the same dot.

The problem with this design is its dependence on text to explain what each dot represents.

28

DIFFERENTIATION BY COLOR

One way to mitigate these problems is to use another differentiator, besides text, to identify the different interactors in the model. For instance, different color values can be assigned to each interactor type.

The connections between each type can be similarly colored, so connections can be visually identified according to their corresponding interactor types.

With each group now uniquely identified using color, the words used to identify them can be removed from the model. However, the words are not entirely redundant, as users may not know that is a manufacturer or that is a wholesaler.

The use of a legend can couple the colors with words that identify them and differentiate them from other colored interactors and connections.

REPLACING TEXT WITH COLOR

29

Now the model is easier to explain and visually interpret, as the text can be removed from the map. However, as manufacturing and distribution are handled from the same facility, how can and be shown in the same location at once?

30

COLOR, LEGEND, AND TITLE

Using overlapping color, manufacturing and distribution are shown together as .

With the aid of a legend and a title, all interactors and their connections can be shown without textual explanations clogging up the model.

Non Inc.’s Production and Distibution System

COMPLETED DESIGN

Now, the network can change without requiring users to change how they read and use the model.

Non Inc.’s Production and Distibution System

This simplification strips away detail such as the precise logistics of manufacturing and distribution, who is involved, and who does what. But just as we designed our way toward a simplified global model, we can also design our way toward complex localized models. The real question isn’t whether this is possible, but whether it is relevant to the design’s users.

31