{"id":6708,"date":"2025-03-26T13:16:55","date_gmt":"2025-03-26T17:16:55","guid":{"rendered":"https:\/\/dkc.umw.edu\/?p=6708"},"modified":"2025-03-26T13:16:55","modified_gmt":"2025-03-26T17:16:55","slug":"04-a-new-dimension","status":"publish","type":"post","link":"https:\/\/dkc.umw.edu\/fellows\/2025\/03\/26\/04-a-new-dimension\/","title":{"rendered":"04 A New Dimension"},"content":{"rendered":"\n

In order to prepare for working with 3d objects (my plan for representing the planets), I wanted to familiarize myself with the tools in p5.js that enable 3d. As it turns out, they’re rather simple. You must simply declare the canvas with an extra argument (WEBGL), and then you may call commands such as orbitControl() which enables movement in 3d via the mouse.<\/p>\n\n\n\n

To practice the placing of objects in 3d, I played around with the code snippets provided in the documentation. Firstly, it’s just a sphere comprising rings of cubes.<\/p>\n\n\n\n

\n
\n
\"A<\/figure>\n<\/div><\/div><\/div><\/div>\n\n\n\n
\n
\"A<\/figure>\n<\/div><\/div><\/div><\/div>\n<\/div><\/div><\/div><\/div><\/div>\n\n\n\n

I added the ability to make concentric layers, here is 1 internal layer.<\/p>\n\n\n\n

To ensure this looks nice I am scaling the size of the cubes, the distance between the spheres of cubes, and the line thickness of each edge of the cubes.<\/p>\n\n\n\n

\n
\n
\"A<\/figure>\n<\/div><\/div><\/div><\/div>\n\n\n\n
\n
\"A<\/figure>\n<\/div><\/div><\/div><\/div>\n<\/div><\/div><\/div><\/div><\/div>\n\n\n\n

And at 9 internal layers, 10 concentric spheres in total, some interesting shapes and patterns emerge.<\/p>\n\n\n\n

\n
\n
\"A<\/figure>\n<\/div><\/div><\/div><\/div>\n\n\n\n
\n
\"A<\/figure>\n<\/div><\/div><\/div><\/div>\n<\/div><\/div><\/div><\/div><\/div>\n\n\n\n

Below is the code that was used to generate these images. I achieve different results by tweaking the values I have passed into different functions, chiefly the scale of the main sphere and number of sub-spheres passed into drawCubeSpheres(50, 10); 50 being the size used for all of these images, and 10 being the amount of spheres in these final two images<\/p>\n\n\n\n

function setup() {\n\n    createCanvas(1150, 750, WEBGL);\n\n    angleMode(DEGREES);\n    noFill();\n    stroke(32, 8, 64, 255);\n    describe(\n        \"Users can click on the screen and drag to adjust their perspective in 3D space. The space   contains a sphere of dark purple cubes on a light pink background.\");\n}\n\nfunction draw() {\n\n    background(250, 180, 200);\n\n    \/\/ Call every frame to adjust camera based on mouse\/touch\n\n    orbitControl();\n\n    drawCubeSphere(50,10);\n\n}\n\nfunction drawCubeSphere(scale, numSpheres) {\n    scale = ceil(scale);\n    \/\/ number of spheres of cubes\n    for (let i = 0; i < numSpheres; i++) {\n        \/\/ Rotate rings in a half circle to create a sphere of cubes\n        for (let zAngle = 0; zAngle < 180; zAngle += 30) {\n            \/\/ Rotate cubes in a full circle to create a ring of cubes\n            for (let xAngle = 0; xAngle < 360; xAngle += 30) {\n                push();\n                \/\/ Rotate from center of sphere\n                rotateZ(zAngle);\n                rotateX(xAngle);\n                \/\/ Then translate down (eg.)50 * 8 = 400 units\n                translate(0, (scale * 8) \/ (i + 1), 0);\n\n  \n                strokeWeight(scale \/ 10 \/ (i + 1)); \/\/ scales down\n                \/\/ strokeWeight((scale \/ 10) * (i + 1)); \/\/ scales up\n                \/\/ strokeWeight(5); \/\/ constant\n                box(scale \/ (i + 1)); \/\/ scales down\n                \/\/ box(scale * (i + 1)); \/\/ scales up\n                \/\/ box(scale); \/\/ constant\n                pop();\n            }\n        }\n    }\n}<\/code><\/pre>\n\n\n\n
What I’m working on next in this area is tracing 3d objects around a circular\/elliptical field. This project is involving more math revision than I anticipated but i do welcome the process of refreshing my geometry.<\/p>\n\n\n\n
Music<\/h2>\n\n\n\n
I must admit little progress has been made the last couple of weeks due to my failing to schedule time experimenting with music, I do however have a demonstration of the music in its starting state. I am working in Bitwig Studio as opposed to Ableton Live because I’ve found it much more stable and crashes far less often. The video shows one track per planet\/celestial object and in this current state each orbiting body is introduced slowly to get the listener accustomed to the rhythm before further complicating it with more and more cycles of notes.<\/p>\n\n\n\n
\n