How to pick friends

myfolks selector

Imagine, you’re back from a trip abroad and want to tell your friends about all the fascinating experiences that you have made (and you either don’t have a blog for that purpose or don’t want to publish it publicly). Usually, that means you have to go through your entire address book and select the appropriate persons. However, if your computer knew about your relationships it could help you a lot with this task.

How could a user interface for this case look like? Here are some propositions (and some problems to discuss!).

A basic consideration at the beginning: Your computer could do most of the selection on its own by computing relevance based on your previous communication (the Buddyguard principle). But having a visual representation offers the possibility to show “excluded people” somewhere at the borders. Thus, you can tune the selection by picking special recipients manually or de-selecting those that you don’t want to inform this time.

Buddyfinder circles

 buddyfinder "circles" visualization where all contact/face reside on distinct "orbits"     
The most natural visualisation seems to be a “circle of friends”. The closer to the center the higher the relevance of this person for you (note: I used the images of friends for my studies but I distributed them randomly. Their (your!) position might not represent our actual relationship).

buddyfinder "circles" visualisation: collection of contacts shown as their faces, in an interface with handles to make a selection
You can select some basic tags (the “private” label in this screenshot means your relation has no “professional” character) and adjust the level of relevance that seems appropriate for your letter.
Problem: the circle needs the most space of all visualisations.

Buddyfinder Crowd

buddyfinder "crowd" visualisation with densely packed faces
A variation to the circle is the “crowd” which is more compact because it does not map the distance from the center strictly to relevance. Which is ok as this information can be found in the size of the “bubbles”, too.

Buddyfinder "crowd" visualization, with a subset captured/selected in a centred circle
All bubbles that match the criteria will aggregate in the middle, surrounded by those that match only some of the criteria and surrounded again by the rest of your contacts.
Problem: using the same visualisation to also adjust the “threshold” for relevance (“direct manipulation”) seems to be difficult with a circular selector.

Buddyfinder Theater

Buddyfinder Theater view, with faces arranged in a semi-circle
Positioning in “theater style” takes up less space.
Problem: Very little space in the center, lots of space at the edges (top left and right). It becomes difficult to map any value (e.g. “time elapsed since last conversation”) to angles as real estate near the center is quite scarce .

Buddyfinder Theater visualization on a semi-circle, with filters and a selector separating a "fraction"/slice from the set
Metaphor is easy to grasp: Is this your audience?

Buddyfinder Group Photo

buddyfinder mini rectangle
A group photo delivers another metaphor. Biggest advantage: It fits well into rectangular (computer/mobile device) screens and appropriate windows. But it appears least poetic to me, too…

Buddyfinder Group Photo visualization with faces grouped by filters and a selector
Nice thing about the rectangular display: If you are running out of space you can place the less necessary persons (here at the left hand side) outside the display window while keeping them available through scrolling.

2 Responses to How to pick friends

  1. Hannes:

    edit: My first version was based on a scenario with inviting your friends to a party. Larissa made me aware of some difficulties with this background: sometimes members of different groups can’t stand one another, so you will try to keep them separated and invite only one of them.
    To be aware of these interdependencies can be quite helpful, however, and the computer can help with this task, too. Jeff Potter (and danah boyd) show it with their buddy graph. But that’s another story (with complicated visualisations coming along)…

  2. Larissa:

    I can perfectly imagine myself in this scenario, now. 🙂