Is The Tech Industry Sexist?

Visualizing Women in Tech



Duration
3 weeks

Tools
Sketch
HTML/CSS/Javascript


collaboration
Team of 2
The Challenge

Students were asked to deliver a free project with data of our choice.


My role
  • Created the visual theme for the project.
  • Contributed to setting the narrative and finding the data.
  • Coded charts 1 and 3.

Output
A with 3 interactive visualizations with the data we found and cleaned


Setting Narrative & Finding Data

We chose women in tech as our topic and decided on how to structure the story as well as finding the necessary data.



Visual Concept

I tried out various sets of typography, webpage layout and color schemes. For the project proposal, I arbitrarily chose one of them to present in class in order to facilitate thoughts and feedbacks. Based on the remarks, I went on to craft a real, carefully designed visual theme. I took extra effort to choose color schemes that don't comply with sexual prejudice but still don't confuse the viewers and set the tone of the visual narrative. Below are some of the ideas.






Design Elements


Color Palette
Women
men




Typography Headline h2: Used for the sub-titles

Headline h4: Used for the titles of each charts

This is a paragraph. Used Work Sans 400 at 16px, with a 23px line-height in the color #282828.


Finished Visual Design

I finalized the visual design and started on creating static mockup with Sketch.






Working Website

We had to modify some of our visualizations according to the data we got. We fixed the style and code until the final presentation day. Below is the link to the project.






Reflection

We received a lot of positive remarks and constructive feedback on the presentation day, but as we tried to apply the feedback we learned that it was extremely hard to fix the look of the charts or implement another feature after it's been coded. It was a valuable opportunity to learn the importance of each of the design process and getting feedback early on.