• users can see who is tracking them over a long period of time.

  • exploring deep time.

  • interaction with treemap concept.

  • variations of filtering methods and user control.

  • tracking trends & patterns of browsing over time.

  • analytical axis approach.

  • interaction with the "three panels" concept.

  • analyzing of browsing trends & behaviours.

hypothesis #2
The second design hypothesis provided a tool for people already knowledgeable of privacy issues and third parties. Experts, power users and inquiring citizens could use the interface to explore the relationships of trackers to their enabling Web sites, and can look for patterns over time in either their own data in the near term or in larger anonymized aggregated datasets in the future. The hypothesis provided a analytical perspective of online tracking.

three panels

The hypothesis introduced the user to deep time with a high level of details. It functioned as an analytical tool targeted towards people and researchers with a keen interest in third parties, people that wants to dive deeper into their data and see trends and patterns over time.

The user interface would give the user an opportunity to see how each third party connection is behaving over time. This information includes what sites they connect to, how many connections points they have etc. The compositions were focused on giving the user the ability to change certain parameters as well as the order of the elements to find new and interesting patterns.
The early iterations were based on a setup of three panels. The middle window showing the browser history, the bottom one showing the cookies and the top one trying to combine these two and show a graph representative to the level of tracking.

As the visualization took shape important ways in which the viewers might want to see their data became evident. Showing tabs or the direct path between sites was one of these challenges.


The opportunity for an analytical approach became possible through the first iteration, but the panels had to be simplified and combined in a orderly manner. The result was a visually simpler model with a more intuitive UI. In this composition the browser history is represented through the bigger squares on the top row, while the smaller squares underneath are the cookies from that site. The graph on top visualizes each third party and how their level of tracking grows over time.

When highlighting a third party at the top, each page connected to that third party as well as their cookies get highlighted. The concept is in many ways focused on the intensity of third parties.

tree map

Another approach was based on the tree map model. Here the user could see which third party is the most active based on the sizes of the squares. By clicking on a page in the browser history the user gets access to what third party have been connecting to him or her through that site as well as how many of the cookie transfers that were specific to that page.

Each third party is represented as a blue square. The size is based on the amount of third-party HTTP requests, while the darkness is based on the tracking time. Highlighted information is portrayed on the third parties and is written out in full sentences to humanize the subject. The third parties would resize to become legible when being clicked.
By clicking on a third party the user can get a better look. The visualization window automatically resizes and zooms. Important information could now be read on the third party. This information includes the amount of http-requests, tracking time and what sites that enable the most third parties. In the side panel the user can now see what servers that have contributed to that specific third party and at what time.

The user can at any time swap what information he or she want to display in the visualization window and in the side panel. The slider could be puller over allowing the pages to be displayed in the visualization window and the third parties in the side panel.

control panel

When the user entered Collusion, he or she would be greeted with a personal message, giving them new information about their third party connections. On the bottom the latest statistics were easily available. The “Timeline” column updated according to the set time frame in the visualization window. The visualization window contained all the third parties, their connection points, as well as the browsing history. Each third party was represented as a green line, whereof the actual connection points were the darker green squares. The browsing history is displayed underneath and servers were represented by their icons. The slide bars could slide in time, and the ends could be pulled to zoom in or out. The Y-axis represented the total amount of connection points a third party had.
When the user selected a third party the other third parties and servers not connected woulc fade out. Green lines drop down to show where the cookies came from. The numbers represented the amount of connections that were made while visiting that server at that time. If an element stretches outside of the window, double-clicking on the element would resize the window to show all the connections.

raw data analysis

Vast amount of data was also collected and organized. These visualizations aimed at helping the research and give a clear image of where the intensity of data could be found and how to deal with it.