Graduate Studio: Technology A [Class Notebook] (DES-720A-02)

Week 1

This week, we’ll get introduced to the course and take a look at what we’ll be aiming to achieve.

Class Notebook

Ashlyn Pelletier

I decided to create a petri dish, with multicolored bacteria. In attempting to make it feel more alive, I created a gradient in PS and added it in. For next steps, I would like to make the bacteria actually move!

ChihLin Han

This week was my very first time using P5.js, and I found the entire process both fascinating and challenging. Navigating a completely new tool naturally came with a learning curve, but exploring its features made the experience really fun. Getting everything placed precisely where I wanted required a lot of trial, error, and patience. However, seeing the final layout come together after all those adjustments was good.

ChihLin Han

To me, code is the unique fingerprint and identity embedded in everything.

Kexin Chen

I learn what is code.

Kexin Chen

What difference between code and traditional design tools

Lamees Kazi

I learned how to place shapes and colors with a better understanding of the grid I create myself. What is the line between code and a language?

McCauley Bair

Learned about the history of communication technology and how to draw simple shapes in p5.js.

Meera Narayankar

This week, I learned how to use p5.js for coding and experimented with creating basic gestures and 2D animations. It helped me understand the fundamentals of motion, interaction, and animation through code.

Meera Narayankar

I was asked to think about what code means to me and It made me look around at the world differently and notice the different systems, patterns, and ways of communication that exist around me. I was able to stop and observe things that I usually overlook and think about how I interpret and understand them as different forms of code. These are some of the ideas and interpretations I was able to come up with.

Patricia Bogdan

I gained a better grasp of how to plot each shape relative to the size of the rest of the canvas, and began inferring which coordinates each element would require as I got more used to writing the code. I'd like to learn how to add motion to each ellipse.

Sofia Lentz

I learned how to create shapes in P5. What are shortcuts (if any) when creating a pattern instead of retyping same lines repeatedly?

Viviann Hoang

For the first time, I learn how to code. Although it is not easy, I'm getting more and more familiar with guessing the anchor points. I learn that in order for the code to work according to what I want, it needs clear, precise instruction and follows a certain order. This encourages me to think in systems (step 1, step 2), identify points and also systemize the visual elements.

Viviann Hoang

Code can really be anything. It is anything that is used to represent information.

Yihan Zhou

This week, I learned coding for the first time and learned how to use p5.js to create visual effects. This was a new skill for me, and I found that code is a really interesting design tool!

Hello Class!

Week 1 Introduction

The password for these figma files is “pratt”.

Coding Assignment 1

Submit Assignment

Due: Sep 1, 2026

Try out the p5.js Editor and create a simple sketch that draws a shape or pattern. You can use the p5 reference to look up functions and examples. Save your sketch and share the link in the class forum.

Try to explore the following functions: createCanvas(), background(), fill(), stroke(), rect(), ellipse(), and line(). You can also experiment with variables, loops, and conditionals to create more complex patterns.

How is it different from using a traditional graphics software like Illustrator or Photoshop? What are the advantages and disadvantages of using code to create graphics? Write a short reflection (1-2 paragraphs) and submit them along with your sketch link in the above sheet.

Writing Assignment 1

This assignment is part 1 of project Creative Cryptography.

Submit Assignment

Due: Sep 1, 2026

What is code? Like we discussed in class, code can be defined more broadly as a hidden language that allows use to encrypt, transmit, and decode information. In this assignment, you will explore the concept of code in a more abstract way.

For instance, a textile pattern can be seen as a code that encodes information about the culture, history, and identity of a community. Similarly, a musical composition can be seen as a code that encodes information about the emotions, experiences, and perspectives of the composer. If you need inspirations, this book by Charles Petzold on Code is a great start.

What is code to you? How do you see code in your everyday life? More importantly, how can code be used to encrypt messages and information? Bring 5 ideas to class next week and be ready to discuss them. Each idea should be a short paragraph with found images, photographs, sketches, videos, or any other media that you think can help illustrate your idea.

Readings

This is not a must, but a beautiful writing from Andrew Blauvelt traces graphic design’s transformation through three key phases: the pre-digital craft era, the digital disruption of the 1980s–90s, and the current “postproduction” era.

Tutorials