Code to transform content for Holographic Pyramid with PGraphics


#1

Hello everyone I’ve created a code that can transform a three-dimensional content into holographic video for pyramid.

For the purposes of example, a three-dimensional shape taken from the Processing examples was used.
The content has been enclosed in a class called videoCreate. The algorithm provides for the adaptation of the video on LCD screens with different sizes in inches.

Visual material within the beginDraw() and endDraw() functions can be replaced with any design.

It is very interesting to make the video interactive using values coming from vibrational sensors placed on the holographic pyramid.

main Program:

PGraphics scene;

BlendingShapes shape = new BlendingShapes(1.18);
VideoCreate videoQuad = new VideoCreate();

int sceneSize;

void setup() {
  fullScreen(P3D);
  //size(760,760,P3D);
  background(0);
  frameRate(60);

  sceneSize = height/3;
  scene = createGraphics(sceneSize, sceneSize, P3D);
}

void draw() {

  // beginDraw
  scene.beginDraw();
    shape.set();
    shape.move();
    shape.display();
  scene.endDraw();

  //Create a Holographic video in four clock face
  videoQuad.videoOlogra();
}

class BlendingShapes:

class BlendingShapes {

  float posz, scale;

  float transparancy, xspeed, brightness;

  BlendingShapes(float tempScale) {
    posz = -300;
    scale = tempScale;

    transparancy = 30;
    brightness = 100;
  }

  void set() {
    scene.colorMode(HSB, 100, 100, 100, 100);
    scene.noStroke();
    scene.background(0);
    scene.blendMode(ADD);
  }

  // Position, size, move
  void move() {
    scene.translate(sceneSize/2, sceneSize/2, posz);
    scene.scale(scale);
    int rot = frameCount;
    scene.rotateZ(radians(90));
    scene.rotateX(radians(rot/60.0f * 10));
    scene.rotateY(radians(rot/60.0f * 30));
  }

  void display() { 
    for (int i = 0; i < 100; i++) {
      scene.fill(map(i % 10, 0, 10, 0, 100), 100, 100, transparancy);
      scene.beginShape(TRIANGLES);
      scene.vertex(200, 50, -50);
      scene.vertex(100, 100, 50);
      scene.vertex(100, 0, 20);
      scene.endShape();

      scene.rotateY(radians(270.0f/100));
    }
  }
}

class VideoCreate:

class VideoCreate {
  
  VideoCreate() {
    
  }
  
  void videoOlogra() {
    //Scenes Translate and Rotate
    //TOP
    translate(width/2-sceneSize/2, 0);
    pushMatrix();
    image(scene, 0, 0);
    popMatrix();
    
    //RIGHT
    translate((sceneSize*2)-1,(height/2)-(sceneSize/2)-1);
    pushMatrix();
    rotate(PI/2);
    image(scene, 0, 0);
    popMatrix();
    
    //DOWN
    translate(-sceneSize+1,(sceneSize*2)-1);
    pushMatrix();
    rotate(PI);
    image(scene, 0, 0);
    popMatrix();
    
    //LEFT
    translate((-sceneSize*2)+1,-sceneSize+1);
    pushMatrix();
    rotate(3*PI/2);
    image(scene, 0, 0);
    popMatrix();
  }
}

For any clarification I am here.

Thank you!


#2

Thanks for sharing this!

I’m not familiar with “holographic pyramids” – are these the kinds of things you are talking about? Something you put over a smartphone or tablet screen?

https://www.ebay.com/i/132166853963?chn=ps

https://www.ebay.com/i/262955171944?chn=ps


#3

Hi Jeremy!
Yes, that’s it.
In the project that I created, I built a 50 cm base pyramid, bigger than the ones on the net, it’s not difficult and there are many tutorials on the web.
I derived the size of the base from the inch size of the LCD screen. I am attaching the code in octave that automatically calculates the base and height of the pyramid.

% Piramide Beta Fisso.m

ref_base = 37.5; %reference base
pbase = 101/2.0;  %CHANGE THIS
ref_height = 47.25; %reference height 
rho = sqrt(ref_base^2+ref_height^2);
beta = 0.89670;

factor = pbase/ref_base;
pheight = ref_height*factor

prho = sqrt(pbase^2+pheight^2);
pbeta = asin(pheight/prho);

%LCD size
d = 32*2.54 %[OR THIS_size in inch(variabile)] * [constant]


bs = 19;
as = 9;

ds = sqrt(bs^2+as^2); %standard diagonal / standard base / standard height


factor_d = d/ds;

width = bs*factor_d %width LCD 16:9
height = as*factor_d %height LCD 16:9

Furthermore, I did not attach the whole part of the interaction, but it is possible to implement it easily creating a class that processes the serial data coming from a sensor (for example PIR or proximity) connected for example Arduino and associating these values with visual parameters.

In my project I used a vibrational sensor connected directly to the pyramid:

For any other clarification I am here!

Thank you :slight_smile: