Full Stack Engineer / Product Designer

Chinese-Canadian Stories

Chinese-Canadian Stories

Oct '11 – Feb '12  |  Interaction Design, Visual Design


Chinese-Canadian Stories was a project that aimed to tell the story of 100,000 Chinese immigrants to Canada from 1885 to 1949 through data visualisation. 

Our team produced two data visualisations, meant as both tools for academic researchers to surface trends which existing tools like ArcGIS could not, and accessible and visually appealing ways for hobbyists and the general public to learn about Chinese immigration history.

We used a huge dataset containing the records of every Chinese immigrant to Canada from 1885 to 1923 when the Chinese head tax was in place. It spans 64 years, and included 50+ fields with details down to height, port of departure in China, and even the vessel taken to Canada. The project took 4 months of extensive data exploration, sketching, trial and error. The images illustrate some of the steps taken on this incredibly rewarding journey.

The project was a collaboration between Stanford’s Spatial History Lab and Professor Henry Yu at the University of British Columbia.

My Role

Interaction/Visual designer, Research Assistant

Other Contributors

1 Research Assistant, 1 Programmer, 1 Program Manager


Visualisation 1 – Pipeline

Visualisation 2 – Timeline

Early Ideas

Our brief from UBC was open-ended, and so I started the project by using Tableau to explore the data and see what trends we could find. Something that immediately stood out to me was how many migrants made the journey from West to East after arriving in Canada, which made me think of creating a subway-like map showing the continued journey past the ports of landing in Vancouver and Victoria. I also found clear connections between certain 'districts' in China and the cities the migrants moved to in Canada. This lined up with Professor Yu's interest in "chain migration" as one possible area of interest to visualise – seeing relatives or friends from the same village migrating to the same place in Canada, and spreading to the nearby towns. 

Sketch of idea showing flow of migrants as a subway-style map, with line thickness representing number.

Sketch of static visualisation, focused on highlighting connections between certain Chinese villages and Canadian cities.


Mock illustrating 2 trends – drop in average age of migrants, and increase in students (rather than labourers) arriving in Canada.

As the project progressed, I spotted big changes in migration patterns from 1912 to 1923 – a particularly interesting period because of World War I (1914–18), and the Chinese Exclusion Act (passed 1923). There were 3 key trends – a big drop in average age of migrants, a shift from labourers to students, and a big drop in number during the early years of the war, and then a surge in 1917.

I started focusing on animated visualisations and demonstrating change over time rather than the static ideas I initially had. The image on the right show a mockup of a split screen that shows change in number on the left and change in composition on the right.

We ran with the design in the last mockup for a month, but worried it represented data too abstractly, losing sense of movement in the journey. It also was hard to focus on 2 panels at once, and wanted to move back to a single-panel visualisation. The wireframe shows a revised idea I had that restores the geography to emphasise the long journey another 3000 miles across Canada, and also integrates the panels into a single area to give a more cohesive view.

Wireframe/mockup that became the final design (this was before I knew anything about appropriate use of colour).

Final Designs

This idea became one of our final visualisations, with visual design help from the Spatial History Lab staff, who introduced me to Edward Tufte and the appropriate use of colour in maps.

We felt like this tool was more geared towards passive consumption, and wanted to make a more exploratory visualisation with some guidance, for more interested users. This became our second visualisation, which focused on connecting immigration trends to specific historical events, and allowed users to dig more into the connection between particular Chinese districts and Canadian cities.

Explaining the various ways users could interact with the exploratory visualisation.

Pipeline visualisation set to show occupational composition of migrants.