Difference between revisions of "User:Tom"

From DigitalCraft_Wiki
Jump to navigation Jump to search
(Created page with "hi")
 
Line 1: Line 1:
hi
+
Project (WORK IN PROGRESS)
 +
 
 +
I ran into a couple of Gifs that visualised how certain sorting algorithms worked. Normally I don’t understand algorithms, but these visualisations made it so easy and insightful to understand what is going on. Besides that I think it’s cool to see an algorithm at work like this, I also think it has some artistic value. You could call it glitch art (glitch art:——————)
 +
 
 +
It is a code creating a new kind of image by rearranging the original. This results in an image made anonymous. Or maybe more like a vague memory, where everything is still there but over time you start to forget what it looks like. This creates a new memory, a distorted version of the original.
 +
 
 +
What is Pixel Sorting?
 +
 
 +
Pixel Sorting is done with a program called Processing. It takes the pixels in a digital image and places them into a semblance of order.
 +
Pixel sorting was made popular by an artist of the name Kim Asendorf. He began sorting by developing a code in Processing.
 +
 
 +
Examples from artists/reddit
 +
 
 +
 
 +
Experiment
 +
 
 +
CODE!
 +
 
 +
This is a modified version of the code written bij Kim Asendorf. It is written in Processing language, and requires a folder called ‘data’ in the same location as the .pde processing file.
 +
 
 +
PImage img;
 +
PImage sorted;
 +
int index = 0;
 +
 
 +
void setup() {
 +
  size(800, 400);
 +
 
 +
  img = loadImage("afbeelding.jpg");
 +
  sorted = createImage(img.width, img.height, RGB);
 +
  sorted = img.get();
 +
}
 +
 
 +
void draw() {
 +
  println(frameRate);
 +
 
 +
  sorted.loadPixels();
 +
 
 +
  // Selection sort!
 +
  for (int y = 0; y < sorted.height; y++) {
 +
 
 +
    float record = -1;
 +
    int selectedPixel = index;
 +
 
 +
    for (int x = index; x < sorted.width; x++) {
 +
      int loc = y * sorted.width + x;
 +
      color pix = sorted.pixels[loc];
 +
      float b = brightness(pix);
 +
      if (b > record) {
 +
        selectedPixel = loc;
 +
        record = b;
 +
      }
 +
    }
 +
    // Swap selectedPixel with i
 +
    color temp = sorted.pixels[y * sorted.width + index];
 +
    sorted.pixels[y * sorted.width + index] = sorted.pixels[selectedPixel];
 +
    sorted.pixels[selectedPixel] = temp;
 +
  }
 +
  if (index < sorted.width -1) {
 +
    index++;
 +
  } else {
 +
    save("sorted.jpg");
 +
    frameRate(0);
 +
  }
 +
 
 +
  sorted.updatePixels();
 +
 
 +
  background(0);
 +
  image(img, 0, 0);
 +
  image(sorted, 400, 0);
 +
}
 +
 
 +
The code results in a pixel sorting visualisation:
 +
 
 +
GIF MAKEN
 +
 
 +
Gif voorbeelden
 +
 
 +
Twitterbot windows icons

Revision as of 15:55, 2 February 2018

Project (WORK IN PROGRESS)

I ran into a couple of Gifs that visualised how certain sorting algorithms worked. Normally I don’t understand algorithms, but these visualisations made it so easy and insightful to understand what is going on. Besides that I think it’s cool to see an algorithm at work like this, I also think it has some artistic value. You could call it glitch art (glitch art:——————)

It is a code creating a new kind of image by rearranging the original. This results in an image made anonymous. Or maybe more like a vague memory, where everything is still there but over time you start to forget what it looks like. This creates a new memory, a distorted version of the original.

What is Pixel Sorting?

Pixel Sorting is done with a program called Processing. It takes the pixels in a digital image and places them into a semblance of order. Pixel sorting was made popular by an artist of the name Kim Asendorf. He began sorting by developing a code in Processing.

Examples from artists/reddit


Experiment

CODE!

This is a modified version of the code written bij Kim Asendorf. It is written in Processing language, and requires a folder called ‘data’ in the same location as the .pde processing file.

PImage img; PImage sorted; int index = 0;

void setup() {

 size(800, 400);
 img = loadImage("afbeelding.jpg");
 sorted = createImage(img.width, img.height, RGB);
 sorted = img.get();

}

void draw() {

 println(frameRate);
 sorted.loadPixels();
 // Selection sort!
 for (int y = 0; y < sorted.height; y++) {
   float record = -1;
   int selectedPixel = index;
   for (int x = index; x < sorted.width; x++) {
     int loc = y * sorted.width + x;
     color pix = sorted.pixels[loc];
     float b = brightness(pix);
     if (b > record) {
       selectedPixel = loc;
       record = b;
     }
   }
   // Swap selectedPixel with i
   color temp = sorted.pixels[y * sorted.width + index];
   sorted.pixels[y * sorted.width + index] = sorted.pixels[selectedPixel];
   sorted.pixels[selectedPixel] = temp;
 }
 if (index < sorted.width -1) {
   index++;
 } else {
   save("sorted.jpg");
   frameRate(0);
 }
 sorted.updatePixels();
 background(0);
 image(img, 0, 0);
 image(sorted, 400, 0);

}

The code results in a pixel sorting visualisation:

GIF MAKEN

Gif voorbeelden

Twitterbot windows icons