Back

Back

How I Accidentally Made Art with Trigonometry and 10 Lines of Code

Design Cheat Code
Design Cheat Code
Design Cheat Code

I never thought I’d say this — but trigonometry is fun now.

Back in school, I often wondered:
“Where on earth will I use sincos, and  in real life?”

Fast forward to one late night with Three.js and a spark of curiosity... and boom — math finally made sense.

I wrote this tiny snippet of generative art code:

x=u=v=f=0,n=200,draw=o=>{
  for(f||createCanvas(W=400,W),r=2*PI/n,background(0),i=0;i<n;i++)
    for(j=0;j<55;j+=.1)
      u=sin(i+v+f)-sin(R=r*i+x-99*f),
      v=cos(i+v+f)-cos(R),
      x=u+f,
      X=n+99*u,
      Y=n+99*v,
      stroke(W,2*j+66),
      line(X,Y,X+1,Y+1);
  f+=5e-5;
};

A Loop of Surprise

No frameworks, no color palettes, no vector shapes — just pure functions spinning beauty out of math. I watched the canvas pulse and swirl, all built from the same functions that once haunted my math exams.


The result? A glowing, hypnotic animation that felt alive.

And the best part? It came from one continuous loop of sin() and cos().

What I Learned

  • Math isn't boring — it just needs the right context.

  • Simple formulas + creative constraints = unlimited visuals.

  • Coding for fun occasionally leads to unexpected insights (and beautiful results).

Why This Matters (for Designers and Developers)

If you're a creative, don't shy away from math-heavy ideas.
If you're a dev, don’t underestimate your inner artist.
Sometimes, one line of code is all it takes to bridge the two worlds.

TL;DR

Trigonometry didn’t fail me — I just hadn’t drawn with it yet.

Tools Used

  • Three.js — for drawing and rendering

  • 1 Tea ☕ — for late-night courage

  • Childhood math trauma — for emotional depth 😅

Handcrafted by Biswarup
Handcrafted by Biswarup
Handcrafted by Biswarup