The proportion of Women and Man still differentiates in a lot of areas of life. This divergence is also strongly visible in the elected majors of education.
With Gender-Study-Contrast, we visualise this ratio between studying women and man in the canton of Zurich over the last decade.
Concept video (currently only in german)
Visualise the progress of gender ratio
During our research, we stumbled over a study of the department of equality in the city of Zurich. The study focuses on the development of the percentage of women in education over the last decade. Our goal was to visualise this progress of gender ratio at Zurich's universities in a specific, precise and interactive way. All data is based on an open-dataset by the education statistics of the canton Zurich.
Expanding bar charts
We intended to build a system based on vertical bar visualisations. One row always represents the gender ratio in every section. It is possible to dip into specific bars to get more precise data about the chosen segment. It is possible to explore, filter and compare all data from university, faculty and mayors over the last decade with just a few clicks.
Work in progress - assets and colour exploration
From wireframes to a working prototype
We started with simple wireframes in Balsamiq to fix the main structure of our visualisations. In this phase, we also experimented with more complex ideas and arrangements and with first user test, we tried to break our wireframe down to the essential.
Wireframes, exploring & setting the main structure of the UI architecture
It is in this phase that we came up with the expanding bar charts. Furthermore, we introduced breadcrumbs to jump in between the different layers. In the next step, we focused on a colour palette and played around with gradients that would harmonise together and give each element enough contrast, so the user won't get lost.
UI Architecture & an overview of all the detail from the final visualisation
Through our user test, we found out, that it would be meaningful to jump in-between years of one faculty to compare the data and visualise in which years there has been an in-/decrease of gender in specific faculties.
We also intended to code the whole visualisation as an online prototype. We used the data-driven d3.js library and the dataset from the education statistics of bista.
Exploration of different visualisations and designs for the graph inside the faculty layer
UX Architecture
The whole visualisation is divided into three layers. First, the user can choose a year, the second layer is focussing on the different schools and universities, and the third layer is dedicated to the faculty. The height of the bars always represents the total amount of students.
3-layer architecture with the possibility to change into any layer at any time
In a more detailed look, the user can see and compare the progress of a single faculty over the last decade. A simple point-graph shows the progression
The final graph helps compare a faculty over the last decade without leaving the layer
Insights gathered through the visualization
There is an increase in women who are studying (still counting). Despite the rise in women studying, the university ETH is still male-dominated. The amount of male is more significant in sectors of economics, sciences and technics. However, the amount of women is more significant in humanistic disciplines, social sciences, veterinary medicine and teacher training. In mayors who are provided by Zurich University and ETH, most women start studying at Zurich University.
We had the chance to display a working prototype of Gender-Study-Contrast at the Grafik 15 exhibition in Zurich.
Our working prototype can still be tested here.
