UCLA Broad Art Center 4220
Professor: Lauren McCarthy (firstname.lastname@example.org)
(office hours: Wednesdays 5-6p, Broad 3246)
TA: Hye Min Cho (email@example.com)
(office hours: Thursdays 12:30-1:30pm, Conditional Studio -- room directly across from bathrooms on the third floor)
This course has two goals. (1) To provide an introduction to writing code within the context of the visual arts. Writing code involves learning a different way of thinking and making. (2) To interrogate the concept of 'interactivity' and consider how this applies to art, design, and code. Through this exploration you may gain a deeper understanding of how users, viewers, and people experience your work. The ideas and skills taught in this course set a foundation for future Design Media Arts courses about the internet (161), game design (157), and media arts (159A, 171).
ExpectationsGrading. Grades will be determined according to the following breakdown:
- Project 1 10%
- Project 2 10%
- Project 3 10%
- Project 4 10%
- Project 5 10%
- Final project 25%
- Final project documentation 10%
- Participation 15%
Outstanding or exceptional work will receive As, good work will receive Bs, sufficient work that does nothing more than meet requirements will receive Cs.
Projects. Projects are due at the start of class on the date assigned via the project spreadsheet. Projects may be turned in up to one week late for a one letter grade deduction off the project grade. Work that is more than one week late will not be accepted. If you are absent, you are still expected to turn in projects online by the deadline. Extra time will not be given for work lost due to save issues, editor or browser errors, computer crash, etc. You should regularly click File > Download to save a copies of your work in progress as zip files. It would also be wise to make a backup of these online or on an external harddrive or USB stick in case your computer is lost.
Media. Each project will be accompanied by a collection of readings, videos, and other media to look at. You are expected to read/watch/consume each item listed. Doing so will make this class much easier and more enjoyable. If it is clear you are not doing this work, your project grades will lower. All of the assigned readings from the course will be from Getting Started with p5.js or located online, you will need to purchase this textbook.
Participation. Participation is critical to passing and enjoying this class. Do the work, share your thoughts, ask questions, prepare for meetings, offer feedback during critiques. This class is meant to be a safe space in which you feel encouraged and supported in learning and taking creative risks. This means being aware and considerate of different backgrounds, perspectives, and identities. Respect each other and this space we are building together. Don’t assume, ask. Remain open, be willing to take responsibility, apologize, and learn. Help each other in this. If there are concerns please let me or Hye Min know as soon as possible.
Attendance.You get one unexcused absence, no questions asked. Each unexcused absence after that will result in one full letter grade deduction. Three unexcused absences will result in a failed grade in the class. If there is an emergency and you must miss class, email Hye Min before class. Absences will not be excused after the fact except in extreme circumstances. Illness requires a doctor’s note. If you are more than 10 minutes late, you will be marked tardy. Three tardies results in one unexcused absence. Your attendance can be viewed here, any disputes should be discussed with the TA within two weeks.
Commitment to Diversity and Safer Spaces
We understand the classroom as a space for practicing freedom; where one may challenge psychic, social, and cultural borders and create meaningful artistic expressions. To do so we must acknowledge and embrace the different identities and backgrounds we inhabit. This means that we will use preferred pronouns, respect self-identifications, and be mindful of special needs. Disagreement is encouraged and supported, however our differences affect our conceptualization and experience of reality, and it is extremely important to remember that certain gender, race, sex, and class identities are more privileged while others are undermined and marginalized. Consequently, this makes some people feel more protected or vulnerable during debates and discussions. A collaborative effort between the students, TA, and instructor is needed to create a supportive learning environment. While everyone should feel free to experiment creatively and conceptually, if a class member points out that something you have said or shared with the group is offensive, avoid being defensive; instead approach the discussion as a valuable opportunity for us to grow and learn from one another. Alternatively if you feel that something said in discussion or included in a piece of work is harmful, you are encouraged to speak with the instructor or TA. (tx voidLab!)
UCLA strives to make all learning experiences as accessible as possible. If you anticipate or experience academic barriers based on a disability, please let me know as soon as possible. It is necessary for you to register with the UCLA Center for Accessible Education so that we can establish reasonable accommodations. After registration, make arrangements with me to discuss how to implement these accommodations.
|WEEK 1||M 1/7||
Assign Project 1
|WEEK 2||M 1/14||
DUE: Project 1
Assign Project 2
|Sa 1/19||Processing Community Day at DMA|
|WEEK 3||M 1/21||MLK Day: no class|
DUE: Project 2
Assign Project 3
|WEEK 4||M 1/28||Studio|
DUE: Project 3
Assign Project 4
|WEEK 5||M 2/4||Studio|
|WEEK 6||M 2/11||
DUE: Project 4
Assign Project 5
|Tu 2/12||Astra Taylor film: "What is Democracy?", 6pm EDA|
|F 2/15||Optional DUE: Gif for lenticular print|
|WEEK 7||M 2/18||Presidents Day: no class|
|Tu 2/19||Astra Taylor, 6pm EDA|
DUE: Project 5
Assign Final Project
|WEEK 8||M 2/25||
DUE: Final Project Proposals
Individual meetings / Studio
|WEEK 9||M 3/4||Studio|
|WEEK 10||M 3/11||DUE: Final Project|
|W 3/13||No class meeting. Work on documentation. Office hours 10-12pm in rm 3246.|
|F 3/15||DUE: Final Project documentation|
Projects are due at the start of class on the date assigned via the project spreadsheet. Projects may be turned in up to one week late for a one letter grade deduction off the project grade. Work that is more than one week late will not be accepted. If you are absent, you are still expected to turn in projects online by the deadline.
Project 1: Still life (DUE 1/14)
Project 2: Mask (DUE 1/23)
Project 3: One Loop Story (DUE 1/30)
Project 4: Tool (DUE 2/11)
Project 5: Influence (DUE 2/20)
Final Project: Iterate and Refine (DUE 3/11)
Final Project Documentation (DUE 3/15)
Document your final project with text description, code, AND a short video OR a series of images/screen captures OR some combination of video and image. Videos can be uploaded to Vimeo for easy embedding. Load the code link or iframe, video, images, and any other content along with title and text description into a project page in the DMA Gallery: gallery.dma.ucla.edu.Embeddding p5.js notes:
- To embed your project, go to File > Share and select the embed code.
- Paste this code into the project on Cargo.
- To adjust the size, you can add width and height properties. Note the position of the this addition within the iframe tag carefully.
<iframe src="https://editor.p5js.org/lmccart/embed/uprADnWVR" width="720px" height="400px"></iframe>
- To remove the border, you can set style properties. Note the position of the this addition within the iframe tag carefully.
<iframe src="https://editor.p5js.org/lmccart/embed/uprADnWVR" width="720px" height="400px" style="border:none; outline:none;"></iframe>
- If you don’t have a Cargo account, please email Chandler McWilliams and he will send you a free invite. It is highly recommended you do this well in advance of Friday night as he may not respond right before the deadline.
- If you have a Cargo account but aren’t in the DMA group, you can join it here.
- Once you've joined the group, you should see a box at the bottom of your edit panel that says "Share this Project". Check "DMA Cargo Gallery".
- Tag your project with "28_F2019" so we can view everyone's work together.
Enter the Cargo URL of your project documentation into the projects spreadsheet by 11:59pm on 3/15.
- p5js.org - p5.js website, includes library, reference, examples, and tutorials
- Getting Started with p5.js
- p5.js forum - good place for p5.js programming questions
- Daniel Shiffman's Coding Train videos - p5.js tutorials
- Getting Started with p5.js - by Lauren McCarthy, Casey Reas, and Ben Fry, O'Reilly 2016
- Intro to programming for the visual arts with p5.js - online class from kadenze, free with sign up
- You Don't Know JS
HTML & CSS
Class Notes & ExamplesWeek 1
- Conditional Design Group: manifesto, archive, knots, hatching, convex city plan
- coding+interactivity references slides
- Bla Bla Bla
- Guerilla Girls
- LaTurbo Avedon (interview)
- Anna Luisa Petrisko
- Angela Washko, Gaming Interventions
- Micha Cárdenas, Becoming Dragon
- Daito Manabe, Face Visualizer and Expression Transfer
- Neri Oxman, Rottlace
- Heather Dewey-Hagbord, Stranger Visions
- Zach Blas, Face Cages and Facial Weaponization Suite
- Jillian Mayer, MakeUp Tutorial HOW TO HIDE FROM CAMERAS
- Kid Pix 1.0
- Skin Deep, Alon Chitayat and Rosalie Yu
- Jeffrey Alan Scudder - No Paint, Soft Wallpaper, Finger Quilt
- Morehshin Allahyari and Daniel Rourke, The 3D Additivist Manifesto
- Ivan Sutherland, Sketchpad, 1963
- Tips for Debugging (thanks NYU ITP Residents)
- Jenny Odell, Satellite, Satellite Landscapes, Mouths, and Signs of Life
- Sam Lavigne, ICE Propaganda Videos, Baabaa, and Online Shopping Center
- Juliete Gil, Beach Sand Wallpaper
- Everest Pipkin
- Sosolimited, ReConstitution
- Parag Mital, News Mashup and Music Mashup
- Keiichi Matsuda, Hyper-Reality
- Joanne McNeil, POV
- Ben Grosser, Facebook Demetricator and Safebook