These three exercises are due Monday, October 2nd. There are two creative coding projects, and some readings. For the sake of time management, it is recommended that you complete the Rhythm Loop project by the end of class on Wednesday, 9/27.
- OpenProcessing: Rhythm Loop: 2 Hours, 30%
- Discord: Timekeeping Readings: 1 Hour, 10%
- OpenProcessing: Timepiece: 6 Hours, 60%
1. Rhythm Loop
(2 hours, 30%) In this mini-project, you will explore time-based visual rhythm by writing code to create a seamlessly looping, animated GIF. This is a mini-project, so keep it simple. The learning goals for this project are for you to develop command of time-based computational graphics, and sensitivity to temporal rhythm.
You have two required deliverables for this project, as follows:
- A p5.js program on OpenProcessing. Your animation should be square (640×640), between 30-300 frames long, and use no more than 4 flat colors. Using this, you must also generate….
- An animated GIF generated by your p5.js program. This GIF must be seamless. (Can you do that? As simple as it sounds, many students are unable to achieve this.) Optimize your GIF so that it is under 8MB in file size. Publish this animated GIF in a Discord post in the #rhythmloop channel, along with a few reflective sentences about your project.
Recommendations:
- Check out the work of professional loopmakers like Bees and Bombs, Melissa Rodriguez, Cindy Suen, Lucas Zanotto, Andreas Wannerstedt, Etienne Jacob, Paolo Ceric, DVDP. Seriously, do it.
- To make interesting non-linear movement, I recommend you use the p5.func library, which provides shaping and easing functions.
- For a place to start, consider working with the human walking loops in BMWalker.js; there’s a full-featured p5 demo here, and a simplified GIF-exporting demo here:
- To generate the GIF, I recommend that you use the p5.createLoop library to create a looping timer and export the animation. (This library can also provide seamlessly looping Perlin noise.) It’s also possible to export the GIF using the p5 saveGif() command, or the OpenProcessing Record feature (available under the Share button)…but you’ll need to do more work to ensure that the results are seamless.
- To optimize your GIF, I recommend you use ezgif.com.
- Here’s a template program that shows how to use p5.createLoop and p5.func together.
Here are some loops made by previous students in this course (Nik Diamant, Alyssa Lee, Paul Park):
2. Readings and Viewings: Timekeeping
(<1 hour, 10%) You are asked to enrich your understanding of clocks and timekeeping by reviewing and/or examining the following resources. These readings and viewings should take less than half an hour.
Attempts to mark time stretch back many thousands of years, with some of the earliest timekeeping technologies being gnomons, sundials, water clocks, and lunar calendars. Even today’s standard representation of time, with hours and minutes divided into 60 parts, is a legacy inherited from the ancient Sumerians, who used a sexagesimal counting system.
The history of timekeeping is a history driven by economic and militaristic desires for greater precision, accuracy, and synchronization. Every increase in our ability to precisely measure time has had a profound impact on science, agriculture, navigation, communications, and, as always, warcraft.
Despite the widespread adoption of technological standards, there are many other ways to understand time. Psychological time contracts and expands with attention; biological cycles affect our moods and behavior; ecological time is observed in species and resource dynamics; geological and astronomical rhythms can span millennia. In the twentieth century, Einstein’s theory of relativity further upended our understanding of time, showing that it does not flow in a constant way, but rather in relation to the position from which it is measured—a possibly surprising return to the significance of the observer.
Please look at the following 5 resources:
- Please read this this 5-page text about timekeeping (PDF; alternate link) by design theorist Johanna Drucker, from her book Graphesis: Visual Forms of Knowledge Production (Harvard Press, 2014).
- Please watch this excellent 6-minute YouTube video on the history of timekeeping devices.
- If you didn’t already watch it in class on Monday 9/25, please watch the first 13 minutes of A Brief History of the Calendar and Timekeeping, a YouTube lecture by Dr. Donna Carroll, Lecturer of Physics, Maastricht University.
- Browse or skim the Wikipedia History of Timekeeping Devices.
- Check out https://yourcalendricalfallacyis.com/. (It’s awesome!)
Now: In a Discord post in the #timeKeepingReadings channel, please write two sentences about something that stuck with you from any of these readings/viewings. What did you see that was interesting? Why was it interesting to you?
3. Timepiece
“Proposals for Clocks” by David Horvitz(6 hours; 60%) The interactive and dynamic control of visual media over time is a core concern in new media arts. In this project, you are asked to design a visualization that displays a novel or unconventional representation of the time. Your timepiece should appear different at all times of the day, and it should probably repeat its appearance every 24 hours (or other relevant cycle, if desired). You are invited to make the time legible through means other than Roman, Arabic, or Chinese numerals — such as by visualizing numeric bit patterns, or using iteration to present countable graphic elements.
Learning Objectives:
Through completion of this assignment, you will:
-
- Become acquainted with the history of systems and devices for timekeeping
- Devise technologies and graphic concepts for representing time that go beyond conventional methods of visualization and mediation
- Refine craft skills in the use of code to govern a spatiotemporal design, by effectively and expressively controlling shape, color, form, and motion
Try to devise a novel graphic concept. I encourage you to question basic assumptions about how time is represented. Feel free to experiment with any of the graphical tools at your disposal, including color, shape, transparency, etc. You’ll probably need to use the hour(), minute(), second(), and millis() functions, but you’re also welcome to use day(), month(), and year() functions in order to build a clock that evolves over longer timescales, lifetimes, etc. If your timepiece measures other phenomena, that’s fine too.
Requirements:
- Sketch first in your paper sketchbook. Consider things like biological time (chronobiology), ultradian rhythms and infradian rhythms, solar and lunar cycles, celestial time, geological time, decimal time, historical time, psychological time, and subjective time. (This list is not exclusive.)
- Create your clock using p5.js at OpenProcessing. You may choose the dimensions and aspect ratio of your canvas, including (if you wish) fullscreen.
- In a Discord post in the channel #timepiece, embed at least two images of your clock, showing what it looks like or how it behaves at different times of day. If your clock involves animation, embed an animated GIF or a brief video recording.
- In your Discord post, provide a link to your p5 sketch at the OpenProcessing web site.
- In the Discord post, write a couple sentences that describes your project (what is the concept, how is it made, how is a person meant to experience it). Write another few sentences reflecting on your work (what was successful, what was a struggle).
Here’s a template project that uses basic time functions in p5.js:
There’s also a Coding Train video about making clocks here.