Topic outline

  • Design and Data

    How can information designers contribute to the exploration of complex phenomena through data representation? The course aims at integrating tools for data analysis and representation in the design process, by building an interactive web-based data visualisation platform.

    Course Teachers: Cerioli Nicola <nicola.g.cerioli@aalto.fi>

    Responsible/Supervising Teacher: Rupesh Vyas <rupesh.vyas@aalto.fi>


    Course Structure:

    The structure of the course is hybrid: including tutorials, theoretical lectures, personal work, and open discussion. At the end of the course, the students are required to deliver an interactive visualization; additionally, Exercises are proposed weekly.


    Learning outcomes:

    The students will be provided with a set of methods and tools and will have a hands-on introduction on how to integrate them into the design process. More precisely, the covered areas will be:

    • quick data visualisation tools

    • data scraping tools

    • SVG manipulation 

    • visual languages to represent complex phenomena

    • building web-based interactive data visualisations in d3.js

    After the course, the students will be able to build interactive data visualizations and be independent in expanding their programming knowledge. 


    A critical view on: 

    • quantitative research in the context of data representation

    • the challenge of complexity


    Before you start the course

    Basic knowledge of HTML and CSS is required, otherwise, make sure to follow this tutorial before the beginning of the course 

    Basic knowledge of google sheets or other data wrangling tools. 
    Please, have the following software installed on your computer:

    Visual Studio Code

    Gephi

    an SVG editor (like Adobe Illustrator or any equivalent) 

    Have a google account in order to comfortably use google spreadsheets or have Microsoft excel


    Course Schedule: 

    Week 1 

    Day 01: 13-01-2021: 

    09:15-12:00 – Introduction to the course

    Day 02: 14-01-2021

    09:15-12:00 –  Scalable Vector Graphics

    13:00-17:00 – Javascript session 1

    Week 2

    Day 03: 20-01-2022

    09:15-12:00 – Javascript session 2

    Day 04: 21-01-2022

    09:15-12:00 – d3.js session 1, what is d3

    13:00-17:00 – d3.js session 2, data visualization in d3

    Week 3

    Day 05: 27-01-2022

    09:15-12:00 – Data scraping tools

    Day 06: 28-01-2022

    09:15-12:00 – d3.js session 3, interactive data visualization

    13:00-17:00 – d3.js session 4, filtering

    Week 4

    Day 07: 03-02-2022

    09:15-12:00 – d3.js session 5, nesting

    Day 08: 04-02-2022

    09:15-12:00 – d3.js session 6, trees

    13:00-17:00 – network visualization

    Week 5

    Day 09: 10-02-2022

    09:15-12:00 – d3.js practice

    Day 10: 11-02-2022

    09:15-12:00 – d3.js practice

    13:00-17:00 – d3.js practice

    Week 6

    Day 09: 17-02-2022

              09:15-12:00 – d3.js practice

    Day 10: 18-02-2022

              09:15-12:00 – d3.js practice

              13:00-17:00 – Final Presentation


    • Forum icon
      Announcements Forum
    • Forum icon
      Announcements Forum
    • Forum icon
      General discussion Forum
    • Forum icon
      Issues Forum
    • Assignment icon
      Projects Bundle Assignment

      Upload a folder containing:

      A – The final project folder
      In case you're not the only author, attach a text file specifying your contribution 
      Make sure the folder contains everything (data, scripts, styles, fonts) in order for the website to run.
      (Note: even if your website is online, you will need to upload the website folder; a link is not enough)

      B – The sketches
      All the digital sketches you produced during the process.

      C – All the exercises
      find the list here: https://docs.google.com/document/d/1JhCGsDHPdG8_kYZ01-QwIy0wTegWEHoc__zOTZXfB7U/edit?usp=sharing