[HN Gopher] A simple 16x16 dot animation from simple math rules
___________________________________________________________________
A simple 16x16 dot animation from simple math rules
Author : andrewrn
Score : 488 points
Date : 2025-05-10 02:56 UTC (2 days ago)
(HTM) web link (tixy.land)
(TXT) w3m dump (tixy.land)
| bingrrr wrote:
| great
| rpastuszak wrote:
| 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/
| spencerflem wrote:
| this is beautiful. i love it so much :)
| jakegmaths wrote:
| 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.
| soegaard wrote:
| Well done!
| dndn1 wrote:
| 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
| oneeyedpigeon wrote:
| Reminds me of [Replicube](https://store.steampowered.com/app/34
| 01490/Replicube/), which has released recently and does the
| same kind of thing in 3D.
| chrisjj wrote:
| > In computer graphics, the origin (0, 0) is top-left rather
| than bottom-left
|
| Umm...
| LocalH wrote:
| 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.
| taneq wrote:
| There top left has usually been (0, 0) for hardware pixel
| coordinates (although even then there's plenty of
| exceptions, e.g. mode 13h scrolling) but as a blanket
| statement about computer graphics in general it's
| misleading.
| jakegmaths wrote:
| 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 wrote:
| "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 wrote:
| 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 wrote:
| Why does the BMP file format store the image upside-down
| though?
| rasz wrote:
| IBM brain rot adopted by Microsoft.
|
| Why are device-independent bitmaps upside down? Raymond
| Chen https://devblogs.microsoft.com/oldnewthing/20210525-
| 00/?p=10...
|
| I think you had to wait for WinG or maybe even DirectX to
| get normal 1:1 mapping.
|
| OpenGL is so old it had same stupid ideas about
| coordinates.
| acomjean wrote:
| Fun. Thanks!
|
| Works well on phone. The phone keyboard is a bit clumsy but it
| works (that's a phone issue)
| frogarden wrote:
| Why isn't "(sin(i) * (x > 7)) - (i == 5) + (i == 20) + 0.5 * (i
| == 32)" a solution to puzzle 36?
| PebblesRox wrote:
| My 5yo did great on these until he hit #7 and got stuck! I'm
| helping him with syntax but trying to hold back from giving
| conceptual hints for now.
|
| I love the instant visual feedback!
| tetris11 wrote:
| https://tixy.land/?code=x-y*y%2Ft%2F5
|
| 'Vanishing Curve'
| antirez wrote:
| The classic: sin(x/2+t)+cos(y/2+sin(t))
| gus_massa wrote:
| Link for the lazy:
| https://tixy.land/?code=sin%28x%2F2%2Bt%29%2Bcos%28y%2F2%2Bs...
| fulafel wrote:
| 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 wrote:
| > The last line is editable and eval'd
|
| Right. https://tixy.land/?code=alert(%22foo%22)
| oliviergg wrote:
| That's not nice
| noman-land wrote:
| What's not nice is not sanitizing inputs.
| shakedownstreet wrote:
| Love it, simple & cool :)
|
| https://tixy.land/?code=(y%2Fi*y%2Fsin(x%2Bt))*max(cos(t)%2C...
| continuational wrote:
| Fun!
|
| https://tixy.land/?code=sin%28i%2Bt%29
| _def wrote:
| i don't even know whats happening but its mesmerizing
| https://tixy.land/?code=sin%28i*t%2F128%29
| Sharlin wrote:
| It draws a slightly tilted sine wave gradient (i=16y+x so
| atan(1/16) [?] 3.6deg) 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
| GenshoTikamura wrote:
| Would be cool to implement this physically as an array of iris
| diaphragms
| tgv wrote:
| I'm considering that as a load screen animation. Bunch of
| different functions, and the user will be entertained.
| Isognoviastoma wrote:
| https://tixy.land/?code=%28%28t%2F4%2Batan2%28x-8%2Cy-7%29%2...
|
| a radar
| nomel wrote:
| now to add a few blips!
| Jyaif wrote:
| https://tixy.land/?code=-.5%2B%28x%5Ey%29%25%283*Math.sin%28...
| flufluflufluffy wrote:
| This one is sick!
| jlundberg wrote:
| oh yes, highly recommended! :)
| Lerc wrote:
| 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->P8 _du_ s:v _s_
|
| 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.
| Nautman wrote:
| I love it! Here's a windscreen wiper.
|
| https://tixy.land/?code=sin%28t%29*%281%2Bx%2By%29-x
| alexilchenko wrote:
| spiral:
| https://tixy.land/?code=hypot%28x-%3D7%2Cy-%3D7%29%2Batan2%2...
| xanlack wrote:
| really impressive, keep up the good work
| tjwds wrote:
| 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...
| alexilchenko wrote:
| 5 fold star:
| https://tixy.land/?code=sin%285*atan2%28y-7.5%2Cx-7.5%29-t%2...
| alexilchenko wrote:
| Two snakes:
| https://tixy.land/?code=exp%28-%28%28x-7%29**2%29%2F12%29*si...
| alexilchenko wrote:
| That's no moon!
| https://tixy.land/?code=%28%28d%3D36-%28x-%3D7%29**2-%28y-%3...
| nopakos wrote:
| 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?
| chrisjj wrote:
| > // hit "enter" to save in URL
|
| There's no enter on Android Chrome on phone.
| dtagames wrote:
| The enter key on the phone keyboard works if you tap that
| message.
| mckeed wrote:
| Centered circle wave:
| https://tixy.land/?code=Math.sin%28-2*t%2B0.045*%28x-7.5%29*...
| flockonus wrote:
| Cool! I can see it being usable as a spinner as well. How did
| you come up with these magic numbers?
| Tepix wrote:
| I like this creation of mine:
|
| https://tixy.land/?code=sin%28t*x%29%2Bi%2F256
| animal531 wrote:
| 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...
| rubitxxx wrote:
| Here's a wild ride:
| https://tixy.land/?code=Math.sin%28y%2Bi%2Ft%29%2BMath.cos%2...
| siev wrote:
| Beating heart:
| https://tixy.land/?code=%28x%2F7.5-1%29**2%2B%28y%2F7.5-1%29...
| siraben wrote:
| 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...
| levzettelin wrote:
| Basically https://www.shadertoy.com/ for dummies. Right up my
| alley haha ;)
| ninetyninenine wrote:
| Is there a pattern or animation you can manually animate on those
| dots that can't be represented by an equation?
| echoangle wrote:
| If the animation is finite in time and with finite time steps
| and sample points, I think no. Because you can fit a polygon
| through any set of points if the polygon has enough dimensions.
| asicsp wrote:
| Previous discussion with patterns in comments:
| https://news.ycombinator.com/item?id=24974534
| gus_massa wrote:
| red traffic light
| https://tixy.land/?code=%28floor%28t%29%252%29%3F0%3A-cos%28...
| rel_ic wrote:
| https://tixy.land/?code=sin%28t*sin%28t%29%2F9-x%29*sin%28t-...
| stankot wrote:
| 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!
| leptons wrote:
| If you haven't seen dwitter yet, you really should head over to
| https://www.dwitter.net
| virtualritz wrote:
| This is awesome. But it needs a better renderer.
|
| Almost every animation/image there suffers from horrible
| moire because a normal browser canvas was not meant for this.
| Fine line art needs supersampling and high quality filtering.
| montag wrote:
| Anybody else reminded of the old Sony logo?
|
| https://tixy.land/?code=y%3C7%26%26%28x%2Bsin%28y%29%3C6.4%2...
|
| edit: much better with a negation :)
| ubitaco wrote:
| fun! Here's a heart:
| https://tixy.land/?code=hypot%28x-7%2Cy%2Babs%28x-7%29-9%29-...
| relaxing wrote:
| 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?
| MeteorMarc wrote:
| If you like this, also check 3d animations on a led cube.
| https://m.youtube.com/watch?v=odFljHeCNaY
| Sharlin wrote:
| Shame that 32 characters is a bit too few to make a raycaster.
| 128 would be quite enough I think.
| flufluflufluffy wrote:
| https://tixy.land/?code=sin%280.2*x*t%29+-+cos%280.2*y*t%29
| agys wrote:
| 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/
| rickcarlino wrote:
| Similar project, but based on Forth:
| https://forthsalon.appspot.com/
| kazinator wrote:
| Stretchy curtain:
|
| (sin(t) * sin(t) + 0.2) * (sin(y / (cos(t) * cos(t) + 0.7)) +
| sin(x))
| gus_massa wrote:
| Clicky
| https://tixy.land/?code=%28sin%28t%29+*+sin%28t%29+%2B+0.2%2...
| progre wrote:
| Fire!
| https://tixy.land/?code=Math.sin%28%28y%2F3%5Ex%7Ci%29%2Bt%2...
| fittingopposite wrote:
| Pretty psychedelic
| https://tixy.land/?code=Math.cos%28y%2F8%2Bsqrt%282*t*i%2Bx%...
| lttlrck wrote:
| 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 wrote:
| I think something like
| https://tixy.land/?code=sin%28%28x-7.5%29*t%29%2Bcos%28%28y-...
| bobbylarrybobby wrote:
| When in doubt: translate your center to the origin, do your
| work there, then un-translate.
| skrebbel wrote:
| 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
| dave1010uk wrote:
| https://tixy.land/?code=%28%28x%2Bt%29%5E%28t%7Cy*t%29%29%25...
|
| Strobe warning, especially after about 20 seconds.
| jagraff wrote:
| Moving, ever expanding circle:
| https://tixy.land/?code=%28x-10*t%2521%29**2%2B%28y-10*t%252...
| shirajg wrote:
| https://tixy.land/?code=%281%2Ft%258%29+%2F+tan%28t+%2F+%28y...
| lsdkfjlkasfj wrote:
| Also https://ptol.github.io/hexyzland/
| yusina wrote:
| Isn't i == x + 16*y? Why is it needed?
| stefanfisk wrote:
| To make the code cleaner I'd assume.
| yusina wrote:
| I got the impression though that i is the least useful of the
| bunch.
| dang wrote:
| 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)
| franze wrote:
| Marry Christmas
|
| https://tixy.land/?code=Math.sin%28y%2F8%2By%3C9%26%26Math.a...
| xuhu wrote:
| Is it possible to create a tixy QR code that contains a link to
| itself ?
| Reefersleep wrote:
| I've made a few of these as doodles while waiting for other
| stuff. Great set of restrictions to inspire creativity.
|
| X Plus Star
| https://tixy.land/?code=%28sin%28t*0.8*-sqrt%28%28x-7.5%29**...
|
| Sin Sin
| https://tixy.land/?code=sin%28sin%28i*sin%28t%2F10%29%29%29
|
| Traffic https://tixy.land/?code=sin%28i*i*t*0.0005%29
| KingOfCoders wrote:
| ChatGPT had some nice ideas, e.g.
|
| https://tixy.land/?code=Math.sin%28t+%2B+Math.atan2%28y+-+7....
| nicman23 wrote:
| is this just shaders but not?
| ur-whale wrote:
| Why is the "=>" going in the wrong direction ?
| BearOso wrote:
| Ah, man, with the colors, I thought this was obvious, but it
| doesn't quite fit the url. But you can still copy, paste in the
| box:
|
| (1-sqrt(pow(7.5-x,2)+pow(7.5-y,2))/8)*(y-7.5)
|
| Pokeball.
|
| _edit_ Actually, there 's no fixed length, so
| https://tixy.land/?code=%281-sqrt%28pow%287.5-x%2C2%29%2Bpow...
___________________________________________________________________
(page generated 2025-05-12 23:01 UTC)