The Power of Hexagons: Two-dimensional drawing on a three-dimensional surface (iOS, Swift, Xcode, CGPath, CAShapeLayer)


In this post I'm going to illustrate the drawing of a two-dimensional shape on the surface of a cube face. I am hopeful that by performing the drawing without using a straight 3D transformation certain things might come to light that inform and inspire.

Drawing a 2D shape on a surface of a cube

First it is necessary to draw the shape on a 2D grid



and then to draw the same grid relative to a three-dimensional surface. 



Whether in flat orientation or 3D the points of the grid relative to the vertices will remain the same. Once the plotting is done the points of the two-dimensional shape (in this case a slightly irregular hexagon) will be known and the code can be written and run. (A Swift playground version of the code can be found here thanks to minor adaptations by @ChromophoreApp.)


It is also possible by simply rotating the points of the cube to shift the rotation of the shape, because the shape is constructed from points relative to the vertices and so wherever the cube goes the shape goes too.



From hexagon to hexagonal prism

By repeating the drawing of our (slightly irregular) hexagonal shape on the base of the cube, and removing the sides of the cube it is possible to create two hexagons in three-dimensional space. One above and one below.



It is possible then to simply connect the points of the upper and lower hexagons in order to create a hexagonal prism.

The code for this prism can be found here.

Conclusion

This post has examined the ability to draw in two dimensions on a three-dimensional surface and to create prisms by linking identical shapes across surfaces.The next post will look at incorporating quadratic curves into the sculpting of shapes from cubes.

As a point of interest related to drawing two-dimensional shapes on three-dimensional surfaces, I would recommend that you take a look at the Foldify app if you are not already familiar with it.


Endorse on Coderwall

Comments