Archive for March, 2012

March 14, 2012

Orals Slideshow & Abstract

March 9, 2012

Notes on Designing Interfaces

Notes from the O’Reilly book Designing Social Interfaces: Principles Patterns and Practices

Crumlish, Christian. 2009. Designing social interfaces : [principles, patterns, and practices for improving the user experience]. Beijing ;Cambridge: O’Reilly Media.

SOCIAL MEDIA (8, 9, 11)
social media is “media that is created, filtered, engaged with, and remixed socially” (8)

“Social media collectively refers to content… that is generated by the community of users for consumption within the same community” (9, Harjeet Gulati)

The idea of patterns for designing interface is describes this way “The notion of having a suite of reusable building blocks to inform and help designers develop their sites and applications has gained traction within the interaction design community as the demands for web and mobile interfaces have become more complex.” (11)

The idea of leaving elements or the social site structure incomplete is described this way “One of the key differences between designing a social environment online and designing a traditional media-style, broadcast-oriented content site is that the design of a social community online cannot be entirely predetermined.”
“This principle finds form in a number of familiar concepts: customization, skinning, user contributed tags, and the emergent folksonomies they can give rise to.”
“we create open space rather than filled-in labyrinths.”(17)

Understand that in order to interact with your system users must have an understanding or mental model of what they are interacting with (19)

“Strict Versus Fluid Taxonomies: Part of leaving the design unfinished involves determining which elements to nail down and which to leave more free-form.”

“Literally, a palimpsest is a manuscript… that has been overwritten at least once, with the earlier text only partially erased and obscured… The word has also been used as a metaphor to describe any place that reveals its own history.”

“Talk Like A Person: Bear in mind as well that the writing on your site or in your application is a key part of the user interface. Call it web copy, nomenclature, and labels if you like, but it’s as much a part of the UI as the buttons, windows, and sliders.”

Use a conversational tone that fits the attitude and personality of your users but do not take it too far. Also consider using questions as a way to suggest or call to action. Also the use of third or first person “my” for example should be used with intentionality expressing either possession or attention to the larger community/activity. Consistency is important with that naming of “my stuff”, “your stuff”, or “Bill’s stuff”. (26-34)

If you are using email give people a way to respond in email. You can also reengage users through a reoccurring e-mail. “The email should contain a very clear call to action.”

GAMES (37)
Good quote for games:
“Games are among the oldest “social interfaces.” The rules and tokens of a game provide a set of affordances and an environment in which people interact.”

Sign-up or Registration (45-49)
“Collect other information only as necessary for a compelling experience.”
“Require registration at the last possible moment in the users’ process of exploring”
“Allow use of a non unique nickname (email) to reflect back to the user and for communication between the system and user.” “Consider skipping the entire registration form and allow users to sign up with… Facebook Connect”

Sign In – Sign Out(53, 56)
“Provide a clear way to retrieve the username if it is forgotten.” “Provide a clear way to retrieve the password if it is forgotten.”
“Consider providing a landing page that clearly indicates that the user is no longer signed in.”

Invitations (58)
“A user receives an invitation from a friend or connection to join a site”
“A user sends an invitation to a friend or group of friends asking them to join in a site experience”

Onboarding (70-72)
“That process of helping people get started is called onboarding
“…a large bubble tells her exactly what to do next: ‘Create your firstpost!’. In actuality, there are a dozen things she could do from here, but the guide is making a decision for her. By limiting the user’s focus–”
Also consider the idea of a “Welcome Area”

PHATIC COMMUNICATION (122, 124)*****************
“Describing a continuum of phatic messages: “These messages are: 1. I exist. 2. I’m ok. 3. You exist. 4. You’re ok. 5. The channel is open. 6. The network exists. 7. The network is active. 8. The network is flowing.”

“phatic communication, the sounds and grunts of acknowledgment we make to remind one another that we exist.”

ONLINE PRESENCE (123, 128, 134)
“A Brief History of Online Presence: …1. a persistent “place” online where a business or project can be found…
2. a blog, for instance, can create an ongoing sense of a person…the blogger is actively “present” in that space and can be found there.
3. …one is currently online and available for communication; this is present not in a physical sense but in an availability sense. This is synchronous, real-time presence, to be distinguished from the asynchronous sense of #1 and #2.” (123)

“online, available, and open to contact.”
“four typical use cases for online presence indicators: • A person wants to determine whether his friend is online. • A person wants to see who is available for contact. • A person wants to see whether his friend is available for communication. • A person wants to show his contacts that he is busy.” (128)

The concept of a Buddy List is a “list of people a user wants to keep track of” (134)

“Thinking about time as part of designing conversation systems is a critical consideration when deciding what type of communication tool to add to your social framework.”
“participating in the conversation when it is convenient.”
tools which are synchronous “rely on all participants being present and engaged at the same time”

“The primary principle to bear in mind when designing presence interfaces is to maximize opportunities for your users to declare themselves present to one another (similar to leaving footprints or other human traces)”
“a few actions that the user or system can take: • Publishing presence information • Displaying current presence status • Displaying a timeline of recent presence items • Maintaining a history (partial or complete) of past presence declarations • Providing users with a way to subscribe to presence updates • Providing users with a way to filter presence updates”

“User Gallery: Another technique for signaling the transient presence of other visitors” (149)

“Activity Streams: the idea of at least maintaining a stream of recent history and then possibly mixing status reports with other snapshots of online activity has taken hold as a way of displaying presence.”

“An activity stream (or feed) may therefore consist of an aggregation of updates and activities that together can create a much richer sense of what the user has been doing, thinking about, and saying in the recent past”

“Statuscasting: Statuscasting is the custom of broadcasting an ongoing stream of status updates to the public or to a set of contacts or followers.”

“Microblogging allows users to create short posts. These are often aggregated into a stream and can consist of text, pictures, or video.
“post onto other services”
“Provide a method for viewing once posted. Both an author view and a community view should be available.” (138)
“Allow users to filter items by date, Allow users to search or browse by date or tags, Freshness: Show items by newest item first as a default” (250)

UPDATES (139, 342)
“Updates: Updates provide people with mini stories about what their connections and others are doing on the Net”
“Users want to see what their friends have been doing presented in a convenient format.”
Users should be able to “Opt-in” or have “Disclosure” when broadcasting updates
“These updates can serve as reminders to other users about what is possible within the system.”(139)
“Recommendations push objects toward people rather than relying on them to be passively discovered.” (342)

AMBIENT INTIMACY (146-147)*****************
“Ambient intimacy is about being able to keep in touch with people with a level of regularity and intimacy that you wouldn’t usually have access to, because time and space conspire to make it impossible.

“Ambient describes the lightness, the atmospheric, non directional, and distributed nature of the communication. These are communications that are one to many: they’re not quite broadcast and yet not exactly conversational. They flood over a somewhat defined space.”

“maintaining ongoing background awareness of others”

SOCIAL OBJECTS (185-186)*****************
“you should begin by defining the type of activity that you want to encourage in your space. Do you want people to collect or share?”

“Once you have a handle on the type of activity you want to foster and its associated subactivities, it is important to define the type of social object around which this activity will revolve.”

“Social networks consist of people who are connected by a shared object.”

“Social objects are natural, not artificial. A successful social object is one that has layer upon layer of conversation created around it; as the number of participants increases, social objects enjoy network effects. Social objects are about participation and participants.”

Competitiveness Spectrum (156)
Levels (157)
Labels: not qualitative ranks but qualitative titles (163)
Bookmarklet (210)
Relationships Terminology (354)
Groups (376)
Face-to-Face Meeting (401)

March 8, 2012

Building the Interface

From User Journey to Interface Actions

One result of creating two user journeys (see that post here) was a long string of actions which the tangible and graphic interface managed. However, this list included repeats of actions which could be edited into one, such as the tangible interface prompting goal buddies to “discuss” and on another occasion “reflect”.  The running list also didn’t present any hierarchy or priority for the actions which each interface managed. Lastly, the user journey began to flesh out the idea of inputs and outputs, but did not go into much detail other than labeling the actions.

In response to the suggestions of my thesis advisory meeting, it became clear that creating an edited set of actions and priorities of each interface would be an important next step. Below is a description of my vetting process, to organize, synthesize, and edit the long list of interface actions (represented in the user journey) into a discernible and manageable set of interface functions and features. Also, in this progression there is increasingly more attention put on the information flow between the tangible  interface, graphic interface, and user experience.


Step One: Making sense of a long list of actions

Take the long string of actions extracted from User Journeys and begin to edit them down into bigger categories of actions. For example the TUI produces a prompt “discuss” as well as “reflect”. “Discuss” is a more appropriate phrase because both involve conversation with the goal buddy. Therefore the category is named “discuss” and I later discover through the editing process that there are four types of prompts within the TUI: record your task, discuss your task or goal, and assess or challenge your task


Step Two: Organizing the actions to create a few key priorities of the entire system

Breaking up the actions again into more discernible pieces.  Here there are four parts: Prompting (Telling), Recording (Listening), Displaying (Showing), Confirming (Agreeing). However, at this phase there is still no differentiation between the priorities of the tangible and graphic interface. There are also some lines that are beginning to draw out possible collapsable categories.


Step Three: Assigning those priorities and actions to which interface “said it” or “did it”

Taking from the previous list, this list begins to assign some of the key actions to an interface. During this process I am not only considering where the information is coming from and which interface is “saying” or “hearing” it, but also using what I know from the User Journey to place the appropriate actions or functions to the appropriate interface, understanding that the GUI might require more attention and intentionality to check than the TUI. Here it shows the GUI would be in charge of controlling the recorded meeting times of the goal buddies: regularly (can input reoccurring date which could send you alerts) or sporadically (can notify system whenever you meet), and remotely or locally meeting. Both of these designations work best in the GUI because they are once or every couple of months kinds of actions, and would not be needed to be displayed or recorded within the TUI.


Step Four: Type it all up and continue to edit some more!

Type all of that up and begin to edit even more. For example: The GUI has three purposes to it’s display: to show logistical information, information about your goal activity which is inputted from your TUI, and information about connecting to your larger community of goal achievers.


Step Five: Print it out and map out the information flow (input/output to goal buddy,  TUI to GUI)

This map started off as a print out from the text edit document. I find that switching between all of these mediums helps me process information in another way. For example, here I realized that what the interface “displays” and what the interface “prompts” the user to to are both outputs. Whereas what the interface “records” is input which the interface must absorb. Therefore, it becomes very important to be very cognizant of how that information is being recorded and where it is going, or what it is informing.


Step Six: Continue to clarify the information flow between the two interfaces

Shortly after the last physical map, I tried to simplify and make large gestures in another map to help me understand exactly what information is being exchanged between the goal buddy and the two interfaces.  I find that by making a map (which unlike the last) is easier to read from a distance, can help me understand all of the relationships holistically. The more times I iterate on the same map, the more I understand and improve.


Step Seven: Digitize the findings by adding info to the System Map and continue to edit

also add informal information exchange between goal buddies



create 3 wireframes for each square of action combos

call out task completion

think of weekly (shallow) view and gui shallow view vs. more complex layered information views.

think about the everyday experience: ongoing action and reflection dispensed to the user, an ongoing diagnostic:
the focus is more on everyday experience rather than longterm relfection and goal management because i feel those other programs lack an interest for the everyday, whereas mine makes it easy and keeps people involved, becoming a habit and part of the social experience of working towards goal. i also think the everyday interactions create a novel experience to elicit an interest in the more complex information interface, which other programs start out with. my system values simple actions and aggregates them into a rich everyday experience shared between two friends. it takes the simplist idea: that we feel better when we are working towards something, that we understand more and have guilt less, less idealistic unreachable ideas, we are caught in the immediate action of making progress instead of planning out progress. it takes very little to begin in the process. mainly it is mediated through conversation with the social buddy aspect.

The experience of a curated goal buddy task package, receiving that information through TUI

March 7, 2012

Last Meeting before Orals & Next Steps


I have had my refreshing break and am now back to running in the thrilling thesis marathon! Below is a brief overview of feedback from my last meeting (On Feb 29th) with Denise, Scott and Martha:

  • Describe Priorities of interface
    • ie: TUI: gameplay, Community: motivator, GUI: collection space
  • List combinations of important actions
    • Actions could be the same throughout the process but change meaning because what has come before and after it
    • sets of actions should be pointed moments in the process
  • Storyboard/Sketch/Wireframe the interface and interactions
    • Focus on behaviors of interaction not form, ie: bristley vs. task completion etc
    • form increases desirability factor
    • form expresses tangible motivation
    • Hand sketches/lo-fi
    • What does it do, how does it work
  • Orals
    • Solid foundation
    • examples to prove/manifest ideology
    • key moments which led to other key moments
    • next steps
    • 30 minutes

Next Steps

This week I will be using “Designing Social Interfaces” as a guide, per Scott’s reference.Below you can see my list of “things to do” in one week, before Orals. Looks a little crazy but most things are broken down into smaller steps:

develop the sets of actions,
develop priorities of GUI interface and TUI interface,
wireframe the GUI & TUI interface,
create presentation of scenarios incorporating key moments of interaction with TUI/GUI/and overall system,
create nomenclature/language for system? (ie: buddy, task, goal, meeting, etc)

revise gameplay map,
bring question up to par,
type out objectives and observations from studies,
outline presentation,
represent morphing of question in presentation,
create presentation with key points & next steps,

am i missing some sort of maps: overall purpose or relation to other tools etc?,
update bibliography?,
outline for writing?

March 1, 2012

One Week’s Narrative

Though I might have set out to do one thing this week: make iterations of possible interfaces… I ended up asking many more questions and following a different path. Here is a description of that path, and an example of one week’s narrative through the questions I was asking. Every week is different and the path seems unknown.