Daniela Li

Product Designer

Data Journal

“Data” is not scary, is not necessarily “big”, and that you need to know almost nothing about data to start collecting and representing it.
—Dear Data

The graphs below show a person's daily commuting stats. Data supported from the Quid Company. From analyzing these simple data can probably tell something about personalities and personal habits. According to the guideline of data visualization that don’t put everything in one graph, the goal of graph should be clear and easy to read, I used two graphs to represent different parts of data.


  • Data Viz +

Data Calendar

A set of data to record a person's daily commuting, it is like a kind of routine life. I thought to use a calendar idea to represent the data. The X axis is a time line from 6am to 8pm, and the size of the point represents the miles of each commuting, by hover the date on the right, it shows the mileage. The goal of this graph is to express the dense time range and to make an intuitive way to show the mileage of each commuting.

Data Clock

When talked about routine life, I thought about clock, which is also a daily good for life. This graph shows five frequently visited places. When mouse hover the section border will show the frequency of route. It is easy to see the most three frequent routes are from Work to Home, Home to School, and School to Work.

My Process

Firstly I draw a mind map to explore my design opportunities and figured out the goal of this design exercise, analyzing a person's daily life to tell the personality and personal habits. I decided to use daily goods like calendar and clock to represents the topic.

Mind map Mind map

I did many research about data visualization, dear-data.com inspired me so much, and I found D3.js is a easy way to build a data-driven document (How shameful to admit this is my first time knew d3.js). I used two simple layouts to represent my idea. After drawing sketches and analyzing the data, I made the final graph as above.

If I have more time, I want to combine these two graphs in an aggregate way (connect these two graphs and make them can be separate and aggregated), and also add more date resource in the graphs.

 My Résumé

 daniela.muzili@gmail.com

Work About Blog

Work About Blog

Work About Blog