Mathematics and Digital Art, Fall 2017

Week 1

1 Wed, 23 Aug Download the course syllabus.

If you'd like to read more about the conferences mentioned in class today, click on Finland or Waterloo.

Click here to watch some animated fractal movies using Processing. You'll be making movies like this in the second half of the course!

Homework:
  1. Experiment with colors using these handy color sliders.

  2. Read Day002 of my blog, www.cre8math.com: Josef Albers and Interaction of Color.

Here are a few links to other websites with color codes: color-hex and ColorHexa. Let me know if you find any other good ones!
2 Fri, 25 Aug Here is the Processing code to download and get working. Just copy and paste the code into a new Processing document. Spacing is important, so make the margins are all exactly the same as the original!

Homework (for real RGB values, round to the nearest thousandth):
  1. Convert $(250,69,227)$ to hexadecimal and real RGB values.

  2. Convert #FEDCBA to integer and real RGB values.

  3. Convert $(0.627,0.486,0.918)$ to integer RGB values and hexadecimal.

  4. You want to use an integer RGB color code, but you don't want any red in it, so you set the R value to 0. How many possible colors could you use?

  5. You color in a unit square with lower left-hand corner $(0,0)$ and upper right-hand corner $(1,1)$ so that a point $(x,y)$ is assigned real RGB values of $(x,1,1).$ Describe what the square looks like. (Answer: click here to see what the square looks like.)

  6. You color in a unit square with lower left-hand corner $(0,0)$ and upper right-hand corner $(1,1)$ so that a point $(x,y)$ is assigned real RGB values of $(y,0,0).$ Describe what the square looks like.

  7. You color in a unit square with lower left-hand corner $(0,0)$ and upper right-hand corner $(1,1)$ so that a point $(x,y)$ is assigned real RGB values of $(1-x,1-x,1-x).$ Describe what the square looks like.

  8. You color in a unit square with lower left-hand corner $(0,0)$ and upper right-hand corner $(1,1)$ so that a point $(x,y)$ is assigned real RGB values of $(1-y,1,0).$ Describe what the square looks like.

Week 2

3 Mon, 28 Aug Download the Processing code for the assignment on Josef Albers.

For Wednesday, read Day011 of my blog on on randomness and texture.

For Friday, create your first digital artworks!
  1. First, choose the dimensions of your image, the size of your squares, the background color, a base color for the center rectangles, as well as ranges for the randomness in the red, green, and blue color values. By using different random number seeds, experiment with different images. When you find one you like, start assembling your assignment. After inserting this image, write a brief paragraph about the choices you made — remember, each parameter is a choice, even if you chose to leave it the same! Be sure to include a sentence or two about randomness — you used a particular random number seed because you liked the effect it had on the image.

  2. Next, create two more images, this time altering the geometry — there is much more out there than just rectangles and squares. Be creative! Again, experiment with different random number seeds, and also write a brief paragraph after each image explaining any aspects of the creative process that were significant in creating the final image.

  3. By the beginning of class Wednesday, upload drafts of your images onto Canvas. During class Wednesday, you will be commenting on each others' work, so it is important that you do this before class starts.

  4. By Friday, submit a .pdf document to Canvas including your three images and commentary. Use a name like (if it were me) "Matsko_Asst1.pdf". If someone made a suggestion on Canvas which you used to improve your work, acknowledge that person in the discussion of the relevant image.

Answers to Homework from Day 2:
  1. #FA45E3, $(0.980,0.271,0.890).$

  2. $(254,220,186),$ $(0.996,0.863,0.729).$

  3. $(160,124,234),$ #a07cea.

  4. 65,536.

  5. Click here to see what the square looks like.

  6. Click here to see what the square looks like.

  7. Click here to see what the square looks like.

  8. Click here to see what the square looks like.
4 Wed, 30 Aug Be sure to comment on everyone's work today during class. In addition to the handout, here is a useful website discussing the vocabulary of digital art by Kimberly Dillbeck.

Remember that your comments are due Friday! Because of the time needed to write comments, your assignment is now due Sunday. And be sure to have read the blog post, since we'll be working on a related project in lab on Friday.

You will have a quiz next Friday on color specification and coordinates. Download a previous quiz for some practice questions. We'll go over the answers next Wednesday in class. ($\LaTeX$ code; solutions.)
5 Fri 1 Sept Download the Processing code we'll be using in class today.

Over the long weekend, it would be a good idea to do the practice problems from the quiz, and experiment with today's code. You'll receive an assignment to produce some artwork with them next week.

Week 3

6 Wed, 6 Sept Download the Processing code on the Evaporation piece we'll be using in class today.

Your second assignment will consist of three images and descriptions. You should create one image using the randomColor function, one image using the randomTexture function (both from last Friday's class), and one image using the evaporation function (from today's class). For each image, give a complete list of the parameters you used, and a discussion of why you chose those parameters. Add additional commentary as necessary. Put this all in a .pdf file, with your last name included in the file name.

For the randomTexture function only, I do not want you to alter the code at all. Do not use the myshape function, or do anything except changing the five numerical arguments to the function call. For the other two pieces, you may be as creative as you like, changing the shapes of the squares or circles, overlaying multiple calls to the same and/or different functions, etc.

For Friday's class, upload drafts of each of these pieces onto Canvas. After the quiz, we'll be working on written comments of other students' work. This time, you will only need to comment on one piece for each other student in the class.
7 Fri, 8 Sept Your assignment on color and texture is due Monday. Please reread the instructions from this past Friday and be sure to upload the assignment on Canvas!

Week 4

8 Mon, 11 Sept Here is the image you need to create for today's class about screen space. Your image should look exactly like this. Here are the specifics you need to know:
  1. The screen is 800 pixels wide and 600 pixels high.
  2. The dimensions of all rectangles and squares are in multiples of 50 pixels.
  3. The margins and spaces between all figures are 50 pixels wide.
  4. The diameter of the circles is half the length of the sides of the squares they are inside of.
  5. The outlines of all the figures are 3 pixels wide.
  6. The colors are the usual: red, orange, yellow, green, blue, cyan, magenta, black, and white.
  7. You should only use the rect and ellipse functions (not myshape). Also, you should use whatever stroke/fill functions you need.
Finish this by Wednesday!
9 Wed, 13 Sept Here is today's Processing code illustrating affine transformations.

Recall that we ultimately want to be able to create fractals like the Sierpinski triangle. Make sure you review translations, scaling (both in the x and y directions), and reflections about the x- and y-axes.

Here is a handy summary of affine transformations.

Here is your affine transformation homework due Friday. ($\LaTeX$ code.)
10 Fri, 15 Sept Here is today's Processing code illustrating Sierpinski's triangle.

Here is your affine transformation homework due Monday. ($\LaTeX$ code.)

Feel free to experiment with creating your own fractals! You will eventually need to create your own....

Week 5

11 Mon, 18 Sept Here is the fractal image we discussed in class. For your lab today, use the same technique to create this fractal image. We will continue to work on this in class Wednesday.

Next week will be our first Presentation Week! Here's what you should do:
  1. First, select a paper at least six pages long from the Bridges Archive. The paper does not have to necessarily relate to what we've been discussing in class. In fact, I encourage you to learn about something completely different!

  2. Next, post the title and author of your paper on the Discussion Board dedicated to this topic. No paper may be presented twice, so you might want to choose early to get the paper you want. (You can't choose Nick's or my papers.) Do this by Wednesday.

  3. By Friday night, email the/an author of the paper with a question you have about the paper, and copy me on the email: vjmatsko@usfca.edu. Make sure you proofread your email carefully! You want to represent yourself well.

  4. Prepare a five-to-seven minute presentation on your paper. You may need to look at the references in the paper, or search online for other sites which address the topic(s) in your paper. Be ready to present next Monday, 25 September. I will use a random number generator to determine the order of presentations!

Finally, don't forget the brief Homework Quiz on Wednesday! (pdf; $\LaTeX$ code.) It will consist of two problems, one of each type that were on the last two homework assignments.
12 Wed, 20 Sept Work on your paper and presentation! There will be a homework assignment on matrices given on Friday which you must hand in on Monday. Also, your presentations must be ready by Monday since I will be determining the order of speakers randomly on Monday morning. So use the next few days productively — don't wait until the last minute to get everything done for Monday!

Week 6

14 Mon, 25 Sept Presentations on Bridges papers. [Note: Students filled out peer evaluations during presentations. Evaluation form pdf; $\LaTeX$ code.]
15 Wed, 27 Sept Presentations on Bridges papers.
16 Fri, 29 Sept Finishing up presentations on Bridges papers. Don't forget the homework on matrix multiplication for Monday ($\LaTeX$ code.) This is an assignment to hand in.

Week 7

17 Mon, 2 Oct For today's lab, create a fractal using two affine transformations. For the first, rotate by 45 degrees counterclockwise, then scale the x by 0.6 and the y by 0.4, and finally move to the right 1. For the second transformation, rotate 90 degrees clockwise, scale both x and y by 0.5, and then move up 1. To check that you've done it correctly, click to see what this fractal looks like. (Hint: Use a scale factor of 400 for both x and y.)

Assignment due Wednesay, October 11: Create three fractals using iterated function systems.
  1. First, create a morphed Sierpinski triangle, based on the Processing code. The idea is to have your fractal look like it was derived from a Sierpinski triangle, but just barely. Someone looking at it should wonder about it, and maybe after 30 seconds or so, say "Hey, that looks like a Sierpinski triangle!"

  2. Next, create a fractal using just two affine transformations. One of the transformations should involve a rotation (though not using a multiple of 45 degrees). You should take a photo of your calculations involving your matrix multiplication(s), and include this in your pdf file.

  3. Next, be as creative as you like. Just design the best fractal ever!

  4. Finally, upload drafts of all three fractals by class on Monday, October 9. This is for a completion grade. I will be checking this before class on Monday. We will be doing peer commenting at the beginning of Monday's lab; the rest of the class, you can work on revising your fractals.
Your pdf should include a picture of each fractal, a brief description of your creative process for each one, as well as a pic of your work for the second one. You should upload to Canvas by midnight Wednesday.
18 Wed, 4 Oct Write a brief (but at least 250 words) response to Prof. Eliot Fried's talk on Wednesday. You should mention at least three specific points made in the talk in your paper. Do not worry if you didn't understand everything -- it is also OK when mentioning a point in the talk to ask a question about it!

Convert to a pdf file and upload to Canvas by Friday at midnight.
19 Fri, 6 Oct Continue working on the lab from Monday.

When you're finished, start working on your homework for next week.

Week 8

20 Mon, 9 Oct Remember: Your homework assignment on iterated function systems is due Wednesday!
21 Wed, 11 Oct Here is my blog post on linear interpolation Processing which we looked at today.

Start today's lab by making this simple movie. For this movie, use a screen 500 x 500 pixels in dimension. it is OK to estimate the sizes of the dots. You do not have to be exact this time.

When you finish this warmup exercise, try making this movie! Your screen should be 500 pixels square (as before), and the dots should always be 25 pixels from the edge of the screen. Colors are the usual red, orange, green, blue. Large dots are 200 pixels wide, and small dots are 100 pixels wide. Finish by Friday!
22 Fri, 13 Oct Class cancelled by the University. No homework over the Fall Break.

Week 9

23 Wed, 18 Oct Keep working on your movie. Both the movie and your selection of Bridges papers are due Monday!
24 Fri, 20 Oct Here is the interactivity demo we discussed in class today.

For your lab, recreate the movie as shown in class! Here are the details:
  1. The screen is 600 pixels square.

  2. The left/right half of the screen is black if the mouse is in that half; the other half is red, yellow, or orange (it starts out yellow). The color can be changed by pressing the "r," "y," or "o" key.

  3. The rectangle is 160 x 100 pixels. It is short or tall, changed by pressing the "s" or "t" key. It is centered where the mouse is.

  4. The position of the mouse is in yellow and is written horizonally opposite of where the mouse is. In other words, it is written at the position which is the location of the mouse reflected across the vertical line dividing the screen in half. Use the font specifications from the demo. The position of the mouse is never covered up by the rectangle.
This lab will be due next week. For Monday, finish last Wednesday's lab, and post your Bridges paper selection on Canvas by the beginning of class.

Week 10

25 Mon, 23 Oct Finish the Interactivity Lab for Wednesday! And start thinking about what you might like to do for your Final Project. We will be working on those during class on Friday.

Also, start working on your Bridges presentations. They will begin next Monday.
26 Wed, 25 Oct Continue working with the Interactivity Lab — I realize it's a little more difficult that I originally thought.

Also, your homework on geometric series is due Monday.
27 Fri, 27 Oct Here and here are two websites you can visit for some help with geometric series.

Make sure the Interactivity Lab is finished by Monday!

Week 11

28 Mon, 30 Oct Continue thinking about Final Project ideas! We only got a chance to work briefly on them today.

The new geometric series homework is due Friday. Bring questions Wednesday if you have them! (Homework 1; Homework 2.)
29 Wed, 1 Nov Bridges presentations today!
30 Fri, 3 Nov Bridges presentations today!

Week 12

31 Mon, 6 Nov Continue thinking about your project! Most of you have a good idea of where to start.

Don't forget to correct your geometric series problems and bring questions Wednesday.
32 Wed, 8 Nov Download the sample fractal movie. Your next art assignment will be to create your own! Be wildly creative....

Remember, you have a quiz on geometric series on Friday! Don't forget that you can bring your notes with you.
33 Fri, 10 Nov Keep working on your fractal movie projects! The quiz on geometric series (pdf, $\LaTeX$ code) will be on Monday.

Week 13

34 Mon, 13 Nov Be sure to upload a draft of your fractal movie on Canvas for class Wednesday!
35 Wed, 15 Nov Your final draft of your fractal movie is due Friday! Here is what you should do.
  1. First, comment your code! I will be looking at your code as well as your movie, and it is good practice to write some comments. That way, if you look at your code later, you will understand what you did.

  2. Email my your .pyde file by Friday at midnight with the subject "Fractal movie by [insert name]."

  3. In your email, write a brief (150-200) word narrative describing any aspects of your creative process. I know many of you are adding other elements besides fractals to your movies, and I want to read about them!
You will be given a number theory assignment on Friday which will be due Wednesday.
36 Fri, 17 Nov Your number theory assignment is due next Wednesday. Be sure to stop by Nick's or my office hours next week if you have questions! (Homework pdf; $\LaTeX$ code.)

Week 14

37 Mon, 20 Nov Continue working on your projects.

Your number theory homework is due Wednesday! Get it to me before you leave if you will not be in class Wednesday.
38 Wed, 22 Nov Here is what you will need to turn in for your Final Project.

Assemble a folder containing your Final Presentation, narrative, Processing/Python files, and images (if appropriate; drafts as well as final images). Make sure the folder is named with your name, and upload it somewhere and send me a link. This is due Friday, Dec 8 at midnight. You narrative should be brief (250—500 words). I want to keep the form fairly loose, but here are some items you should address somewhere in your narrative:

  • What was the motivation for your project?

  • What were your biggest obstacles/successes?

  • Did you learn something unexpected along the way that you didn't think would come up while working on your project?

  • Do you feel satisfied with the level of progress you made on your project?

  • Do you plan to continue working when the class is over?

Enjoy your break! You will be very busy when you get back....

Week 15

39 Mon, 27 Nov Remember, you have a Number Theory quiz on Wednesday! After the quiz, we will keep working on projects.
40 Wed, 29 Nov Continue working on your projects after your quiz on Number Theory! (Quiz pdf; $\LaTeX$ code.)
41 Fri, 1 Dec Final Presentations are on Monday! Remember, in order to give you the weekend to work on your projects, we need to keep to a strict schedule. This means 7 minutes (no longer!) for your presentations, with 2 minutes for questions, and 1 minute for transitioning between talks. This gives a 15-minute buffer for technical difficulties....

And look at the prompt on Day 38 for what to submit for your Final Project. This is due next Friday, December 8.

Week 16

42 Mon, 4 Dec Final Presentations today!
43 Wed, 6 Dec Final Presentations today!