Logo
Design process

In order to figure out what is the best way to record data, we started to document our daily social interaction by logging in at google doc, and in turn out that the process is very cumbersome and, by tracking all the people in your life, what will be the focus?

Based on that, we cutting down the data type we log in to record only who, how long, and how satisfy is this social interaction to the user. User can add more details about this interaction in the "Note" box. In the future, we also plan to script data from user's email, chats, and calendar to make the data collection more complete.

After data collection, we rely on a lot of visualizations to help user understand their social patterns and further improve their behaviors.


Mockups

Web interface

The homepage of web interface has two visualization (radar and stack graph) to provide a summary of social interaction with friends and family in a period of time.

The radar char shows the frequency of the interaction. People who interact with the user more will show up closer to the center of the radar, and people who has less interaction with the user will appear further from the center. On the right hand side of the interface, we provide a list of the interaction raking to support the radar visualization and provide more qualitative information.

Stack char shows daily total time of interactions with other people. Each block of time represent the amount of time that the user put in this interaction. By hover the block, user can see the details of the interaction including interaction type and the amount of time.

Mobile interface

Mobile interface is provided mainly for the purpose of logging data, so we simplify the visualization by using bar chart and other visual elements to include more details.

Personal informatics, a class of tools that help people collect personally relevant information for the purpose of self-reflection and self-monitoring {cite from personalinformatics.org}. Therefore, we hope to help users gain self-knowledge about their social interaction pattern, keep in touch better with people they care about, maintain meaningful relationship and improve the quality time of their life.

Project Details

My role: Web and mobile interface design, including wireframing, mockups, and visual design

Duration: 01.2011 - 04.2011

Teammates: Natalia Fisher, Yi-Ying Lin, Vamshi Polam

Technology used: Adobe Illustrator, HTML, CSS

Links & Downloads

None