Översikt

  • Design and Data

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

    Course Teacher: 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; in addition, assignments will be given and discussed weekly.


    Learning outcomes:

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

    • sketching with data

    • visual languages to represent complex phenomena

    • building web-based interactive data visualizations 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: 

    • human data interaction

    • the challenges of complexity


    Before you start the course


    If you have no previous experience with web-based data visualization attendance at the introductory clinic is warmly recommended

    see the calendar and contact nicola.g.cerioli@aalto.fi or rupesh.vyas@aalto.fi to participate.


    Requirements

    Basic knowledge of HTML, CSS, and JS is required, otherwise, make sure to follow these tutorials before the beginning of the course 

    HTML and CSS :

    https://youtube.com/playlist?list=PL0eyrZgxdwhwNC5ppZo_dYGVjerQY3xYU

    JS (until video 21) :

    https://youtube.com/playlist?list=PL0eyrZgxdwhxNGMWROnaY35NLyEjTqcgB


    Basic knowledge of Google Sheets or other data-wrangling tools.

    Make sure to have Visual Studio Code installed.


    Also, make sure to have a google account in order to comfortably use google spreadsheets


    Course Schedule: 

    Week 1 

    Day 01: 11-01-2024

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

    Day 02: 12-01-2024

               09:15-12:00 –  Scalable Vector Graphics

               13:00-17:00 – Javascript session 1

    Week 2

    Day 03: 18-01-2024

                09:15-12:00 – Javascript session 2

    Day 04: 19-01-2024

               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: 25-01-2024

               09:15-12:00 – Interaction Models

    Day 06: 26-01-2024

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

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

    Week 4

    Day 07: 01-02-2024

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

    Day 08: 02-02-2024

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

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

    Week 5

    Day 09: 8-02-2024

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

    Day 10: 9-02-2024

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

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

    Week 6

    Day 09: 15-02-2024

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

    Day 10: 16-02-2024

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

              13:00-17:00 – Final Presentation