Top #dithering dweets

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: #ScaryMovies

show FPS hide FPS share 2 remixes fullscreen

f8f82804

function u(t) {

s=S(t);for(U=V=0,z=i=128;i--;)for(j=z;j--;x.fillRect(8*i+450,8*j,8,8))U+=z+i+s,V+=z+j+s,x.fillStyle=R(z*(U>z&&(U-=256)),0,z*(V>z&&(V-=256)))

Aug 30 2018 2:00 AM UTC

}// 140/140

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

2D palette rendered with 4 colors via error diffusion dithering

u/f8f82804

#dithering

show FPS hide FPS share 1 remix fullscreen

f8f82804

remix of d/9489 by u/f8f82804

function u(t) {

eval(unescape(escape`攽孝㭦潲⡡㴶〻愭ⴻ⥦潲⡢㵳㴳㐬䔽敛戭ㅝ簰㭢ⴭ㭸⹦楬汒散琨猪愬截猬猬猩⥰㴹㤫愪截匨琩⼲⭅ⱸ⹦楬汓瑹汥㵒⡱㵳⨨瀯獼〩ⱱ⼷ⱱ⼲⤬䔽敛戭ㅝ簰Ᵽ㵰⵱ⱥ孢ⴱ崽振㴱㘬敛扝⬽挪㔬敛戫ㅝ⬽挪㌬䔫㵣⨷`.replace(/u(..)/g,"$1%")))

Aug 28 2018 3:59 AM UTC

}// 138/140

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

Floyd-Steinberg #dithering #compressed

u/f8f82804

e=[];for(a=60;a--;)for(b=s=34,E=e[b-1]|0;b--;x.fillRect(s*a,b*s,s,s))p=99+a*b*S(t)/2+E,x.fillStyle=R(q=s*(p/s|0),q/7,q/2),E=e[b-1]|0,c=p-q,e[b-1]=c/=16,e[b]+=c*5,e[b+1]+=c*3,E+=c*7

show FPS hide FPS share fullscreen

f8f82804

remix of d/9570 by u/f8f82804

function u(t) {

z=32;for(i=z*z;i--;x.fillRect(i%z*z+448,j*z,z,z))U=i%z*S(t)**2,V=(j=i/z%z|0)*S(t)**2,x.fillStyle=R((i+t|0)%7*U+U>z?255:0,0,i%7*V+V>z?255:0)

Aug 30 2018 11:41 PM UTC

}// 139/140

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

ordered #dithering #animated

u/joeytwiddle

Very clever mini dithers! How about dithering a sphere?
u/f8f82804

A sphere is a good idea! I'm still trying to work on spatial coherence though; see my earlier Floyd-Steinberg demo to get an idea of what's possible with 2d error diffusion. This dweet is a start at using a mask instead of diffusing errors.

show FPS hide FPS share 1 remix fullscreen

f8f82804

remix of d/9568 by u/f8f82804

function u(t) {

z=32;for(U=V=z*S(t/4),i=z*z;i--;x.fillRect(i%z*z+448,j*z,z,z))V+=j=i/z%z|0,U+=i%z+j/z,x.fillStyle=R(U>z?(U-=z,255):0,0,V>z?(V-=z,255):0)

Aug 30 2018 11:23 PM UTC

}// 136/140

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

#dithering #animated

u/katkip

Looks cool!

show FPS hide FPS share 2 remixes fullscreen

f8f82804

remix of d/9542 by u/f8f82804

function u(t) {

z=256;for(i=z*z;i--;x.fillRect(i%z*4+448,j*4,4,4))b=t&1||(U=V=0),U+=i%z,V+=j=i/z%z|0,x.fillStyle=R(b?U>z?(U-=z,z):0:U,0,b?V>z?(V-=z,z):0:V)

Aug 30 2018 11:01 PM UTC

}// 139/140

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

2D palette and approximation with 4 color #dithering; 1D error diffusion gives different patterns for vertical gradients (red channel) and horizonal (blue channel) #slow #waitforit

You've reached the end.

dwitter.net | #dithering