Code sketching is a methodology for quickly exploring visual ideas by writing software. Encoding design decisions in software forces us to consider visual design from a new angle. Designers who learn to enjoy writing code will think differently about their process. Using HTML, CSS, and Javascript students will develop a low-friction design processes that enables rapid prototyping and iteration. Through a series of exercises exploring gestalt principles of design, students will achieve a measure of code fluency and intuition. Students will use computation to explore large parameter spaces, guide stochastic digital mark-making, and generate new visual forms. No prior programming experience is assumed for this studio.
Students will leave this course knowing how to use web technologies to quickly publish and refine visual prototypes. They will understand fundamental programming techniques, and be comfortable developing ideas for feedback using HTML, CSS, and Javascript. Students will be able to articulate and defend their aesthetic choices.
5:30 – 6:20
Critique & Charette. Students present work from previous week at the start of the class. Students will critique the formal elements of the design, visual impact, legibility, and context of the work shown. Presenters will explain their intentions and process. Reviewers suggest next steps for strengthening, extending, or rethinking the design.6:20 - 6:30
Show and Tell. Each week a student will present an artists, musician, or designer who uses code as part of their creative process. Alternatively, a student may present a code sketching tool.6:40 - 7:15
Lecture. We will discuss key topics from the weekly reading. We will answer questions about the reading material. We will work through any programming exercises, or design concepts together in class.7:15 – 8:00
PS introduction. I introduce the next problem set. We work together to get started on the next week's design challenges.8:10 - 9:00
Work. Students work alone or in small groups on the weekly design challenges. This is a great time for students to help each other, or ask me for help.Students will show continuous improvement in their ability to execute and defend design solutions.
The grading system follows the University Policies.
Students will abide by Northeastern University’s Academic Integrity Policy.
Students are expected to attend all classes. Absence for health or personal reasons should be communicated to the lecturer. Tardiness and unexcused absences will impact student grades.
01 - 09-13
: SWC hello & introductions. reading: Handouts02 - 09-20
: Git, HTML, linking & publishing. reading: EJ.Intro, EJ.1203 - 09-27
: Advanced CSS, behaviors. reading: EJ.1, EJ.2 04 - 10-04
: Variables & loops. Canvas. reading: EJ.305 - 10-11
: Gestalt principles & JavaScript. reading: Dondis (handout), EJ.1306 - 10-18
: Interaction with the DOM. Exquisite Corpse reading: EJ.16 07 - 10-25
: More canvas and interaction . reading: EJ.408 - 11-01
: Simulation & emergent behavior reading: EJ.509 - 11-08
: Simulation part II and tweening animation. 10 - 11-15
: SVG & D3 Part I11 - 11-22
: D3 part II.12 - 11-29
: Libraries & Frameworks: ThreeJS.13 - 12-06
: Using API's and foreign data.14 - 12-13
: Further reading, other stacks. Final projects.