Fourier-Art

Discrete Fourier Transform to draw any shape

Output

Video

Code

• Node.js
  
  • Download and install
    
  • Write node in cmd to initiazie and chek if you vae properly installed Node.js
• p5 Manager
  
  • Although this tool is not mandatory , it helps to create projects and libraries are included in the project when it is created
    
  • After installing Node.js write npm install p5-manager -g in cmd to install p5 manager
    
  • Go the desired directory using cd and write p5 generate -b Fourier_Art
    
  • It will crate a p5 javascript project named "Fourier_Art" with all the necessary files
• Visual Studio Code
  • Download and install
• Live Server
  • Install this extension in VSCOde to create a server

Note : You can use other editors like Atom or Sublime . VSCode is just my preffered choice

How to use

• Draw your artwork in Illustrator and export as svg format . Here's what I drew on illustrator :
  (You can find the illustrator file in the Art Ultima folder named Art Ultima.ai )

• Now convert it to x,y co-ordinates using Coordinator
• Copy with proper format in the Art.js . And you are good to go .
  

Enjoy the Fourier Transform

Resources

• What is a Fourier Series [3Blue1Brown]
• What is a Fourier Transform [3Blue1Brown]
• An Interactive Introduction to Fourier Series [Jez Swanson]
• Fourier Analysis for the rest of us [Glod Plated Goof)
• FFT [Algorithm Archive]
• The Coding Train