Footprints serves as a public social media that allows individuals to organize information online and connect with perspectives from other social groups. By aggregating and visualizing data of information consuming behaviors, users are given the access to evaluate and self-reflect the impacts of different information-consumed. The initiative intends to encourage a third person observation to social bubble illusions, and ultimately, it aims to augment the capability of individual agencies to think critically and panoramically. Footprint is an independent project.

Timeframe Sep - Nov 2017


Group 13.png


Data source: CNN

Data source: CNN

Technology has flooded us with the high-choice environment and elusive peer-effects which is distorting both individual and collective grasp of the truth. Individuals were increasingly prompted to fixate on their own value propositions by the “echo chamber” that is deepened by curated, filtered-by-controlled-algorithm media environment.

The collective lost in “single story confusion” urges a transformative system of consuming information - an inclusive, interconnected public social platform which allows people to better organize information and learn from people who live outside of a static socio-cultural loop.



Both primary and secondary research projects were conducted for the purpose of understanding: 

  • Is the problem real?

  • How serious is it?

  • What are the common habits or behaviors?

  • What is in demand?

Research methods including literature review (big picture), focus group  (common habits & behaviors) and semi-structured interviews which include participants from ages of 25-35.   


Insights gathered from both primary and secondary research projects show a tendency that, especially in younger generations, people get used to consuming information from social platforms that are either closed friends network or interested group. People who participated interviews also show concerns in regards to overwhelmed information flow, a sense of loss in the unconscious chase to information and, when specifically there was a public debate, the confusion found in the unfamiliar ideas.  

Group 11.png

As the interviews were semi-constructed, each of the interviewees was asked one question regarding their view of an alternative approach to consume information and noted that most of the people show the willingness to interact with diverse ideas and unfamiliar things, they don't think that willingness can last.


The profound desire of living in "homophily", a state of similarity breeds affection, is part of human nature. People seek out similarities in both personal and societal interactions: neighborhoods, friendships, and relationships - they all natural and fundamental. However, implications of homophily in a civic discourse are not always desirable.

My approach to solving the civic-homophily dilemma was not to confront our biological default-setting. On the contrary, it complies with our psychological and social needs (the fundamental fear drives us to explore and understand the world) -

  • We desire to know ourselves better (how we come to be ourselves)

  • We desire to know our relationship with the world

Screen Shot 2017-11-25 at 2.25.30 PM.png

The design components combined those two needs - 

  • Personal information aggregator

  • Public & personal footprint dashboard


Know your today

Subscribe information you want to receive, connect with social media and hotspots. With browser extension, it will track and parse what you have browsed, both proactively and reactively.  


Retrace your steps

Revise personal information consume dashboard - retrace what you have consumed in the past 30 days or a year. Reflect and evaluate how information shaped your mind or your decision making.


Know your relationship with the world

Connect with (unfamiliar) others - a grand dashboard of  friend's or the public information intake footprints. See how ideas and perspectives different between different socio-cultural groups. 


Get inspirations from things you might have missed

Retrace the steps taken by others online - see if what you think and how you think are reflections of what you read and see what alternative focuses and perspectives are out there. 


To consider how information intake process impacts on our mind and decision making, this project tackles both proactive (subscribe & follow) and reactive (passive browser) intake. For reactive intake, it uses content retrieval, natural language process (NLP) and information aggregation to analyze the reactive mode of browsing footprint.

1. Content retrieval

With browser extension installed, the content (Facebook stories, Tweets, Google search results, articles) users consume can be recorded by the extension: for example, when users hover on a Facebook story for more than 5 seconds, the extension would trigger a function to extract and parse the HTML under the cursor so we can get the content of the story, including text, images, videos, etc.

Demo code of extension function to extract and parse the HTML under the cursor

Demo code of extension function to extract and parse the HTML under the cursor

2. Natural Language Processing (NIP)

In this step, we analyze the content we retrieve from the 1st step and tag the content. For example, we'll use Text Analytics and Natural Language Processing algorithms to parse and tag the topics of the tweets. See also reference here

Example of Natural Language Processing to parse and tag topics of the tweets.

Example of Natural Language Processing to parse and tag topics of the tweets.

3. Information aggregation

The tags of the content consumed will be aggregated in this step to show the browsing footprint.


It was common that when user login and the website asks for authorization of accessing and storing (periods vary) user personal data. There are potential risks regarding the safety of user data and who are authorized to keep them. Especially in the context of recording user online behaviors, those data can be super sensitive and are highly concerned.  


The website should attain consent from users at the registering stage to ask for permission of accessing, tracking and parsing user online behaviors. Users can also choose to either admit partly access, as for specific sites only or admit accessing all of the data. 

The website should not keep user data, if the user specified, longer than a defined period of time per mutual agreement with the user. The website would not ask for identifying information of users at any stage of the user journey. 


A straight-lined, clear, and notebook-like design approach aims to simplify visual narrative in order to create a light, easy-to-use interface.

Wireframe tool: Sketch  Prototype tool: Principle, Photoshop

Wireframe tool: Sketch

Prototype tool: Principle, Photoshop

User Journey

Onboard --> Subscribe & Link --> Intake daily information --> See self & friends & the public footprints --> Reflect & Inspired

Group 3.png
Group 14.png
Group 9.png
Group 15.png
Group 18.png
Group 16.png
Group 10.png
Group 4.png


Trying a different data visualization to make the footprints narrative more expressive and immersive like a novel or a play?

An interactive storytelling

An interactive storytelling

This project attempted to shift the conventional linear narrative to a self-structured narrative. It allows users to generate own story from learning the past. But it takes efforts - users will have to be able to interpret the data facts to gain insights. 

Since users are the player within the footprint narrative, why not an interactive storytelling? I want to explore this. 

Reference: we feel fine