Processing-Tutorial: Rasterize 3D


By loading the video, you agree to YouTube’s privacy policy.
Learn more

Load video

In this tutorial I show you how to create abstract 3D portraits from any image file. Here you will learn many basics about 3D and generative image rasterization.

Please let me know what you think! I am very curious about your ideas. And as always, feel free to share your results on Instagram or Twitter.

Here’s the final code:

PImage img;

void setup() {
  size(900, 900, P3D);
  img = loadImage("venus.jpg");
  img.resize(900, 900);

void draw() {
  float tiles = 100;
  float tileSize = width/tiles;
  for (int x = 0; x < tiles; x++) {
    for (int y = 0; y < tiles; y++) {
      color c = img.get(int(x*tileSize),int(y*tileSize));
      float b = map(brightness(c),0,255,1,0);
      float z = map(b,0,1,-150,150);
      translate(x*tileSize - width/2, y*tileSize - height/2, z);

Published by Tim on Friday March 20, 2020

Last modified on November 7th, 2020 at 16:15


11. March 2021

Interactive Grid System (Livestream)

Hey! In this recording of my very first YouTube-livestream i explain how to create an interactive visual system with Processing. […]

7. January 2021

Processing-Tutorial: Render Videos with the Movie Maker

There are several ways to render video from Processing. In this tutorial I’ll show you the easiest way I could […]

25. September 2020

Processing-Tutorial – Programming Posters

Some of you have asked for it, so here it is: A raw and uncut tutorial in which I explain […]

4. September 2020

Bauhaus 101 – A beginners Processing Tutorial

Hi and welcome to this very condensed and quick tutorial that aims to get you amazed for Creative Coding in […]

20. August 2020

How to use p5.js with Visual Studio Code

In this short tutorial i explain how you can use p5.js with Visual Studio Code. For this purpose, i’ll use […]

27. July 2020

The Magic Triangle

The Magic Triangle is a powerful creativity technique that can be applied to many different areas.

6. December 2019

Processing-Tutorial: Image-Rasterizer

Level: Beginner & intermediate In this tutorial i’ll guide you through all the necessary steps to rasterize an image with […]

4. November 2019

Processing-Tutorial: WAVES pt. 1

This is the first part of a brand new tutorial-series about Waves, a fundamental skill and feature in Generative Design […]

16. April 2019

Processing-Tutorial: Kinetic Typography 1

In the last years i’ve observed a new tendency in typography and graphic design which has been made possible by […]

14. April 2019

Processing-Tutorial: Video Export

One of the most powerful features of Processing in comparison to all web-based approaches and frameworks (like p5.js) is the […]

1. March 2019

How to rasterize an image with Processing

In this post i’ll teach you how to access the data of an image and how to use it to […]