Idk man it’s a thing with text and a pretty drawing

I really never know how to title these posts. Basically, I was up late at night after toying around with three other ideas for generative text output projects and I got an idea for something totally different which led to me making the google search for “cartoon kid reading”. I then got this totally unrelated picture of two people, in each other’s arms, looking at their phones, underneath the stars and constellations. I absolutely loved this photo. The aesthetic was beautiful and I immediately wanted to incorporate it into my sketch. Plus, I hadn’t yet experimented with loading a photo into processing, so I would get that skill too.

Now how would this incorporate text? There was an obvious element of astrology in this photo and when I followed the picture to its source, I found the article, “Why millenials are so into astrology?” I started taking words and phrases from that article and inputting them into a word document:

“The New Age of Astrology” “Millenial and Gen Z Quotient” “Horoscopes in the Backs of Magazines”

I imported that text into the screen and made it seem like it was coming out of the iPhone and into the guy’s head. And as they fade out of sight (and off screen), they loop back around, each phrase going at a different speed and at a different size, randomized by processing.

This work wasn’t really about, like, making something happen for me. It was more about the aesthetic and the atmosphere that the work of art instilled in me when I saw it. I had thought about making the text do something, with a mouse press or a release, or something, but I think that would have taken away from the art.

Here’s the video:

Here’s the main code:

PImage img;
PFont f;

float x = 70;
float y = 230;
int space = 30;
int fade = 255;



Text lines[];

void setup() {
  f = createFont("Courier", 44);

  size(1000, 680);
  img = loadImage ("astrology.jpg");
  String[] textLines = loadStrings("text.txt");
  lines = new Text[textLines.length];
  for (int i = 0; i < lines.length; i++) {
    lines[i] = new Text(textLines[i], x + i*space/2, y + i*space);
  }
}

void draw() {

  scale(.7);    // setting up the background image, note that scalge is fine for this project but not ideal for the future
  image(img, 0, 0);

  for (int i = 0; i < lines.length; i++) {
    lines[i].run();
  }
}

Here’s the class:

class Text {

  float x;
  float xHome = 85;
  float y;
  float speed;
  int fade = 255;
  float fadeAdjustment = 2.3;
  int space;
  int lines = 8;
  String text;
  int size = int(random(15, 25));


  Text(String t, float _x, float _y) {
    text = t;
    x = _x;
    y = _y;
    speed = random(1.6, 4.8);
  }


  void display() {

    pushMatrix();
    textAlign(LEFT);
    rotate(-.1);
    textSize(size);
    fill(255, fade);
    text(text, x, y);
    popMatrix();
  }


  void update() {
    x+= speed;
    fade -=  fadeAdjustment;
  }

  void checkEdges() {

    if (y>height) {
      y=0;
    }
    if (y<0) {
      y=height;
    }
    if (x>800) {
      x=xHome;
      fade=255;
    }
  }


  void run() {
    display();
    update();
    checkEdges();
  }
}

Here’s credit to the article and the artist is Maura Dwyer. Also, cheers to Jack and Aaron for meeting with me <3