NHacker Next
login
▲A simple 16x16 dot animation from simple math rulestixy.land
372 points by andrewrn 2 days ago | 76 comments
Loading comments...
dang 29 minutes ago [-]
Related:

Tixy.land - https://news.ycombinator.com/item?id=36646163 - July 2023 (2 comments)

Minimal 16x16 Dots Coding Environment - https://news.ycombinator.com/item?id=24974534 - Nov 2020 (37 comments)

stankot 1 days ago [-]
Tixy is amazing! I built something very similar:

https://muffinman.io/pulsar/

I wanted to create animations for my LED matrix screen, and I couldn’t find tixy anywhere. Only after I built pulsar I found it again.

Another similar project is https://sliderland.blinry.org/ which uses HTML sliders.

Fun stuff!

jakegmaths 1 days ago [-]
I loved tixy when I first discovered it a few years ago so created this https://www.mathsuniverse.com/tixy (with permission from the original author) with puzzles to solve on the tixy grid. I use it with my computer science students who get really into it.
oneeyedpigeon 1 days ago [-]
Reminds me of [Replicube](https://store.steampowered.com/app/3401490/Replicube/), which has released recently and does the same kind of thing in 3D.
tonetheman 1 days ago [-]
[dead]
dndn1 1 days ago [-]
This is a cool way to teach!

I was blown away by the little functions at first and I too made a clone to experiment with calculang [1].

I added an evaluation feature (F9) so you can select sub-expressions and see what they do, which was helpful to figure out some patterns (video in [2])

[1] https://calculang-editables.netlify.app/tixyish

[2] https://www.youtube.com/watch?v=uXUd_-xrycs

acomjean 1 days ago [-]
Fun. Thanks!

Works well on phone. The phone keyboard is a bit clumsy but it works (that’s a phone issue)

soegaard 1 days ago [-]
Well done!
chrisjj 1 days ago [-]
> In computer graphics, the origin (0, 0) is top-left rather than bottom-left

Umm...

LocalH 1 days ago [-]
What's wrong with that statement? It has historically and traditionally been true for raster displays, even if there do exist ways to use standard Cartesian-style coordinates with a computer.
jakegmaths 1 days ago [-]
I'm struggling to see the problem with this statement, other than maybe to add in the word "usually". My students will know of graphs in maths where the origin is always bottom left. When working with HTML canvas and every other computer graphics situation I've worked in, it's top left instead.
ForOldHack 1 days ago [-]
"PostScript uses a coordinate system where the origin is at the bottom-left corner of the page, with the x-axis increasing to the right and the y-axis increasing upwards."

Oscilloscopes use middle-left.

Unreal engine and SketchUp use Screen middle with xy increasing to the right.

in AutoCAD, the user coordinate system is 1/3 of the screen to the left for the origin, with X increasing to the right, and Y increasing upwards.

Almost all raster displays, and memory based programs assume top left, because that is how it was done first - counter intuitive.

Lerc 20 hours ago [-]
It it not counter intuitive and the decision extends far earlier than the first displays.

A raster image onscreen is displayed in the order that the data appears when written down. It stands to reason that a data depiction should be in the same orientation as the display orientation. Displays were created by people who read from left to right, top to bottom. If the displays did not follow that order. images would be flipped or rotated when displayed in a data form.

The first pixel written to the display is in the top left because we read from the top left. If writers of another language had have popularised the text, perhaps things might have been different.

Timwi 9 hours ago [-]
Why does the BMP file format store the image upside-down though?
animal531 1 days ago [-]
Weeee: https://tixy.land/?code=sin%28x%29*cos%28y%29%2Bcos%28x%29*s...

White blood cells attack: https://tixy.land/?code=sin%28x%2Bt%29%2Fcos%28y%2Bi%29%2Bco...

progre 24 hours ago [-]
Fire! https://tixy.land/?code=Math.sin%28%28y%2F3%5Ex%7Ci%29%2Bt%2...
levzettelin 1 days ago [-]
Basically https://www.shadertoy.com/ for dummies. Right up my alley haha ;)
rpastuszak 2 days ago [-]
I made a drawing app with programmable brushes inspired by tixy:

https://fig.sonnet.io

It’s pretty fun because the shape dynamics are time, and not pressure/tilt based, so you need to draw in a rhythm.

Here’s how they work and how they’re implemented:

https://untested.sonnet.io/notes/fig-tree-brushes/

Nautman 1 days ago [-]
I love it! Here's a windscreen wiper.

https://tixy.land/?code=sin%28t%29*%281%2Bx%2By%29-x

agys 1 days ago [-]
The author is Martin Kleppe (@aemkei on X), famous for his incredible quines and other JS magic.

https://aem1k.com/world/

https://aem1k.com/qlock/

asicsp 1 days ago [-]
Previous discussion with patterns in comments: https://news.ycombinator.com/item?id=24974534
alexilchenko 1 days ago [-]
5 fold star: https://tixy.land/?code=sin%285*atan2%28y-7.5%2Cx-7.5%29-t%2...
alexilchenko 1 days ago [-]
Two snakes: https://tixy.land/?code=exp%28-%28%28x-7%29**2%29%2F12%29*si...
Isognoviastoma 1 days ago [-]
https://tixy.land/?code=%28%28t%2F4%2Batan2%28x-8%2Cy-7%29%2...

a radar

continuational 1 days ago [-]
Fun!

https://tixy.land/?code=sin%28i%2Bt%29

_def 1 days ago [-]
i don't even know whats happening but its mesmerizing https://tixy.land/?code=sin%28i*t%2F128%29
Sharlin 1 days ago [-]
It draws a slightly tilted sine wave gradient (i=16y+x so atan(1/16) ≈ 3.6°) whose frequency increases until it starts to alias due ro the limited resolution (cf. Nyquist sampling theorem) and exhibit what’s essentially the wagon wheel effect [1]. Nice illustration of signal processing fundamentals!

[1] https://en.m.wikipedia.org/wiki/Wagon-wheel_effect

tetris11 1 days ago [-]
https://tixy.land/?code=x-y*y%2Ft%2F5

'Vanishing Curve'

fulafel 1 days ago [-]
Cool stuff.

Learned by scrolling far enough right in view source: The last line is editable and eval'd.

Request to author: keep the newlines.

Jyaif 1 days ago [-]
> The last line is editable and eval'd

Right. https://tixy.land/?code=alert(%22foo%22)

oliviergg 1 days ago [-]
That’s not nice
noman-land 23 hours ago [-]
What's not nice is not sanitizing inputs.
nopakos 1 days ago [-]
That's fantastic!

I would love something like this in my living room. Especially if it is not just a screen. Maybe a grid of 256 screens? Or inflating balloons? Something easier to make? Just on/off big pixels?

lsdkfjlkasfj 16 hours ago [-]
Also https://ptol.github.io/hexyzland/
shakedownstreet 1 days ago [-]
Love it, simple & cool :)

https://tixy.land/?code=(y%2Fi*y%2Fsin(x%2Bt))*max(cos(t)%2C...

Tepix 1 days ago [-]
I like this creation of mine:

https://tixy.land/?code=sin%28t*x%29%2Bi%2F256

jagraff 21 hours ago [-]
Moving, ever expanding circle: https://tixy.land/?code=%28x-10*t%2521%29**2%2B%28y-10*t%252...
dave1010uk 23 hours ago [-]
https://tixy.land/?code=%28%28x%2Bt%29%5E%28t%7Cy*t%29%29%25...

Strobe warning, especially after about 20 seconds.

skrebbel 23 hours ago [-]
Wow this is extremely well done! All the defaults are chosen so well to make simple inputs get pretty results. The interpretation of the result value, the scale of `t`, the colors, it's all not trivial at all to get right! Hats off
shirajg 21 hours ago [-]
https://tixy.land/?code=%281%2Ft%258%29+%2F+tan%28t+%2F+%28y...
fittingopposite 24 hours ago [-]
Pretty psychedelic https://tixy.land/?code=Math.cos%28y%2F8%2Bsqrt%282*t*i%2Bx%...
kazinator 1 days ago [-]
Stretchy curtain:

(sin(t) * sin(t) + 0.2) * (sin(y / (cos(t) * cos(t) + 0.7)) + sin(x))

antirez 1 days ago [-]
The classic: sin(x/2+t)+cos(y/2+sin(t))
gus_massa 1 days ago [-]
Link for the lazy: https://tixy.land/?code=sin%28x%2F2%2Bt%29%2Bcos%28y%2F2%2Bs...
alexilchenko 1 days ago [-]
That's no moon! https://tixy.land/?code=%28%28d%3D36-%28x-%3D7%29**2-%28y-%3...
ubitaco 1 days ago [-]
fun! Here's a heart: https://tixy.land/?code=hypot%28x-7%2Cy%2Babs%28x-7%29-9%29-...
mckeed 1 days ago [-]
Centered circle wave: https://tixy.land/?code=Math.sin%28-2*t%2B0.045*%28x-7.5%29*...
flockonus 22 hours ago [-]
Cool! I can see it being usable as a spinner as well. How did you come up with these magic numbers?
Jyaif 1 days ago [-]
https://tixy.land/?code=-.5%2B%28x%5Ey%29%25%283*Math.sin%28...
Lerc 15 hours ago [-]
I managed to come up with a suffix that displays outputs of my own weird thing in a tixy style.

https://c50.fingswotidun.com/show/?code=28*ddx*%24%3Ay*%243o...*

Quite a fun challenge.

The Suffix is 2<02->P8dus:vs

which is

  2<02->    clip to -2 to +2

  P8*d  2 copies of 8*PI

  u*s   8 horizontal sine 

  :v*s  8 vertical sine

  *  mix horz and vert to make the tixy circles.
flufluflufluffy 1 days ago [-]
This one is sick!
jlundberg 1 days ago [-]
oh yes, highly recommended! :)
MeteorMarc 1 days ago [-]
If you like this, also check 3d animations on a led cube. https://m.youtube.com/watch?v=odFljHeCNaY
siev 1 days ago [-]
Beating heart: https://tixy.land/?code=%28x%2F7.5-1%29**2%2B%28y%2F7.5-1%29...
rickcarlino 1 days ago [-]
Similar project, but based on Forth: https://forthsalon.appspot.com/
rel_ic 1 days ago [-]
https://tixy.land/?code=sin%28t*sin%28t%29%2F9-x%29*sin%28t-...
flufluflufluffy 1 days ago [-]
https://tixy.land/?code=sin%280.2*x*t%29+-+cos%280.2*y*t%29
rubitxxx 1 days ago [-]
Here’s a wild ride: https://tixy.land/?code=Math.sin%28y%2Bi%2Ft%29%2BMath.cos%2...
yusina 13 hours ago [-]
Isn't i == x + 16*y? Why is it needed?
stefanfisk 4 hours ago [-]
To make the code cleaner I’d assume.
yusina 21 minutes ago [-]
I got the impression though that i is the least useful of the bunch.
alexilchenko 1 days ago [-]
spiral: https://tixy.land/?code=hypot%28x-%3D7%2Cy-%3D7%29%2Batan2%2...
tjwds 1 days ago [-]
When this was first released, I put together an homage to the music video for “Fell In Love With A Girl” by The White Stripes.

https://tixy.land/?code=floor(t%256)%20%3D%3D%3D%200%20%3F%0...

1 days ago [-]
gus_massa 1 days ago [-]
red traffic light https://tixy.land/?code=%28floor%28t%29%252%29%3F0%3A-cos%28...
tgv 1 days ago [-]
I’m considering that as a load screen animation. Bunch of different functions, and the user will be entertained.
chrisjj 1 days ago [-]
> // hit "enter" to save in URL

There's no enter on Android Chrome on phone.

dtagames 1 days ago [-]
The enter key on the phone keyboard works if you tap that message.
GenshoTikamura 1 days ago [-]
Would be cool to implement this physically as an array of iris diaphragms
siraben 1 days ago [-]
candy waves on a shore: https://tixy.land/?code=sin%28i*t%2F128%29

candy lasers redux: https://tixy.land/?code=0.2%2Bsin%28i*t%2F64%29%2B.3*sin%288...

Sharlin 1 days ago [-]
Shame that 32 characters is a bit too few to make a raycaster. 128 would be quite enough I think.
relaxing 1 days ago [-]
A lot of these tricks I first learned from Noah Spurrier’s acidwarp.exe VGA demos in the 90s.

Now I’m wondering who first published these trig function pixel paint tricks. Somewhere between HAKMEM munching squares and the 80s demoscene?

spencerflem 1 days ago [-]
this is beautiful. i love it so much :)
lttlrck 23 hours ago [-]
I feel so dumb. How can I make this zoom centered on the grid?

https://tixy.land/?code=Math.sin%28x*t%29%2BMath.cos%28y*t%2...

skrebbel 23 hours ago [-]
I think something like https://tixy.land/?code=sin%28%28x-7.5%29*t%29%2Bcos%28%28y-...
xanlack 1 days ago [-]
really impressive, keep up the good work
ninetyninenine 1 days ago [-]
Is there a pattern or animation you can manually animate on those dots that can’t be represented by an equation?
1 days ago [-]
bingrrr 2 days ago [-]
great
curtisszmania 1 days ago [-]
[dead]