Rules:

Hi everyone,

I am working on a for fun project with organic "wood" rings.
I can't get to the solution of why there are 2 sharp corners in the bezier curves on the right side...
Ideally I want each ring to be completely smooth.
I will be very glad for all tips!

EDIT: code copying

Here is the code I am using:

int numCircles = 13; // Number of circles
float smallestSize = 60; // Size of the smallest circle
float biggestSize = 150; // Size of the biggest circle
float scaleFactor = 1.2; // Exponential scale factor
float[] circleSizes = new float[numCircles]; // Sizes of circles

void setup() {
  size(900, 900);
  background(255);
  smooth();

  // Initialize circle sizes
  float size = smallestSize;
  float growthFactor = (biggestSize - smallestSize) / (pow(scaleFactor, numCircles - 1) - 1);
  for (int i = 0; i < numCircles; i++) {
    circleSizes[i] = size;
    size += growthFactor * pow(scaleFactor, numCircles - i - 1); // Modified exponential growth
  }

  // Set center
  float centerX = width / 2;
  float centerY = height / 2;

  // Draw the circles
  for (int i = 0; i < numCircles; i++) {

    float x = centerX;
    float y = centerY;
    size = circleSizes[i];
    drawBark(x, y, size, map(size, smallestSize, biggestSize, 0.05, 0.1));
  }
}

void drawBark(float x, float y, float size, float step) {
  noFill();
  strokeWeight(2);
  stroke(#000000);

  beginShape();
  float[] barkPointsX = {51.8, 57.1, 44.6, 27.4, 10.2, -11.6, -24.9, -38.2, -43, -37.4, -31.9, -15.9, 3.7, 23.2, 46.5, 51.8}; // Added the starting point again
  float[] barkPointsY = {-18.2, -0.4, 21.8, 33.2, 44.6, 45.3, 35.3, 25.4, 4.9, -13.1, -31.2, -46.9, -48.1, -49.3, -36, -18.2}; // Added the starting point again
  for (int i = 0; i < 16; i++) {
    float newX = barkPointsX[i] * size/100;
    float newY = barkPointsY[i] * size/100;
    curveVertex(x + newX, y + newY);
  }
  endShape(CLOSE);
}

A lot of itch.io developers have managed to somehow bypass this.
While I can specify to players about how they can get around it, it will still make people suspicious, since there is no way for me to prove that it is not a virus.

Hello everyone!

I am exploring ways to process graphics in Processing; for instance, given the following rectangles, I would like to transform them into a slope.

What is the simplest and most feasible way to do this? And, does Processing offer any built-in APIs for it?

Thanks for help!

https://preview.redd.it/cso189n1rswc1.png?width=139&format=png&auto=webp&s=4aac33d5f6df3ece0a6d6e7e341e405a93d42d26

hi, im a beginner et im looking for the player to stay inside the white PShape i displayed here. Im starting to think im gonna have to use && on multiple rectangles since im gonna need straight lines to do what i wanna do.

https://preview.redd.it/jofz1e58jowc1.png?width=997&format=png&auto=webp&s=698a169fc8f074f1f0e6f1920554a9672a74dbd7

I don't expect to get a response. I'm simply out of ideas. I am, at the moment, defeated. My beginners tech literacy class is learning how to program in processing. My assignment is to just make whatever I want and explain it. For the last 4 days I've been working on trying to make a looping image that scrolls across the bottom of the window.

I'm simply out of ideas. I tried to do it with math and values but it only ran the equation once despite being in draw with no noLoop(). I tried to make it work on a 2D circle. But I couldn't get the coordinate without it being 3D. I tried it with a cylinder and that didn't work. I tried making it into a looping gif but processing 4.0 does not accept gifs and the add-on library is only valid up until 3. I tried to make it into a Sprite with a sheet with and without an array list and that didn't work. I don't know what else to do.

Hey everyone! I'm trying to display a recorded video with transparent background but, as the video goes by, every frame gets "froze" in the screen, like a glitch effect. How do I display this video without this glitch, just one frame at a time?

import processing.video.*;

Movie video;

void setup() {
  fullScreen();
  video = new Movie(this, "SPOTLIGHT.mov");
  video.loop();
  
}

void movieEvent (Movie video) {
  video.read();
  
}

void draw() {
   image (video, 0, 0);
}

Its probably because of void draw() but idk how to display videos without it lol

An image to show whats happening, the animation is spinning 360º:

https://preview.redd.it/ocd4bjcbwiwc1.png?width=1920&format=png&auto=webp&s=911d74ab6d3daf4e9f753e912ae7120a815ea4ba

Hi there! I've been having a lot of success lately with Processing, but I've hit a bump on the road and need some guidance. Especially with the delay. I've basically gotten a bunch of sounds going on now through an array and a different sound is playing every time the scene changes. Now I want to have the delay effect change as well (which I can figure out myself) with every scene change, but I can't even seem to get the delay itself working. I've tried putting it in the if statement, void setup and void draw. Here's my code so far:

import processing.sound.*;
SoundFile[] file = new SoundFile[20];
Delay delay;

float modulo = 20;
int count;

float noiseforw, forw = 0;
float noiseScale = .2;

void setup() {
  size(900, 900);
  rectMode(CENTER);
  noStroke();

  //load string of soundfiles
  for (int i=0; i<file.length; i++) {
    file[i] = new SoundFile(this, "clicky"+i+".wav");
  }

  // create a delay effect
  delay = new Delay(this);
}

void draw() {
  background(0);
  int tilesX = 32;
  float mag = width * 0.4;
  forw = forw + 0.01;
  noiseforw = noiseforw + 0.0002;

  translate(width/2, height/2);


  if (frameCount % int(random(10, 120)) == 0) {
    modulo = int(random(1, 20));
    int selector = int(map(modulo, 1, 20, 0, file.length));
    file[selector].play();
    delay.process(file[selector], 5);
    delay.time(.1);
    delay.feedback(0.8);  
  }  
  int m = int(modulo);
  int selector2 = int(map(modulo, 1, 20, 0, file.length-1));
  

  
  for (int i = 0; i < tilesX; i++) {

    float x = map(i, 0, tilesX-1, -mag, mag);
    float bright = noise(i*noiseScale+noiseforw*m, i*noiseScale);

    if (i % m == 0) {
      rect (x, 0, 10, 280);
    } else {
      rect (x, 210-420*bright, 10, 70*bright*2);
    }
  }
}

​

I want to know how to import cv2 and media pipe in processing.py. Can anyone teach me?

I built a rather complex game in processing and I am puzzled by the performance difference on the two systems available for testing the exported app. It‘s my personal pleasure project, but I am now thinking about releasing it, since it has become rather fun and complete. Did the coding on my M1 MacBook pro, where i get around 120 fps in most situations. On a decent pc (gamedev workhorse in our office) I only get about 30 to 40 fps. This can’t really be representative of the difference in capabilities of the machines, i suspect some issue with optimization of the Java runtime or something like that? Did a little research already, but nothing really useful popped up. ChatGPT says something about setting jvm-options to allow/force the runtime to use OpenGL, can anyone confirm this? The app uses P2D renderer, but I also tried the others without success. I read about the different Java runtimes out there, might it be usefull to test those for differences in performance on intel/win? Do any of you have experience with a similar situation? Any pointers/tricks? Happy to hear your thoughts - I’m puzzled…. Cheers!

import processing.pdf.*;
PImage img;
String s = "0/1";
PFont font;
int index=0;

void setup() {
  img = loadImage("haunted_l1_z.jpg");

  size(2000, 1500);
  font = createFont("Arial-Black-48.vlw", 200); // 폰트 생성
  color c;

  beginRecord(PDF, "YEAH40.pdf"); // PDF 레코딩 시작

  image(img, 0, 0, width, height);
  img = get(0, 0, width, height);
  background(255);

  for (int y = 0; y < height; y += height/200) {
    for (int x = 0; x < width; x += width/500) {
      c = img.get(int(x*img.width/width), int(y*img.height/height));
      textFont(font, brightness(c) / 500 + 10);
      fill(c);
      text(s.charAt((index++) % s.length()), x, y);
    }
  }

  endRecord(); // PDF 레코딩 종료
}

Hi there now I'm making some images as ASCII art that's why now I'm using this code

I already install every font in my library, but processing 4 always tell me like this:

"Arial-Black-48.vlw" is not available, so another font will be used. Use PFont.list() to show available fonts.

I've been changing many thing, and I've been trying to do that many ways the program always repeat the same thing. But there's no problem to export. So if you guys know some answer, know some clue to change or to solve this problem please help me.

Additional things: I want to export that thing as a TIF or JPG. Is anybody know how to do?

Warm regard.

Saúl.

Hey! I am deeply confused as to why i cannot seem to offset when the circles spawn so that its earlier and the circles hit the bottom bar on the beat as opposed to spawning on beat. any help would be super super appreciated!

import ddf.minim.*;

import ddf.minim.analysis.*;

import ddf.minim.effects.*;

import ddf.minim.signals.*;

import ddf.minim.spi.*;

import ddf.minim.ugens.*;

Minim minim;

AudioPlayer player;

BeatDetect beat;

float barY;

float circleSpeed;

float circleRadius;

int laneCount;

int laneWidth;

int lanePadding;

ArrayList<Circle> circles;

int bufferSize;

float amplitudeThreshold = 100;

// Variables for beat synchronization

float lastBeatTime = 0;

float timeBetweenBeats = 0;

void setup() {

size(800, 600);

minim = new Minim(this);

player = minim.loadFile("assets/music/kokomo.mp3");

player.play();

bufferSize = player.bufferSize();

barY = height * 0.75;

circleSpeed = 5;

circleRadius = 20;

laneCount = 4;

laneWidth = width / laneCount;

lanePadding = 50;

circles = new ArrayList<Circle>();

beat = new BeatDetect();

beat.setSensitivity(150);

}

void draw() {

background(255);

// Draw lanes

for (int i = 0; i < laneCount; i++) {

float x = i * laneWidth + laneWidth / 2;

line(x, 0, x, height);

}

stroke(0);

strokeWeight(2);

line(0, barY, width, barY);

// Check for beats

beat.detect(player.mix);

if (beat.isOnset()) {

// Calculate time between beats

float currentTime = millis() / 1000.0;

timeBetweenBeats = currentTime - lastBeatTime;

lastBeatTime = currentTime;

// Determine lane based on the beat

int lane = floor(random(0, laneCount));

// Calculate circle spawn position to sync with the beat

float spawnY = -timeBetweenBeats * circleSpeed;

float adjustedSpawnTime = lastBeatTime - 0.2;

// Create the circle with adjusted spawn time

circles.add(new Circle(lane, spawnY, adjustedSpawnTime));

}

// Draw circles and move them down

for (int i = circles.size() - 1; i >= 0; i--) {

Circle circle = circles.get(i);

circle.move(); // Move the circle

circle.display(); // Display the circle

// Remove circles when they reach the bar

if (circle.getY() + circleRadius >= barY) {

circles.remove(i);

}

}

}

class Circle {

float x;

float y;

float speed;

float radius = circleRadius;

int lane;

float spawnTime;

Circle(int lane, float spawnY, float spawnTime) {

this.lane = lane;

this.y = spawnY;

this.spawnTime = spawnTime;

this.x = (lane + 0.5) * laneWidth;

this.speed = circleSpeed;

}

void move() {

y += speed;

}

void display() {

fill(255, 0, 0);

ellipse(x, y, radius * 2, radius * 2);

}

float getY() {

return y;

}

}

Currently I have processing on a computer at home and a computer at school, but I bring my Chromebook from home to school, so it would be very nice if I could download it on a Chromebook. Is there anyway? Can other coding programs be downloaded on Chromebooks?

I'm a graphic designer by trade and am utilizing P5.JS to create a graphic library of branding elements for a project. I had a ton of assistance writing this (ChatGPT, hopefully that isn't frowned upon) so can't say I know what a good portion of this means. However maybe I can get some help.

I need my output to export as 1920x1080, and it is saving at 4197x2227. This also isn't the correct aspect ratio (not 16:9)

Maybe its extra information, but here is the full code:

function setup() {
  // Adjust canvas size to fit an integer multiple of the total grid spacing
  // (both skewed width and height) for flush alignment.
  let canvasWidth = 1920; // Original canvas width
  let canvasHeight = 1080; // Original canvas height
  
  // Adjust canvas width to fit an integer multiple of the total grid spacing horizontally.
  let baseWidth = 80;
  let skewAngle = 20;
  let skewOffset = baseWidth / tan(radians(skewAngle));
  let gridSpacingX = baseWidth + skewOffset;
  let numCols = Math.ceil(canvasWidth / gridSpacingX);
  let adjustedCanvasWidth = numCols * gridSpacingX;
  
  // Adjust canvas height to fit an integer multiple of the total grid spacing vertically.
  let baseHeight = baseWidth / 2;
  let marginY = baseWidth * 0.04;
  let gridSpacingY = baseHeight + 2 * marginY;
  let numRows = Math.ceil(canvasHeight / gridSpacingY);
  let adjustedCanvasHeight = numRows * gridSpacingY;
  
  // Set up canvas with adjusted dimensions for flush alignment.
  createCanvas(adjustedCanvasWidth, adjustedCanvasHeight);
  noLoop();
}

function draw() {
  // Create a layer specifically for the gradient background.
  let gradientLayer = createGraphics(width, height);
  drawRadialGradient(gradientLayer);

  // Create a separate layer to draw shapes that will be manipulated.
  let shapesLayer = createGraphics(width, height);
  shapesLayer.noStroke();
  
  // Draw various shapes on the shapes layer with specific design properties.
  drawDetailedShapes(shapesLayer);

  // Apply the gradient layer as a mask to the shapes layer.
  applyMask(shapesLayer, gradientLayer);

  // Display the result by drawing the masked gradient on the main canvas.
  image(gradientLayer, 0, 0);
}

function drawDetailedShapes(g) {
  // Base dimensions and properties for the shapes.
  let baseWidth = 80;
  let marginX = baseWidth * -.05;
  let marginY = baseWidth * 0.04;
  let baseHeight = baseWidth / 2;
  let skewAngle = 20;
  let skewOffset = baseHeight * tan(radians(skewAngle));
  let gridSpacingX = baseWidth + skewOffset + 2 * marginX;
  let gridSpacingY = baseHeight + 2 * marginY;

  // Different opacities for the shapes and jitter probabilities for each row.
  let opacities = [255, 128, 32];
  let jitterPercentages = [0, 0.05, 0.10, 0.15, 0.20, 0.25, 0.30, 0.35, 0.40, 0.45, 0.50, 0.50, 0.45, 0.40, 0.35, 0.30, 0.25, 0.20, 0.15, 0.10, 0.05, 0];

  // Calculate the number of rows and columns based on screen dimensions and skew.
  let numRows = Math.ceil(height / gridSpacingY);
  let numCols = Math.ceil((width + skewOffset) / gridSpacingX); 

  // Loop through each grid position to place a shape.
  for (let i = 0; i < numRows; i++) {
    let y = i * gridSpacingY;
    let rowSkewOffset = i * skewOffset;
    for (let j = 0; j < numCols; j++) {
      let x = j * gridSpacingX - rowSkewOffset;
      let jitterChance = jitterPercentages[Math.floor(i / (numRows / jitterPercentages.length))];
      if (random() < jitterChance) {
        // Ensure that adjacent shapes do not have the same opacity to enhance visual contrast.
        let valid = false;
        let opacity;
        while (!valid) {
          opacity = random(opacities);
          valid = true;
          // Prevent same opacity in immediate horizontal neighbors.
          if (i > 0 && j > 0 && g.pixels[(i-1) * gridSpacingY * width * 4 + ((j-1) * gridSpacingX * 4)] === opacity) valid = false;
          if (i > 0 && j < numCols - 1 && g.pixels[(i-1) * gridSpacingY * width * 4 + ((j+1) * gridSpacingX * 4)] === opacity) valid = false;
        }

        // Set the fill color based on opacity.
        let colorValue = opacity === 255 ? '#FFFF00' : '#FFFFFF';
        g.fill(color(colorValue + opacity.toString(16)));
        // Draw a skewed rectangular shape.
        g.beginShape();
        g.vertex(x + marginX, y);
        g.vertex(x + skewOffset + marginX, y - baseHeight);
        g.vertex(x + skewOffset + baseWidth + marginX, y - baseHeight);
        g.vertex(x + baseWidth + marginX, y);
        g.endShape(CLOSE);
      }
    }
  }
}

function drawRadialGradient(g) {
  let radius = max(width, height) / 2;
  let gradient = g.drawingContext.createRadialGradient(width / 2, height / 2, 0, width / 2, height / 2, radius);
  gradient.addColorStop(0, '#ffee00');
  gradient.addColorStop(1, '#fe5000');
  g.drawingContext.fillStyle = gradient;
  g.drawingContext.fillRect(0, 0, g.width, g.height);
}

function applyMask(shapesLayer, gradientLayer) {
  shapesLayer.loadPixels();
  gradientLayer.loadPixels();

  // Make parts of the gradient transparent where shapes are not present.
  for (let i = 0; i < shapesLayer.pixels.length; i += 4) {
    if (shapesLayer.pixels[i] === 0) { // Check transparency in the shapes layer
      gradientLayer.pixels[i + 3] = 0;  // Set alpha to 0 to hide gradient
    }
  }

  gradientLayer.updatePixels();
}

​

Hey yall. I have a processing sketch that should allow a user to click on a region, then return a list of plants in that area on a sidebar. I have a lot going on in this sketch and something is making the list of data/plants flicker like crazy, but only for certain regions. If anyone knows why this is happening, I'd love the help! Repo w my code below.

https://github.com/carolinecahiII/map

Hi there,

To preface, I don’t know anything about coding—I’m a graphic design major working on a project to make a laser-cut playable record, like a vinyl record, but with acrylic. ‼️This was not assigned‼️

Luckily, this engineer provided her entire process on Instructables and all I had to do was follow her steps.

https://www.instructables.com/Laser-Cut-Record/

I’ve downloaded her code, Python, and Processing to ultimately generate a pdf with grooves that can be engraved with the laser cutter.

In the final step I’m supposed to open her code that uses Java in Processing and simply Run the Sketch. However, I keep getting Duplicate field errors (like the one shown) on every single line. I’ve consulted ChatGPT and Bard and they’ve been no help. I’m not sure what to do here. I uninstalled and installed different/older versions of Processing and I get the same thing. The version shown in the picture is 4.3

Here you can see the codes I’m supposed to run:

https://github.com/amandaghassaei/LaserCutRecord/blob/master/LinearRecord.pde

https://github.com/amandaghassaei/LaserCutRecord/blob/master/LaserCutRecord.pde

Any help would be appreciated. I really want to make this work!

Thank you!

The code works very well but it crashes sometimes with this error

Processing video library using system-wide GStreamer 1.24.1

Apr 14, 2024 8:51:56 AM com.sun.jna.Native$1 uncaughtException

WARNING: JNA: Callback org.freedesktop.gstreamer.elements.AppSink$2@2e64cd1a threw the following exception

java.lang.IllegalStateException: Native object has been disposed

at org.freedesktop.gstreamer.glib.NativeObject.getRawPointer([NativeObject.java:119](https://NativeObject.java:119))

at org.freedesktop.gstreamer.glib.Natives.getRawPointer([Natives.java:178](https://Natives.java:178))

at org.freedesktop.gstreamer.lowlevel.GTypeMapper$2.toNative([GTypeMapper.java:73](https://GTypeMapper.java:73))

at com.sun.jna.Function.convertArgument([Function.java:521](https://Function.java:521))

at com.sun.jna.Function.invoke([Function.java:345](https://Function.java:345))

at com.sun.jna.Library$Handler.invoke([Library.java:265](https://Library.java:265))

at jdk.proxy1/jdk.proxy1.$Proxy21.gst\_buffer\_unmap(Unknown Source)

at org.freedesktop.gstreamer.Buffer.unmap([Buffer.java:121](https://Buffer.java:121))

at processing.video.Movie$NewSampleListener.newSample(Unknown Source)

at org.freedesktop.gstreamer.elements.AppSink$2.callback([AppSink.java:232](https://AppSink.java:232))

at java.base/jdk.internal.reflect.DirectMethodHandleAccessor.invoke([DirectMethodHandleAccessor.java:103](https://DirectMethodHandleAccessor.java:103))

at java.base/java.lang.reflect.Method.invoke([Method.java:580](https://Method.java:580))

at com.sun.jna.CallbackReference$DefaultCallbackProxy.invokeCallback([CallbackReference.java:585](https://CallbackReference.java:585))

at com.sun.jna.CallbackReference$DefaultCallbackProxy.callback([CallbackReference.java:616](https://CallbackReference.java:616))

the code

import processing.core.PApplet ;
import processing.core.PImage;
import processing.core.PFont;
import java.util.ArrayList;
import ddf.minim.*;
import processing.video.Movie;

public class Game extends PApplet {
Minim minim;
AudioPlayer p2layer;

static Movie video;
public static PApplet game;
static PImage backgroundImage,Mohaned, Marah, Enemys, Arrows, live1, live2, live3, live4;
static PFont dashboardf,game_overf,shootf; // Declare a variable to hold the font
static Player player;
static GreenCircle greenCircle;
static ArrayList<Enemy> enemies;
static Arrow playerArrow;
static int score = 0, load = 0,level=1,BonusLives = 0;
static float lives = 10.F;
static boolean reload = false;
private int minspeed=1,maxspeed=3,Levelfactor=10,spawnInterval = 1500,videospeed=1,lastSpawnTime;
private boolean gameOver;
public static void main(String[] args) {
PApplet.main("Game", args);
}
public void settings() {
size(1920, 1080,P2D);
fullScreen();
game = this;
}
public void setup() {
frameRate(144);
background(0);
video = new Movie(this, "Background.mp4");
video.loop(); // Start playing the video in a loop
minim = new Minim(this);
p2layer = minim.loadFile("GTA.wav");
p2layer.play();
greenCircle = new GreenCircle(width / 2, height / 2);
playerArrow = new Arrow();
player = new Player(100);
enemies = new ArrayList<>();
gameOver = false;
backgroundImage = loadImage("Background.jpg");
backgroundImage.resize(width, height);
Mohaned = loadImage("Mohaned.png");
Marah = loadImage("Marah.png");
Enemys = loadImage("Enemy.png");
Arrows = loadImage("Enemy.png");
live1 = loadImage("live1.jpg");
live2 = loadImage("live2.jpeg");
live3 = loadImage("live3.jpeg");
live4 = loadImage("live4.jpeg");
game_overf = createFont("binxchr.ttf", 150);
dashboardf =createFont("JetBrainsMono-SemiBold.ttf", 150);
shootf = createFont("Bates Shower.ttf", 150);
enemies = new ArrayList<>();
lastSpawnTime = millis();
for (int i = 0; i < 4; i++) {
float speed = random(minspeed, maxspeed); // Random speed between 1 and 3
Enemy.spawnEnemy(HUD.randomX(), HUD.randomY(), speed);
}
}
public void draw() {
background(0);
video.read();
video.speed(videospeed);
image(video, width/2, height/2,width,height);
if (video.time() == 21.8125) {
video.jump(0); // Rewind the video to the beginning
}
HUD.drawLives();
HUD.drawscore();
player.update(gameOver);
player.render();// Update and render player
greenCircle.render(game);// render green circle
if (millis() - lastSpawnTime >= spawnInterval) {
float speed = random(minspeed, maxspeed);
Enemy.spawnEnemy(HUD.randomX(), HUD.randomY(), speed);
lastSpawnTime = millis(); // Update lastSpawnTime
}
Enemy.Enemyattack();
if(BonusLives%Levelfactor==0&&BonusLives!=0){
lives++;
level++;
videospeed*=2;
spawnInterval*=0.7f;
Levelfactor*=2;
minspeed*=1.5f;
maxspeed*=1.5f;
BonusLives=0;
}
if (lives <= 0) { // Check if collision count exceeds threshold
HUD.gameOver();
}
}
public void mouseMoved() {
player.aim(mouseX, mouseY);
}
public void mousePressed() {
if (mouseButton == RIGHT){
reload=true;
}
if (mouseButton == LEFT&&reload) {
player.shootArrow();
load++ ;
reload= false;
}
}

}

Hi.

I want to create a simple app that core functionality rely on creating animations(videos with background music). Kind of some ready to use templates(animations). There will be some menu items(two or three different pages). Do you recommend to use processing to create such an app? I don't have enough experience on android studio, but I worked with processing.

It would be better to provide the information what can I achieve using this framework on android app. I knew compare to android studio, processing on android is pretty simple.

Thanks beforehand! Appreciate your help!

hello! I am trying to make a single point tracker on posenet - I have got 17 white points (the skeleton) on a black background that track individuals on web cam. I want there to be just one point visible, I need to either remove 16 points or average them into one.

Any ideas on how to do this? I cannot change the fill for just one without changing them all>

Any help would be really appreciated!!!!!

I really liked an after effects plug in demo. the plug in is called modulation (https://aescripts.com/modulation/)

I'm guessing that what it does is it reduces the color palette and then traces a silhouette where there are jumps in color ranges, right?

​

Would this be the right logic to start coding this?

My first question is, how would you have processing lower the number of colors in an image?

https://waveywaves.substack.com/p/cap-ndc-01-essence-formation-and
started a little newsletter series which focuses on visualizing the concepts of crowds and power by elais canetti ! check it out !