Week 4 Text Output Work

let colorData;
let positionData;

async function setup() {
  createCanvas(400, 400);

  // start up information from the 2 CSV files
  colorData = await loadStrings("colors.csv");
  positionData = await loadStrings("positions.csv");

  // pick one color by random
  let myColor = random (colorData);

  // pick one position by random
  let myPosition = random(positionData);

  // keeping the X and Y coordinates separate
  let coordinates = myPosition.split(",");
  let x = Number(coordinates[0]);
  let y = Number(coordinates[1]);

  // Making sure background color is set and understood
  background("gray");

  // Chosen text customization
  textFont("Georgia");
  textSize(50);
  textAlign(CENTER, CENTER);
  fill(myColor.trim());

  // Make sure text is displayed
  text("HHN", x, y);
}

For this assignment, I figured this would be the perfect moment to create a generative output based on a characteristic trait of mine that I often don’t tell too many people about. What is this characteristic trait in question that I speak of? Well, to answer that question, let’s just say that it has something to do with a Halloween event over in Florida, USA, that goes by the name of Halloween Horror Nights or HHN for short; this is an event that i personally adore with each fragment of my heart because of how it gives me the thrilling adrenaline rush of going through its haunted houses based on famous horror films. With this trait of mine mentioned, this is what has fueled me into thinking a way to have this assignment serve as a refreshing reference to what I adore; all while under the idea of presenting this trait of mine in the style of those old DVD screens on the TV where the DVD logo would bounce around the screen and how it would change color whenever it hit a corner. As someone who has grown up with a few memorable enough childhood moments of watching the DVD logo go all over the place and change color each time it hit the TV corners, i knew that i should have the name of my favorite halloween event be displayed within my sketch but in the form of this type of generative text output where each time you run it, the text itself would not only choose to “teleport” to a random spot by random, but also change color by random also!

 

To make this sketch of mine, i have had to use some of our previous classwork as inspiration for my sketch; this includes the “Hello Amazing Class” sketchwork as well as our other sketchwork that had those two CSV files (“colors.csv” and “circle.csv”) connected to the main sketch in order for the main circle to cycle in changing into colors/appearances if clicked by our mouse. This is how I had the bright idea to try creating two CSV files that were to be connected to my main sketch file, with those two being the “positions.csv” file and “colors.csv” file. Those two would be responsible for not only setting up the colors that are supposed to be the cycle the text is supposed to follow by random, but also the positions that the text too must cycle through randomly but in terms of different spots with the sketch canvas. Once those files were set up, that’s when I had to write in a way that can be described as this: x & y -> coordinates, myPosition -> myColor -> colorData + positionData -> colors.csv + positions.csv. It has simply been about connecting the files with the instructions of my code so that it can be ensured that the text would not only be able to pick a random color and position each time i run my sketch, but also that the coordinates of its x and y are exactly specified if they are to randomly move to an exact spot as intended without sparking confusion. One more thing to mention, is that i need indeed had to ask Ai to assist me in checking my code to see if it shall work; sure enough, it was able to help confirm that my code was indeed ready to go, but not without making a few minor adjustments (i.e. making that the text would be aligned to being centralized on each random spot it goes to rather than drip to the other side unnaturally). Honestly, looking back at this, I honestly feel a little bit happy that I was able to figure out how to create two new files to connect to my main sketch in order to have it operate as it should. It simply felt as if it saved me the trouble of having to figure out where to write the values of the colors and positions on my actual sketch instructions..

 

All in all, I should consider myself glad with how this sketch seems to look in my eyes. It is able to make its output look different with each time I press the play button to run it, whether it be through color or choice of alternate positions! Since that is the case, then perhaps what I may consider for a few more of my sketch works is the need to create some files of my choosing depending on what I’m working on and how I choose to organize things out without letting them be all over the place. It’s kind of like cable TV, where it’s your obligation to figure out how to organize each cable into connecting to their respective outlets so that the TV will be able to operate as it should be operating. Overall, this is all what I just needed to say about my generative text output workpiece.

Leave a Reply