In this contribution we present a didactical framework, meant for design students, to teach coding as an expressive tool. We dubbed it "draw with code", and it reflects a specific approach to programming aimed at creating expressive artifacts instead of purely functional ones, known as Creative Coding. It is the result of an experience of four years running an elective course in a polytechnic school. Although seen as a marginal practice in our faculty, teaching creative coding is aligned with the learning goals of a design degree. Coding fits in the design process because it's an iterative practice that fosters creative feedback loops: playing with technologies leads to new possible solutions, rapidly coding prototypes nurtures evolution and improvement of concepts and ideas. Furthermore, coding skills facilitate cross-disciplinary collaborations, because coding itself already permeated into many other fields like art, computer science, statistics, digital humanities and many more. However, education about coding in our design faculty appears fragmented and the lack of overall literacy, combined with the lack of confidence in being able to succeed in learning it, leads design students to the avoidance of this practice. Starting from the aforementioned motivations and problems, we aim to teach designers how to deploy coding in their workflow and we articulated a strategy aimed at achieving this goal by 'drawing with code'. In this setting, the teaching of coding is framed as the accomplishment of a series of tasks that result in the production of visual artifacts. Such outcomes are familiar to communication designers because aligned to what they are supposed to realize in their profession. Our aim is to create the conditions to turn coding into a valuable resource for designers, that can be combined with more traditional ones like sketches, prototypes and mockups. This goal is reached in a process that is three-folded: first, we introduce the basics of programming and computational thinking to design students; second we highlight scenarios where coding can be used to sketch ideas and develop working prototypes that focus on expressive goals; third we encourage students to understand open-source ethics by using code available online and by releasing and documenting their project with the same approach. To achieve these goals, CC is structured in a teaching framework based on four pillars: Pragmatic and visual technology: we chose a solution (JavaScript coupled with the ”p5.js” library) that allows students to quickly see, in a visual form, the results of their actions; Hands-on sessions: lessons are based on live coding lead by instructors, and personal experimentations; Coding exercises: students skills are evaluated through weekly assignments and one hackathon; Group project: A final assignment that focuses on using coding practices to convey a specific communication aim and that also requires the production of documentation that verbally deconstructs and explains their code in a way that highlights design challenges and technical solutions. By showing results derived from the different editions of the course, we explain what communication design students with low literacy in coding can achieve in the timeframe of a semester, supporting the idea that 'draw with code' is an effective framework for teaching programming in a design faculty.

“Drawing with code”: the experience of teaching creative coding as a skill for communication designers

andrea benedetti;tommaso elli;michele mauri
2020-01-01

Abstract

In this contribution we present a didactical framework, meant for design students, to teach coding as an expressive tool. We dubbed it "draw with code", and it reflects a specific approach to programming aimed at creating expressive artifacts instead of purely functional ones, known as Creative Coding. It is the result of an experience of four years running an elective course in a polytechnic school. Although seen as a marginal practice in our faculty, teaching creative coding is aligned with the learning goals of a design degree. Coding fits in the design process because it's an iterative practice that fosters creative feedback loops: playing with technologies leads to new possible solutions, rapidly coding prototypes nurtures evolution and improvement of concepts and ideas. Furthermore, coding skills facilitate cross-disciplinary collaborations, because coding itself already permeated into many other fields like art, computer science, statistics, digital humanities and many more. However, education about coding in our design faculty appears fragmented and the lack of overall literacy, combined with the lack of confidence in being able to succeed in learning it, leads design students to the avoidance of this practice. Starting from the aforementioned motivations and problems, we aim to teach designers how to deploy coding in their workflow and we articulated a strategy aimed at achieving this goal by 'drawing with code'. In this setting, the teaching of coding is framed as the accomplishment of a series of tasks that result in the production of visual artifacts. Such outcomes are familiar to communication designers because aligned to what they are supposed to realize in their profession. Our aim is to create the conditions to turn coding into a valuable resource for designers, that can be combined with more traditional ones like sketches, prototypes and mockups. This goal is reached in a process that is three-folded: first, we introduce the basics of programming and computational thinking to design students; second we highlight scenarios where coding can be used to sketch ideas and develop working prototypes that focus on expressive goals; third we encourage students to understand open-source ethics by using code available online and by releasing and documenting their project with the same approach. To achieve these goals, CC is structured in a teaching framework based on four pillars: Pragmatic and visual technology: we chose a solution (JavaScript coupled with the ”p5.js” library) that allows students to quickly see, in a visual form, the results of their actions; Hands-on sessions: lessons are based on live coding lead by instructors, and personal experimentations; Coding exercises: students skills are evaluated through weekly assignments and one hackathon; Group project: A final assignment that focuses on using coding practices to convey a specific communication aim and that also requires the production of documentation that verbally deconstructs and explains their code in a way that highlights design challenges and technical solutions. By showing results derived from the different editions of the course, we explain what communication design students with low literacy in coding can achieve in the timeframe of a semester, supporting the idea that 'draw with code' is an effective framework for teaching programming in a design faculty.
2020
Proceedings of EDULEARN20 Conference
978-84-09-17979-4
Creative coding, communication design, teaching methods
File in questo prodotto:
File Dimensione Formato  
[Benedetti et al. 2020] Drawing with code- the experience of teaching creative coding as a skill for communication designers.pdf

Accesso riservato

: Publisher’s version
Dimensione 195.54 kB
Formato Adobe PDF
195.54 kB Adobe PDF   Visualizza/Apri
INTED2020-scientific-committee.pdf

Accesso riservato

Descrizione: Descrizione del comitato scientifico
: Publisher’s version
Dimensione 1.03 MB
Formato Adobe PDF
1.03 MB Adobe PDF   Visualizza/Apri

I documenti in IRIS sono protetti da copyright e tutti i diritti sono riservati, salvo diversa indicazione.

Utilizza questo identificativo per citare o creare un link a questo documento: https://hdl.handle.net/11311/1143475
Citazioni
  • ???jsp.display-item.citation.pmc??? ND
  • Scopus ND
  • ???jsp.display-item.citation.isi??? ND
social impact