Truchet Tiling with Octagons in p5.js

Subscribers:
7,360
Published on ● Video Link: https://www.youtube.com/watch?v=tv2DgZ9dRzY



Duration: 11:48
844 views
39


Truchet tiles are tiles that can be rotated and create patterns as a result. In my last two videos we went over tiling with squares and hexagons. This time we go over tiling with octagons in p5.js. creative coding, gen art, generative art.

Join my Discord: https://discord.gg/FSW6zzU

Follow me on Twitter: https://twitter.com/SteveMakerspace

Code used in this video:
https://editor.p5js.org/StevesMakerspace/sketches/gP-H8kRKp

Collection of Truchet tile code:
https://editor.p5js.org/StevesMakerspace/collections/Yqck5LnRD

My video on square Truchet tiles:
https://youtu.be/99Hr8lpWWSg

My video on tiling with hexagons:
https://youtu.be/Qwb2VYrN-us

Peter Kagey's article on hexagonal and octagonal Truchet tiling:
https://blog.peterkagey.com/2021/02/regular-truchet-tilings/

Kusamehewa's article on their fxhash tiling:
https://www.fxhash.xyz/article/paper-cut

Right triangle math:
https://www.omnicalculator.com/math/right-triangle-side-angle

Music:
Funk Down (Sting) by MK2 (theme)

0:00 Intro and start
2:50 Octagon math
4:32 Back to the code
10:11 Two art projects




Other Videos By Steve's Makerspace


2023-04-29Animating the Drawing Process of Your Static Art in p5.js
2023-04-13Getting Started with fxhash params and fxlens using Visual Studio Code - full tutorial for artists
2023-04-08Adding Circular Flow to a Flow Field with Generative Artist Jeff Palmer - p5.js
2023-03-19Making a Static Flow Field in p5.js
2023-03-05Using a Buffer Canvas as a Data Source for p5.js Generative Art
2023-01-23How to Sell on fxhash - How to Get Started, Guide
2023-01-23How to Resize Your Art in p5.js, especially for selling on fxhash
2023-01-03Composition Elements for Generative Art - p5.js creative coding, art composition
2023-01-02Made in 10 Minutes Genuary Prompt p5.js - Perlin noise field with the letters of g-e-n-u-a-r-y
2022-12-04How I Made "Hex-a-Sketch" Art Project - Hexagonal Truchet Tiling Made Sketchy with p5.js
2022-11-27Truchet Tiling with Octagons in p5.js
2022-11-26Truchet Tiling with Hexagons in p5.js
2022-11-20Making Truchet Tiles in p5.js
2022-11-07Use Any Color in Shape Intersections - Overlapping Shapes in p5.js
2022-10-23Using Erase Function in p5.js to Make Interesting Shapes
2022-10-16Shadowy Edges & Making Shapes using Vertex in p5.js
2022-10-14My First fxhash Drop! Auction Watch Party & Code Review
2022-10-11My First Art Project on fxhash! #shorts
2022-10-09How to Buy Clean NFT Art on fxhash and objkt using Tezos, Coinbase, and Temple wallet
2022-09-12Watercolor Effect and Paper Texture in p5.js
2022-08-29Final Variations for Flow Packing Code - p5.js creative coding gen art



Tags:
p5js
coding in p5js
pattern maker
art maker
art generator
computer art
digital art
generative art
algorithm art
dynamic painting
creative coding
coding pattern maker
p5.js programming
p5.js art maker
learn to code
p5js patterns
code patterns
program patterns
truchet
truchet tiling
truchet tiles
octagonal truchet
octagon tiles
octagon tiling
octagon truchet