Dweets by u/taupelink

function u(t) {

c.width=1920 // clear the canvas
for(i=0;i<9;i++)
x.fillRect(400+i*100+S(t)*300,400,50,200) // draw 50x200 rects

} // 122/140

Please log in (or register) to post a dweet (copy-paste the code somewhere safe to save it meanwhile)


    u(t) is called 60 times per second.
    t: Elapsed time in seconds.
    S: Shorthand for Math.sin.
    C: Shorthand for Math.cos.
    T: Shorthand for Math.tan.
    R: Function that generates rgba-strings, usage ex.: R(255, 255, 255, 0.5)
    c: A 1920x1080 canvas.
    x: A 2D context for that canvas.

Try the new frontend: beta.dwitter.net
Current theme challenge: #Food

show FPS hide FPS share fullscreen

taupelink

remix of d/23760 by u/taupelink

function u(t) {

for(i=q=k=810;--i;x.fillRect(k*X,k-q*Y,-i/v,q*Y/v))f=i*t,X=f*f%5,Y=X*f%4-2,x.fillStyle=R(s=q+i*Y*.4,q^=-s,q^=255,(k+q)*(Y+3)**2/4e4),v=4**t

Sep 6 2021 6:21 AM UTC

}// 139/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23766

u/rep_movsd

You need to write a blog about this particular technique
u/taupelink

i'd like to, but it would take time (i'm a super slow writer) and it's honestly not a priority at the moment. I can at least say this: Part of how I get four vertical bands is having Y range from less than -1 to greater than 1 (in this case, -2 to 2). Multiplying or dividing by Y then has four effects: stretch or compress, do or do not reverse sign
u/rep_movsd

A one page breakdown would be nice, or perhaps I'll write one
u/taupelink

ah ok...like a line-by-line explanation? that's doable...i'll write something up next weekend!

show FPS hide FPS share 2 remixes fullscreen

taupelink

remix of d/23688 by u/taupelink

function u(t) {

for(i=q=k=720;--i;x.fillRect(k*X,720+q*Y,q/Y/v,-i/v))f=i*t,X=f*f%3,Y=X*f%4-2,x.fillStyle=R(q*=q%2+Y,q*=X/2/t**.5,q-=i*S(q/X+Y),k/q/q),v=2**t

Sep 5 2021 7:00 PM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23760

u/magna

Wow!

show FPS hide FPS share fullscreen

taupelink

remix of d/23648 by u/taupelink

function u(t) {

for(i=q=k=383;--i;x.fillRect(k*X-k,810+i/Y,i*(T(q/k)>z),-5e4/q))z=t**.5,f=i*t,X=f*f%8,Y=X*f%1,x.fillStyle=R(q^k,q^=i,q*=C(q*X**Y)+1,i/q/z)

Sep 4 2021 3:53 PM UTC

}// 138/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23742

u/rep_movsd

Legoland?
u/taupelink

I was thinking "citrus skyline!"

show FPS hide FPS share 2 remixes fullscreen

taupelink

remix of d/23714 by u/taupelink

function u(t) {

for(i=k=640;--i;x.fillRect(k+k*X,k-i*Y,Y*i*v,6*q*X*v))f=i*t,X=f*f%3-1,Y=X*f%4-2,x.fillStyle=R(q=i*Y*C(X*Y),q*=-S(q/X)/Y,i/2,k/q/q),v=.8**t/t

Sep 4 2021 1:50 AM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23737

show FPS hide FPS share fullscreen

taupelink

remix of d/23724 by u/taupelink

function u(t) {

for(i=k=q=315;--i;x.fillRect(X,540-i/Y,q*Y/v,i/v))f=i*t,X=f*f%3e3,Y=X*f%4-2,x.fillStyle=R(q*=Y*Y-Y,q+=C(X/k+Y)*i,q*=C(X/k),X*Y*Y/q/q),v=4**t

Sep 3 2021 2:30 AM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23731

u/rodrigo.siqueira

This one is very beautiful! #art
u/rep_movsd

Two cities

show FPS hide FPS share 2 remixes fullscreen

taupelink

remix of d/23714 by u/taupelink

function u(t) {

for(i=k=630;--i;x.fillRect(X-k,k-i/Y,-Y*i/v,-q*Y/v))f=i*t,X=f*f%3e3,Y=X*f%9-4,x.fillStyle=R(q=i*Y,q*=S(k/X)*(.7-Y/6),i%q,1e7/X/q/q),v=4**t

Sep 2 2021 2:32 AM UTC

}// 138/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23724

u/Xen

love it!
u/rep_movsd

Gets better and better
u/tomxor

wow
u/aleamb

beautiful! #impressionism

show FPS hide FPS share 2 remixes fullscreen

taupelink

remix of d/23666 by u/taupelink

function u(t) {

for(i=k=360;--i;x.fillRect(k*X+q-k,720-i/Y*t-i,i/t,q*Y/t))f=i*t,X=f*f%7,Y=X*f%4-2,x.fillStyle=R(q=-i*Y,q*=q%X>t?-X/4:S(X),i,k*Y*Y/q/q*t**.5)

Sep 1 2021 3:45 AM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23714

show FPS hide FPS share fullscreen

taupelink

remix of d/23688 by u/taupelink

function u(t) {

for(i=k=255;i--;x.fillRect(k*X,1080-i*Y,-3*i/Y*(X%t<1/t),-q*Y/t**.5))f=i*t,X=f*f%8,Y=X*f%4-1,x.fillStyle=R(q=i*Y,q*=Y,q^=k,2*Y*Y*k/q/q)

Aug 31 2021 1:26 AM UTC

}// 135/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23693

show FPS hide FPS share fullscreen

taupelink

remix of d/23648 by u/taupelink

function u(t) {

for(i=q=k=447;i--;x.fillRect(k*X,k+i/Y,-8*q/v,i*(Y-2)/v))f=i*t,X=f*f%7-1,Y=X*f%3-2,x.fillStyle=R(q*=C(X/6)/8-Y/4,i*S(X/2),q^=k,k/q*t),v=t**t

Aug 30 2021 4:04 AM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23689

u/rep_movsd

This is superb
u/rfs

What is your process for making these? incredible
u/taupelink

thank you! lots and lots of trial and error, lately aided by https://capjs.3d2k.com/ I keep playing around with variations, e.g.: for the Y-coordinate, k+i*Y,k-i*Y,k+i/Y,k-i/Y each have a different effect
u/taupelink

for those unfamiliar with dwitter-style compact JS code: for a typical dweet of this type, each frame draws a bunch of rectangles. each rectangle has random coordinates for its upper left-hand corner. the RGBA (color and opacity) of the rectangle depends on those coordinates and on some other parameter that gets modified with each step. The dimensions of the rectangles shrink over time, thus adding finer-grained detail

show FPS hide FPS share 3 remixes fullscreen

taupelink

remix of d/23666 by u/taupelink

function u(t) {

for(i=k=255;--i;x.fillRect(k*--X,630-i*Y,i*(q*q%t<t**-t),-q*Y*t))f=i*t,X=f*f%9,Y=S(X*f)*X,x.fillStyle=R(q=i*Y,q/=T(X/6)<Y?.9:-1.5,q^k,k/q/q)

Aug 29 2021 8:20 PM UTC

}// 140/140

Please log in (or register) to post as a new dweet (copy-paste code somewhere safe to save it meanwhile).

d/23688

u/aleamb

#impressionism

dwitter.net | taupelink (7550)