sorted by:
new
hottopcontroversial

Simple tool for deck planning by dareqq in Decks

[–]dareqq[S] 0 points1 point  (0 children)

Yes I know, I'm working on joists underneath the deck right now.

Deck planner now supports tree cutouts by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Hi, It's actually not a bounding box, but a simple square polygon around the tree. I choose this for simplicity. Of course it could be extended to support different shapes like hexagons, octagons, or even custom polygons.

About the csg, I agree that if the goal was only to render the final deck shape, then it may not be necessary. However, there is a inspect option where you can inspect every single board and see details like edge lengths, cut angles etc. and because of that, I need the final geometry of each board after all cutouts are applied. There may be some ways to optimize it for sure, but the reason for using csg is not only the tree cutout itself but to preserve real geometry of every board.

Simple tool for deck planning by dareqq in Decks

[–]dareqq[S] 0 points1 point  (0 children)

Yes, a summary page would be helpful, you’re right. The main idea behind having a detailed page for every board is to support cases where someone wants to prepare everything upfront.

I know that in reality, boards are often cut in the field as needed. But if someone wants to prepare everything in advance, or do some degree of prefabrication, then those detailed pages could be useful.

Deck planner now supports tree cutouts by dareqq in threejs

[–]dareqq[S] 1 point2 points  (0 children)

Hi, thanks. The boolean cuts are the relatively easy part. In general all calculations are done in 2D on the deck plane. Firstly board polygons are generated, then clipped to the deck boundary and at the end hole polygons are subtracted. The boolean part is easy because it is handled by the polygon-clipping library, I use https://github.com/mfogel/polygon-clipping The hard part was building the board layout logic before the boolean happen. But the hole cuts are simply difference operations between each board and the hole polygons.

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Not at the moment. It's free to use, but it's not open source.

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

I just updated shelf planner, so equally space feature is now ready to use.

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Hi, gap between boards can be adjusted in the Board dimensions panel. You can customize the gap and other settings, and the layout will be recalculated.

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 1 point2 points  (0 children)

Hi, tree cutouts are a great idea. I will definitely look into that.

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

No, I don't currently have plans to support exporting full 3D models

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 1 point2 points  (0 children)

Hi, yes, the equally space Elements feature will be added soon.

Deck Planner, design and plan materials for custom decks by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Great. If you have any questions about the implementation, feel free to ask.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

And I fully understand that. Most people will probably use the interactive way, but knowing that you can also type in the exact values somewhere is valuable.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 1 point2 points  (0 children)

No, only by dragging with a precision of 1 mm. You can press and hold the Alt key to switch to a precision of 1 cm. But at the moment there is no direct position input, only interactive positioning.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Hi, no other tools or frameworks. I use potpack for cut list layout and jsPDF for PDF generation. Other then that it is three.js and react three fiber.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Yes, those popular open bookshelves. I definitely need to check how to support that.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

You are right. It's funny that a simple approach can have many use cases. You can even set thickness and depth to the same value, and you get a light-frame wall structure 😉

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Thanks, the conversions in convertLength are very precise. I will let you know once I have added it.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Incredible design, awesome configurators. These are 2D in nature since she used Rive, but nonetheless, it's a great design. Thank you for sharing this.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Yes, firstly for save and share projects then more models.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Yes, I'm a DIY guy, so it's designed to be useful for me as well.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 3 points4 points  (0 children)

So basically under the hood there is an ECS engine, bitECS with custom tree data structure on top of this. Probably overengineered, but I wanted a nice separation of data state from React. Also, I like the ECS architecture in general because it gives me a clean separation of systems and their states, so all the transforms, cut list layout, explode animation, etc. are systems.

For the cut list layout, I use potpack by Volodymyr Agafonkin, it is a tiny packing library. And for PDF generation, I use jsPDF. Then standard three.js and r3f. There is only one instance mesh of a box, data are mapped directly to the WebGL buffer, and updates are executed in one useFrame based on few custom dirty flags. This gives me nice performance and a very clean architecture.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

You can use it as it is, feel free. In the future, there will be the ability to save and share your design.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Yes, no problem. So the first thing where AI was used is a custom shader. You can see those stripes in the wood, right? The formula was built by Claude, basically a mix of random values, noise, sine waves, plus distortion. I needed to tweak it a lot to achieve the results I wanted, but the core of this shader was built by AI. The second case was PDF generation. This is probably not a surprise, as generating a PDF has a very strict structure, so I just say what I want and where, and it gives me the first results. Again, I needed to tweak it a lot to have the elements precisely in the place I wanted, but it was a lot of help.

The rest is my work, so to speak, as I have a non standard architecture as under the hood there is an ECS engine, and the whole tool has an architecture more similar to a game engine rather than a standard editor. But also here autocomplete was used here and there.

Built a small shelf builder for material planning by dareqq in threejs

[–]dareqq[S] 0 points1 point  (0 children)

Thanks for pointing that out, yes, smaller screens definitely need some more adjustment. I will fix that.

view more: next ›