Assignment 4 – DNA Strand

Introduction

Before I talk about what I made, I had some experience in 3D printing and modelling but only ever using Fusion Autodesk. I never made something programmatically. Most of the time I’ve made things that have some functional use of real life rather than purely aesthetics. I would have never known that you could use p5.js to create models which could be exported as STL’s or Obj’s. 

Concept

https://www.istockphoto.com/photo/digital-dna-strand-representation-in-blue-with-particle-effects-gm2188060332-606604549
Credit goes to bymuratdeniz for the image.

For this project going into it I had the idea of doing something biological. I wasn’t sure what just yet, but one of my favorite ideas was to create a DNA strand like the ones you see online. I felt it was a shape which would be hard to create manually and using a 3D printer would be perfect. I don’t know whether they look like that in real life.

Implementation

Step 1

I started by creating two boxes with a gap in the middle. It took some getting used to having to use translate more often and starting from the center. I haven’t programmed in WEBGL in a while

Step 2

I then started by stacking them on top of each other. The way I did it I don’t think was what we had done in class exactly. Rather than decide the height and the height of each rows are mapped to be evenly spaced to fit in the height (which leaves gaps). I instead had each row stack on the previous one.

Step 3

Then to program the rotation of each row I originally thought I may need to use a sin wave somehow and do some complicated math but it was far easier than that. I made a rotation variable which mapped the index (which goes from 0 to rows-1) to 0 to TWO_PI. I tried just PI at the beginning which made one twist of the strand which looked interesting but I wanted more.

Step 4

After creating the helical shape I had to create the line that connects across from one side to the other in each row. This was fairly straightforward, I created a box with a width that fits the gap. I originally thought I might have to center the box somehow but I forgot that the boxes are moved and translated from the center point and not from a corner like I got used to.

Step 5

After this I made the function keypressed and had it such that when you press a key it saves the model. The reason I used keypressed was because I liked using orbitControl a lot and viewing the model from different angles, but that meant clicking the screen a lot. After saving the model I took it into PrusaSlicer. For whatever reason STL didn’t work so I had to use Obj.

End Product

When putting the STL into PrusaSlicer I learned that it had to be placed on its side to have the lowest print time. I originally thought that there may be no difference. I can’t explain why exactly but I assume it’s partly because there didn’t need to be any support.

Conclusion

I’m happy with how everything turned out but in the future I would like to continue the biological theme. Maybe I’ll try something related to the brain next time. I was worried that because I was using boxes in WEBGL that it may not print well. I thought there may have to be smooth transitions but it came out feeling solid.

The filament I used wasn’t as good as I thought it might be. it’s a transparent filament but it looked foggy. I hoped that maybe it may look crystal clear or at least clearer than what it ended up being. I guess because some parts of the print are thicker than others. I would like to try other filaments in the future.

It’s nice to have a project that goes well the first time every so often but that’s probably a sign that I’m not experimenting enough. In the future I’d also like to create models that are thinner/slimmer and use other shapes than boxes.

Week 4 3D Printing

Concept

For this project, I wanted to explore how repetition and variation in p5.js could create a three dimensional object that would be difficult to design manually. I also wanted the final object to have some kind of function rather than being completely decorative.

I experimented with a few different ideas before reaching my final design. My first idea was a small mug, and after that I experimented with a more abstract form. Through these tests, I eventually developed the final vase.

For the vase, I used repeated layers to gradually build the form vertically. The dimensions of the layers change as they move upward, creating the rounded body and narrower neck. The repeated horizontal layers also became a visible part of the final aesthetic, which I really liked because they show how the form was generated rather than hiding the computational process.

I also wanted to push the vase beyond the basic requirement of creating a printable 3D form. Rather than using one repeated shape at a constant size, I used repetition together with gradual variation to control the entire silhouette. The form continuously expands, contracts, and changes as it moves upward, creating the rounded body, narrow transition, and opening at the top while still remaining one connected structure. This meant I had to think about the vase as both an algorithm and a physical object at the same time. I also intentionally kept the repeated ridges visible instead of trying to make the surface completely smooth, because they reveal how the form was constructed and give the final object its own texture and visual rhythm. Making it hollow and functional added another level of difficulty, since I had to consider the interior space, wall thickness, stability, and printability alongside the exterior appearance. For me, going further with this project meant not just generating an unusual shape, but using the algorithm to control structure, function, texture, and form all at once, while making sure the final result could successfully exist outside the screen.

p5.js Sketch

https://editor.p5js.org/meera.alshamsi/full/1M5nv6Xss

I developed the form using p5.js in WEBGL. Instead of modeling the vase manually, I used code to control its overall structure and generate the repeated layers.

The main elements I experimented with were the number of layers, height, width, rotation, and how much the form expanded or contracted at different points. Small changes to these values could completely change the silhouette.

This was one of my favorite parts of the project because I could keep changing the algorithm and immediately see different versions of the same basic idea.

3D Design and Workflow

My workflow was much more experimental than I originally expected.

I began by testing a mug because I wanted to create a recognizable and usable object. The mug did successfully print, including the handle and hollow interior, but it came out much smaller than I intended. I was having trouble understanding how the scale of my digital model would translate into the final print.

After the mug, I decided to experiment with a more abstract algorithmic form. I wanted to push the design further and create something less predictable using repeated geometry.

However, this test stopped printing partway through because there were problems with the design itself. Some parts of the geometry were not suitable for the printer, so the printer could not successfully continue building the object.

At first this was frustrating, but it became one of the most useful tests because it showed me that creating an interesting 3D form on a screen is very different from creating an interesting form that can actually exist physically.

After these experiments, I redesigned the form as a vase. For this version, I paid much more attention to making the geometry continuous and connected while still keeping the algorithmic qualities I wanted.

Final 3D Print – Vase

My final piece is the vase.

The vase uses repetition throughout its structure, but the repeated layers gradually vary in size to create the overall silhouette. The lower section expands outward into a rounded body before gradually becoming narrower toward the neck and opening again slightly at the top.

What I especially like about the final print is that the repetition is still visible. The horizontal ridges give the vase texture and make the process of building the form layer by layer noticeable in the physical object.

Compared with my earlier tests, the vase also feels much more resolved. It is still clearly an algorithmically generated object, but it has a recognizable and practical function.

Process and Challenges

The biggest challenge throughout this project was learning that a 3D model that looks correct on the screen is not necessarily suitable for 3D printing.

I ran into this problem several times. My first mug successfully printed, but it was much smaller than expected because I was struggling with scaling the model correctly. This taught me that dimensions have to be considered much earlier in the process instead of only when I am ready to print.

My second experiment created a different problem. I tried making a more abstract object, but the print stopped because of an issue with the geometry. Parts of my design worked digitally but were not structured correctly for fabrication. This made me go back into the design and think much more carefully about connections, thickness, openings, and whether the printer could physically build each part.

Making the vase required several adjustments for exactly this reason. There were many moments where I liked how something looked digitally but had to change it because it would not print successfully. I eventually learned to think about the printer while I was coding instead of treating printing as something that only happens after the design is finished.

Another challenge was time. Every failed print meant going back to the design, changing something, exporting it again, preparing it for printing, and testing it again. Because 3D printing itself takes time, even a small design problem could slow down the entire process.

Reflection

This project probably taught me more through the things that went wrong than through the things that immediately worked.

At the beginning, I was mainly asking myself, “Does this look good in p5.js?” By the end, I was also asking, “Can this actually be printed?”

That completely changed the way I approached computational design. The small mug taught me about scale. The failed abstract piece taught me about geometry and printability. The vase brought those lessons together because I had to create something that was visually interesting, algorithmic, connected, and physically printable at the same time.

I also realized that 3D printing places limitations on computational design, but those limitations can actually improve the design. I had to simplify certain ideas, strengthen connections, think about wall thickness, and make sure the form worked as one continuous object. Instead of seeing those limitations only as problems, I started using them as design decisions.

My final vase is very different from where I started, and I think that progression is an important part of the project. I did not simply create a digital object and send it to the printer. The failures of the physical prints changed the code and ultimately shaped what the final object became.

That was probably my biggest takeaway from this assignment that computational design and fabrication are not two separate stages at all, they directly affect each other.

Assignment 4

Concept

I was walking towards D1 and kept seeing this large-scale sculpture outside, and I remember when I first visited this campus seeing this, I had this first impression that it reminds me of rings or ribbons forming a pattern in rhythmic gymnastics. Now seeing this, because these shapes differ in sizes and tilts, I wanted to translate this, using this idea of repetition with imperfection into an algorithmic 3D design in p5.js.

As I made notes, I was thinking about what direction each idea could go in:

  • Stack of rings, with each ring independently sized, rotated, and tilted as the loop travels upwards along the Y axis, creating rings that will never stack together perfectly in alignment or spacing.
  • Tube swept along a spiral path, which is basically the same concept but instead it uses one shape continuously.

Workflow

I designed both directions in p5.js using buildGeometry() to combine primitives (cylinders and tori) into a single mesh, with random() values controlling each layer’s size, rotation, tilt, and offset. I exported the mesh as an .obj with saveObj(), then changed the size and orientation in TInkerCAD, then opened it in PrusaSlicer to scale it and add supports, and printed it on the Prusa.

Process and Challenges

First Direction (Stack of Rings)

Link: https://editor.p5js.org/sa8831/sketches/-4kZhroTQ

My first version stacked tilted discs of varying thickness with gaps that grew upward. It closely matched my reference, but I knew it couldn’t print: every disc floated with nothing connecting it to the base or its neighbors.

My first fix was to switch to torus rings and slot thin discs between them, hoping to hold the stack together. It failed. The discs were smaller than the ring holes and the stack was stretched to 380 units, so they touched nothing. I had also removed the base, so the piece went from 14 loose parts to 23.

The working fix was a central spine: one cylinder per ring, sized to reach into the ring’s solid tube and overlapping its neighbors vertically, plus the base. This kept each ring’s random radius, tilt, and offset, but joined everything into one body. A side effect was that the spine filled the rings in, so they became solid discs with rounded rims, which brought the form back close to my original discs.

Second Direction (Tube coil swept along a spiral path)

Link: https://editor.p5js.org/sa8831/sketches/CJ9PQA07M

Alongside the rings, I built a continuous tube swept along a spiral path, with the number of turns, radius, and height randomized so every run gave a different coil. I wanted to see whether the same twisting, uneven idea would read differently as one unbroken form instead of stacked pieces. On screen it worked: it looked like a loose, organic spring.

The print didn’t. Every loop of the coil overhangs the one below it, so the slicer needed supports. I chose “supports everywhere,” assuming supports are easy to remove. They weren’t. The coils are small and tightly spaced, so the support material filled the gaps between them. Since the supports and the model were the same white plastic, I couldn’t tell which was which, and the thin tube snapped while I was trying to pull them away. After a tedious attempt at cleaning it up, I gave up.

That failure decided my direction. The rings stack layer on top of layer, so their overhangs are shorter and the piece could survive the print. The ring stack became my final piece because I redesigned the form around what the printer could do, not just what looked good on screen.

Final Prints: Ring Stack

I printed three final pieces at different sizes: one large and two smaller. Every piece came from the same algorithm but a different random run, so each has its own silhouette. The large one shows the full stacking of tilted, offset layers, while the smaller two came out as a bowl-topped column and a tapering cone. I chose which outputs to print instead of designing them by hand.

Scale mattered more than I expected. On the small prints, the tilted rims and joins approach the printer’s nozzle and layer resolution, so edges look softer and some layers blend together. The supports were also tedious to remove: they sit in tiny gaps between layers, and I had to cut away each small piece by hand. The large print kept sharp, rippled edges, and its supports were far easier to reach and clean up. In the future I’d try tree (organic) supports, which touch the model at fewer points and come off much more easily than the default grid supports.

Trial 1 (Small Scale), where it looks like there is a the bowl on top of a column. Sketch (left) and print (right).

Trial 2 (Small Scale): Looks like a tapering cone, like a beehive. Sketch (left) and print (right).

Trial 3 (Large Scale): Looks like a wide stack of tilted, offset layers with a small disc on top. Sketch (left) and print (right).

Reflection

When thinking about it in 3D, I had to understand how things are on-screen versus when printing them, because unexpected things can happen (like supports and scale). So, printing forced me to think of the piece as a physical object that has to hold itself up. With that in mind, I added a base and a central spine, which changed the form itself, turning open rings into solid, rounded discs. Printing also decided which direction I took since the coil looked most interesting on screen but was the least printable, so I dropped it after the supports fused to it.

In p5.js, each run of the sketch is just a new preview, but once printed, each variation became a permanent object, so choosing which one to make became part of the design. Scale taught me a similar lesson of this idea that the same algorithm behaves differently at different sizes, because the nozzle, layer height, and support removal don’t shrink with the model. When doing this in the future, I would design with overhangs and support access in mind from the start, use tree supports, and lock a random seed so I can compare sizes directly.

Assignment 4: 3D printing Snowflake

Concept

My design is based on how a simple rule can create an organic-looking form. I started with the basic idea of a snowflake (or a flower, idk :)) and represented each spike as a repeated rectangular block arranged radially around a central point. Instead of making all the spikes identical, I used a mathematical function to change the radius and height of each spike. This creates controlled variation, making the snowflake look less mechanical and more natural.

I also wanted to add some kind of random element into this assignment, which serves the concept well because randomness is a part of how nature works. The code also randomly generates the number of spikes, ranging from 3 to 7, so each version of the design can be slightly different. As a result, the final object sits somewhere between natural growth and structure.

I was particularly interested in exploring how I can depict the difference between natural imperfections and computer-generated repetition. I tried to recreate this idea computationally rather than manually designing every spike.

p5j sketch

https://editor.p5js.org/Joud_290/full/eqZRVQq_E

p5j generated pictures

The random function was used to determine the number of spikes/petals of the object. I set it to be between 3 and 8.

Prusa Slicer

The object after slicing on Prusa Slicer

Final physical result

In p5.js, I first created the flower shape using repeated petals, rotation, and some mathematical variation. At this stage, it was mainly about getting the overall pattern and shape that I wanted.

When I imported it into PrusaSlicer, I could see how the design would actually work as a 3D object. It was the step to check for any errors in terms of connectivity, edges, etc. After editing, the shape became more solid, and I could see the thickness and the way the spikes would be printed layer by layer. There was initially a problem with open edges, but it got resolved

The final 3D print ended up being very similar to the PrusaSlicer preview. There were only small differences from the physical printing process, but the details of the shape stayed the same. This was useful because it showed me that the design I created digitally translated quite well into the actual object.

I also found that each stage showed something different. p5.js was just for creating the pattern, PrusaSlicer was for preparing it for printing and running to see if it has any problems, and the final print showed how the design actually worked as a physical object.

Reflection

never tried designing 3D objects with code before, so even though it was challenging at the beginning, it was a fun project to work on. I learned how to use different techniques in p5.js to get a specific shape that I wanted. I used sine waves to control the size and height of the petals and make the design change more smoothly. I also learned that creating something digitally and turning it into a physical object are two different steps. Seeing the design in PrusaSlicer and then as an actual 3D print helped me understand how the code and the physical printing process connect. Overall, this project helped me become more comfortable with using code as a way to create and experiment with 3D forms.

Week 4

Concept My concept was inspired by an hourglass shape combined with a spiral pattern. I wanted the form to twist as it moves upward while still keeping the overall shape of an hourglass. I used code to repeat and rotate the geometry to create the spiral. I also added a square shape at the top and bottom of the code. This helped frame the spiral, made the hourglass shape more clear, and gave the design more support.

Link to p5.js sketch

https://editor.p5js.org/maa9946/sketches/Ekqykopgr

3D design screenshots and your workflow

Photos of tests and final 3D-printed result

Test 1

Test 2 (minimal support)

Final Result (Organic support)

Process and challenges

One of my main challenges was getting the code to create a model that could actually be 3D printed. Some parts were too thin or not fully connected, which caused problems when preparing it for printing. To fix this, I added the square base and square top so the spiral had stronger support and stayed connected. I also resized parts of the model, adjusted the code, and added printing supports so the full shape could print properly.

Reflection on how 3D printing changed or shaped your computational design

3D printing changed my computational design because I had to think about more than how the model looked on the screen. I had to consider whether the form could physically stand and print successfully. The square top and bottom were originally added for support, but they also made the design look more like an hourglass. I had to resize the model, add support, and change parts of the code so the design could be printed completely. This showed me how turning a digital design into a physical object can change and improve the original idea.

Assignment 4 -3D design using p5.js

Concept

For this assignment, I wanted to create a vase-like sculptural form using repetition and twisting. I didn’t want to make a normal smooth shape, so I used small boxes repeated around four sides and stacked them in layers. As the layers move upward, they slowly rotate, which creates the twisted form.

I also changed the size slightly throughout the layers using a sine function. This makes the sides curve in and out instead of staying completely straight. The object is open at both the top and bottom, so my focus was more on the shape and structure rather than making a functional vase. I liked how the form looks different depending on which angle you view it from, especially because you can look through it and see the twisting structure inside.

p5.js Sketch

https://editor.p5js.org/mharaalnuaimi/full/bfulypwVC

Process and Challenges 

My first attempt at printing did not work. I had booked a 3D printing session, but when I tried to prepare my design, there was a problem with the file and the printer was not able to recognize it properly. Because of this, the print never actually started and a lab assistant sent me an email stating it did not work out and that I had to book another session. So, I later did that. 

When I came back for my second session, the lab assistant helped me properly prepare the file and set everything up for the printer. This time it worked, and the print started successfully. I was a little worried that I might have another issue, but thankfully the printing process went smoothly and the final object came out successfully.

One challenge I didn’t expect was removing the supports after the print was finished. Because my design twists and has open spaces inside, there were supports inside the form that were difficult to reach and remove. The lab assistant gave me a tool that helped, but it still required a lot more strength and patience than I expected. I also had to be careful while removing them because I didn’t want to accidentally damage the actual print.

Even though I didn’t make a separate physical test print, the failed first session helped me understand that preparing the digital file correctly is just as important as the design itself. After fixing that issue, I was really glad that I didn’t have any other major problems and that my final print came out successfully.

Prototype:

On Prusa Slicer:

With Supports:

Final Result 

I was really happy with how the final print came out. The twisting effect from the code is very visible in the physical object, especially from the sides. From the top, you can also see how the square opening gradually rotates through the object.

Something I also noticed after printing was the layer lines. On the computer, the design looked much smoother, but in the physical print you can clearly see the layers that built the object. I actually like this because it shows how the object was made and makes the repetition in my code visible in a different way.

The object also looks quite different depending on the angle. From the side, it looks more like a curved and twisted vase, while from the top you can see the square geometry and the rotation much more clearly.

Reflection 

This assignment made me realize that designing something digitally and actually 3D printing it are very different. When I was working in p5.js, I was mainly thinking about what the shape looked like on the screen. Once I had to print it, I had to think more about whether the geometry could actually exist physically and how the printer would build it.

The supports were probably the biggest example of this. I didn’t really think about them while coding, but once the object was printed, they became an important part of the process because I had to remove them without damaging the actual design.

I also think the physical result made the algorithm easier to understand. The repeated boxes, changing size, and gradual rotation are things I created through code, but in the final object they become actual curves, layers, and textures that I can hold and look at from different angles.

Overall, I’m glad that after the problem with my first printing session, the second attempt worked without any major issues. It also made me more comfortable with the process of taking something from p5.js and turning it into an actual 3D-printed object.

Assignment 4 – 3D Design

Concept
For this assignment I wanted to explore how simple repeating shapes could be used to create more complex 3D forms. I began with rules about repetition, rotation, size and movement, rather than starting with a specific object. I made three distinct designs using boxes and spheres, changing variables such as the number of layers, radius, rotation and size of each repeated shape. The first design I did is a repetition of boxes layered to create a form that twists and has waves. The second design is based on spheres of different sizes and positions which create a more organic and irregular shape. For my third design I moved away from the vertical forms and experimented with radial growth. Five curved arms growing out from a central point, gradually becoming smaller toward the ends. And I wanted to see how some mathematical rules could totally change the overall shape of a 3D design with these experiments.

p5.js Sketches
Design 1 – Tower Sculpture 1
Design 2 – Tower Sculpture 2
Design 3 – Star

3D Design Screenshots & Workflow

Final 3D Print


Process and Challenges
I started by playing with simple repeated shapes because I wanted to see how small changes in the code could impact the whole 3D form. One of the big things I experimented with was the relation between repetition and variation. When I used the same size and position for all repeated shapes, the designs looked too regular. The forms became more dynamic with sin(), map(), rotation and changing sizes. Another challenge was thinking of the designs as physical objects and not just looking at how they look on screen. There are some shapes that look good in the digital world, but have tiny gaps or parts that don’t connect well enough to be 3D printed. This meant that I had to think about the spacing, size and overlap of the repeated shapes when thinking about what design could be a physical object. I also experimented with different numbers of layers and repeating parts. Increasing these values led to more dense forms while decreasing them opened up the structure. Testing these variations has shown me how much the overall design can vary with only a few variables changed.

Reflection
This assignment changed the way I thought about computational design because I had to consider how the code would become a real physical object. When working only on the screen, I was mostly focused on whether the form looked interesting. When I started thinking about 3D printing, the thickness, spacing, connection, and scale became more important. I also noticed that very small changes in the code could have a big impact on the final form. Changing the number of pieces that repeat, the amount of rotation or the values inside a sine wave could completely change the shape . This made the process more experimental, since I could make different versions by changing a few variables. The difference between designing digitally and designing for 3D printing was that the end product had to work visually and physically. I started to really think a lot more carefully about the connection of the repeated shapes and how the object would exist as a structure. Overall, 3D printing made computational design feel more tied to material and physical constraints.

Week 3: Laser Cut Chun Lian

https://editor.p5js.org/hc4127/full/X_kBemr2d: Week 3: Laser Cut Chun Lian

Concept

So in Taiwanese/Han culture we welcome the Lunar New Year with “chun lian”, long pieces of bright red paper, on our door frames. I believe they’re officially called spring festival couplets in English but I’ve never called them that before; their purpose is to ward off misfortune and bring in good vibes for the upcoming year. 

We write short poems/sayings on these long rectangular pieces of red paper with black or gold ink and usually put one or two next to our doors; however, there’s a few characters that we write on squares by themselves as well. 

So ever since I moved out, I’ve forgotten to buy chunlian for the new year 3 years in a row. For this week I decided to create a laser-cut chunlian by myself; this way when Lunar New Year approaches, I’ll have a physical reminder to buy some chunlian this year and in the worst case scenario I’ll still have this.

Vector Design

The specific character I wanted to create was 福, which signifies fortune and wellbeing. I think my life’s been lacking in the fortune and wellbeing department recently because of three continuous years of forgetting to ward off the bad spirits. 

You can find my code in the embed sketch I attached; I don’t want to take up all the space here.

Final Design with the red background for contrast

Photos of Final Fabricated Result

The acrylic one didn’t turn out very legible

Process and challenges

So I knew this was going to be rather difficult even before I started but Chinese calligraphy is pretty hard to recreate using vector points. It was a bit frustrating to just draw it by memory I had a nice idea to load up a real calligraphy font with the text() function to put 福 there. I would then display the mouse position coordinates to draw using the beginShape() function.

Matching Mouse Coordinates to the point I wanted to draw

Once I had the character there in the center, I could decorate the negative space around it. While I was thinking of how to decorate it, I was inspired by the draggable windows file explorer handle on the bottom right corner. That’s how I got the ideas for the corner designs.

When I started doing the vector for the 口 (kǒu) stroke on the right hand side, I realized I’m going to have to do something tricky by “weaving” the vector outline inside the character because the character has negative space inside. I did the same thing again for 田 (tián) but thankfully in calligraphy form there’s only two “gaps” for me to weave in and out of.

A glimpse of the array for the 口 (kǒu) part, where I had to weave the line in to keep it all one shape.

Reflection on how laser fabrication shaped my computational design.

I was initially wary of the precision the laser cutting was capable of but I was told by my peers that they were surprised by how accurate and intricate the laser cutter was. However, a difficulty that remained for me was getting the character to look “flowy” like it was written using a calligraphy brush; I thought perhaps changing my function to use splineVertex() instead of vertex() would approach the effect I desired but it just looked kinda off.

So as you can see, I ended up sticking with the hard vertices I started with, I think there’s a unique quality to it being a vector drawing I did point by point. I might actually hang it up somewhere once the laser cutter is operational again.

During the laser cutting process, Dustin realized that the reason why my laser cutting process was taking such a long time (nearly 40 minutes each) was because the vector file I had exported from p5.js had at least thirty “layers” so it would trace each cut over thirty times before moving onto the next one.

Since this was my first time laser cutting I thought all laser cutters are very thorough, let’s say; however, it turns out the vector file was just incredibly unoptimized. It’s completely unnoticeable until you reach the laser cutting software. My theory is that the svg export from p5.js didn’t take just one snapshot of the canvas but multiple frames based on draw() function’s framerate.

The engraving ended up very burnt and it cut very deeply into the plywood but I think it actually looks pretty good.

Assignment #4 — Deathmatch Scenario Generator

I am fond of video games, I play generally a lot of them and one of the genres I play the most is the First-Person Shooter genre. Due to this, and from experimenting with the algorithm we created in class, I wanted to modify it in order to be able to create randomly generated scenarios. These scenarios could theoretically work in a multiplayer map for players to battle each other.

Render showcasing the .obj outputted from the p5js sketch and the imported into Blender using the Cycles Engine. The two characters that are there are just for showcases purposes for scale.

Inspiration

I was mainly inspired by some Counter Strike maps generated by the player base. For example, these are some of the maps that came into my mind when thinking about this idea:

As you can see, there is an emerging pattern in some of these. They feature cover that are sometimes seemingly random, and certain patterns that could be easily translated into some algorithm.

The P5js Sketch and its explanation

Link to the sketch: https://editor.p5js.org/mdh8552/sketches/SLLx1hDnz

Note: While the logic is mine, Gen A.I. helped me program some technicalities.

Update as of September 28th, 2026: I purged some parts that were entirely made with A.I. as it was complicated for no reason.

My approach to coding this was the following:

  • Do I mathematically know how to do this?
  • Can I expand on what was taught in class?
  • Can I expand on what was taught previously regarding randomness?

Especially, I did overestimate what kind of knowledge you require in order to actually make interesting designs in 3D. Sadly, I do not possess enough mathematical knowledge to make complicated designs, but at least I am able to think in 3D dimensions using boxes and for loops.

Now, regarding how the code works, basically, three main things are happening:

  1. The first for loop starts with the Y elevation, starting at a value of 0 (the floor).
  2. Then, the Z position is chosen to start, again at 0 (top left).
  3. Then, the for loop for the X position (the filling part) begins, starting at the initial Z position.
  4. This repeats until all the required boxes are finished.

There are variations in each part of the for loop. For example, when it starts to fill the boxes in step number 3, there is a chance that a box will not be generated and therefore, there will just be a blank space. However, these blank spaces are only generated when the Y value is 0 and the X and Z values are between 1 and the last number before the maximum number of boxes.

Also, when it starts to move to new elevations in the Y value, there are certain things happening. For example, at level Y=1, all the corners will have a generated shape. They will also generate a box within the range of 1 and the maximum number allowed inside X and Z. At Y=2, there is a chance that a box will generate only on the spots where a box was generated at Y=1. Not always, just a chance.

All of this then hopefully creates something that resembles the kinds of multiplayer maps that inspired me.

Also, if you want more explanation of the code, you can check the sketch. Most of the parts are commented.

Preparing for printing

After the code outputted the desired .obj (the one that is the same one as the render I did), I then started to prepare the file for 3D printing using PrusaSlicer.

The .obj file exported without anything.

Preparing it in PrusaSlicer for 3D printing.

After getting the gcode ready, it was time to 3D print it, which showed the following result:

It is very similar to the render at least. The only thing missing would be the characters for scale.

Challenges?

At the moment, I believe the biggest challenge in this case was thinking of a 3D element that was not just some extrusion, but also not so complicated that I could not explain it given my limited math knowledge. Not only this, but I also had to think about the limitations of the 3D printer, as well as the time it could take to print something. I took all of these aspects into consideration when designing this, which is why I did not encounter any issues when printing, for example.

I believe that in order to make something more interesting, I would have to research it online. However, at the moment, this kind of algorithm is something I can safely explain.

Reflection

Making 3D designs in p5.js is actually very fun and interesting. At least, I believe it is more fun than making designs in 2D. There is more to it, and given what I just did for this project, it is actually possible to make some architectural designs later on with some random aspects to them. I have a special interest in architecture since I love making 3D levels or just general architectural designs.

Even though I am still not sure if this would be considered drawing, as in drawing random architecture, it still greatly changed my view of how I consider my 3D designs. There are limitations, at least on this machine, but there are still enough features and elements that make it fascinating.

Nevertheless, I have seen how my classmates have created complex designs on the 3D machine that seem to be actually feasible, such as some variations of the hourglass. However, again, for this time, I decided to play it safe within the limits of my knowledge.

I believe adding more elements to this design, such as triangles simulating stairs or random spheres, would have helped, but I did not think of it until now, sadly. Still, I believe I found a new niche that I am particularly interested in.

Extra

Here are random screenshots of the rendering process of the outputted .obj on Blender.

Credits

This is where I got the model of the people to showcase the scale: https://sketchfab.com/models/7f18aaccd0ee4694a36646101a12339e/embed

 Assignment #4: 3D Design in p5.js

Concept:

For this project, I wanted to see how far I could push one simple shape: a cube. Instead of designing an object by placing every part individually, I wrote rules in p5.js that repeated cubes in rings and layers. I could then change a few values, such as the number of cubes, the radius of each ring, or the rotation of each layer, and watch the entire form change. I was really interested in how my sketch reached a point where a repeated geometric pattern begins to look like something organic or sculptural.

My design developed through three experiments. The first began as a flower, but the repeated cubes created a more angular snowflake shape, so I decicded to print it in white PLA which really made it come to life. For the second, I moved from a mostly horizontal form to a tall, twisted cube vase. I liked its movement and its unusual silhouette, but the print required too many supports and did not come out as I had imagined. I used what I learned from that failure to make my final design: a cube hourglass. It kept the narrow waist and layered texture I liked while giving me a form with a better chance of printing successfully. I also learned very quickly that bigger 3D prints don’t always mean they are more stable, so I sized my last print down a little.

How I Used Code to Build the Forms:

Link to Snowflake Sketch:

https://editor.p5js.org/AsmaAlMurr/sketches/J6tcXd-dO

Link to Twisted Cube Sketch: https://editor.p5js.org/AsmaAlMurr/sketches/nNeUmYNae

Link to Hourglass Sketch:

https://editor.p5js.org/AsmaAlMurr/sketches/PZ-kuRUmY

All three designs were made in the p5.js using WEBGL. Rather than drawing a flat outline and extruding it, I positioned cubes directly in three-dimensional space. Each sketch uses loops to repeat the same cube according to a rule. buildGeometry() collects the cubes into a model, which I exported as an OBJ file by clicking the canvas. I then opened the OBJ in PrusaSlicer to examine it as a potential print. (Using STL to save the file didnt work for me, and im still unsure if that was an error in my code or if its an issue with p5js or my browser has it blocked on my laptop.)

Quick Overview of My Code:

In the first sketch, I used 12 cubes around each of four rings, with a larger radius for every new ring. The code rotates each cube around the center, moves it outward, and slightly changes its height and angle. I originally thought of these repeated units as petals. Once I saw the form, however, the sharp edges and radial symmetry reminded me more of a snowflake. That unexpected change was one of the most interesting parts of working with an algorithm: I set up the rules, but the overall character of the object emerged from their repetition.

For the twisted cube design, I changed the structure from rings spreading outward to 18 rings stacked vertically. Each ring contains 16 cubes. The twist value increases with each layer, so the cubes gradually rotate as they rise. I also used a sine function to vary the radius, making the outline expand and contract. From the side, the stacked rings show a twisting structure, but from above they reveal the individual cubes that create it. I liked how the form seemed to move even though it was made entirely of identical, rigid blocks.

For the final hourglass, I kept the idea of stacked rings but changed the rule that controlled their shape. Instead of twisting every layer further than the last, I used 32 cubes in each of 20 layers and gradually reduced the radius from 100 to 65 before increasing it again. This created the narrow center of the hourglass. The code still produces a detailed surface through repetition, but the overall structure is more regular. It felt like a better balance between the complexity I wanted and the physical requirements of printing.

Code Snippet I Found Interesting:

(This code snippet is from experiment 3: hourglass)

if (l < layersNum / 2) {
  r = map(l, 0, layersNum / 2, 100, 65);
} else {
  r = map(l, layersNum / 2, layersNum - 1, 65, 100);
}

Here, l is the current layer and r is the distance of its cubes from the center. In the first half of the form, map() gradually reduces that distance from 100 to 65. In the second half, it increases the distance back to 100. I found this interesting because such a short piece of code controls the silhouette of the entire object. Rather than positioning hundreds of cubes by hand, I could change two radius values and immediately see a different hourglass shape. It also helped me respond to experiment 2 which was a failed print. I could keep the dramatic narrow middle I liked while making the layers more structural for the final printed design.

3D Design Screenshots and Workflow:

My workflow moved back and forth between the p5.js preview and PrusaSlicer. In p5.js, I could rotate the view and quickly change numbers in the code to explore different arrangements. This made it easy to experiment with forms that would have taken a long time to build cube by cube. After exporting each OBJ, I opened it in PrusaSlicer to see the model on the print bed and consider how it might behave as a physical object. The p5.js previews were useful for judging the shape and overall structure of the cubes. PrusaSlicer made me look at the same designs differently. I had to think about the base, the gaps between cubes, the overhanging areas, and where support material might be needed. It quickly made me realize A form that looked convincing on screen was not necessarily straightforward to print.

Print Tests and Final Result:

Experiment 1: Snowflake

The first printed experiment was the white snowflake, that was originally supposed to be a flower but I felt like after going through the code and printing it in white PLA, it really resembled a snowflake that would be used as a Christmas / winter decoration. I liked how clearly the individual cubes remained visible, while the repeated rings still formed a recognizable pattern. The physical print made the design feel different from the screen preview because the cubes cast small shadows on one another, and the raised center gave the object more depth than a flat flower illustration would have had. Although I was pleased with it, I wanted to challenge myself to make a more three-dimensional form.

Experiment 2: Twisted cube vase (Failed)

My next print was the twisted cube vase. This was the most ambitious experiment, and it did not produce the clean result I expected. Its unconventional shape needed a large amount of support material. I made the mistake of printing the object right before the IM lab closes so I had to wait until the next day to try to remove the supports. They were difficult to take off! After many attempts of trying to cut off the supports, the white printed result had a rough, intricate surface and an interesting shape of its own, but many of the crisp cube details became obscured. It looked almost like an artifact or a textured column. However, I do appreciate that accidental quality, even though it was not the object I had set out to make.

Experiment 3: Hourglass made of cubes

The final print was the black cube hourglass. Its outline widens at the top and bottom and narrows at the center, while the repeated cubes give the surface a detailed texture. The dark material also makes the shadows between the cubes more visible. Compared with my previous print, this result was SO MUCH BETTER and actually communicates the complexity of the form much more clearly. It is still recognizably made from an algorithm, because the same unit appears again and again, but the units work together to make a complete sculptural object that looks really unique.

Process and Challenges:

The biggest challenge was understanding the difference between a visually exciting digital model and a successful physical print. When I first saw the twisted cube sketch (experiment 2) on my screen, I was focused on its complexity. During printing, the same features created practical problems. The spaces and overhangs around the cubes required extensive supports, and removing those supports affected the surface I wanted people to see. The failed print made me reconsider the design rules of 3d printing instead of simply trying to make an object that just looks cool. I asked which qualities mattered most to me: the tall form, the narrow middle, and the texture created by repeated cubes. The continuous twist was visually interesting, but it was not essential to those ideas. By changing the radius gradually and arranging the layers more regularly, I made the hourglass. This was not a completely new direction; it was a revision based on what the previous object taught me.

Reflection:

3D printing changed the way I approached computational design because it made my code answer to physical constraints. In p5.js, I could generate hundreds of cubes and make them appear to form a continuous object. Once I tried to print that object, I had to consider how its parts connected, how it would stand, where supports would touch it, and how those supports would be removed.

I also learned that an unsuccessful print can still be a valuable part of the design process. The rough twisted print showed me both what was exciting about my idea and what needed to change. The final hourglass came from keeping the strongest visual qualities of that experiment while revising the algorithm around the realities of the printer. For me, the project became less about producing the most complicated possible shape and more about using code, testing, and material feedback together to develop a form that works in three dimensions.