Hacker News new | past | comments | ask | show | jobs | submit login
Stepping Feet Illusion (wikipedia.org)
128 points by Reedx 5 months ago | hide | past | favorite | 25 comments

Had to do a basic CSS implementation to see how it looks in 60fps https://jsbin.com/ledomilaso/edit?output

Is it just me, or does the illusion change a little? Instead of the step, it almost seems like the yellow and blue rectangles are expanding and contracting at alternating times. (hmm, only when I don't focus on the rectangles, but somewhere else on the page)

I noticed that too. I think it's because the buses are 3 stripes long instead of 4.

After I changed the "--bus" CSS variable from 30px to 40px, I got the stepping effect.

That's really fascinating. Multiples of 20 give the stepping effect, while the other offsets of 10 grow and shrink. Stuff in between do a strange shrink and stop and grow. I thought 20 looked the best though.

I always loved making web remakes of common GIF illusions [0] where you can mess with variables and see what impact it has. This is a perfect example of that.

[0] https://ehsankia.com/cjs/#19

This makes some sense: to maximize the illusion, both leading and tailing edges of the bus should be going through the light and dark strips at the same time.

Yup. Have to rename it the "inchworm illusion"

I reversed the direction, changed the scale and the colors and got a moonwalk-like motion instead. Change the colors back to #ff0 and #00f to see what difference they make!


The oscillating look might mainly be an effect of the small scale.

The black and white lines in the background are only 1px wide and after moving one pixel, the busses touch a black bar either at the left or the right.

Great, I was just wondering what the stripe width influence was on the illusion, made it very easy to find out

This is great. Looks like two racing jellies now.

My brain feels broken.

If you want to play with it you can interactively with some javascript here. Holding the mouse down removes the vertical striping. You can also edit the code.


Very cool illusion.

If I unfocus my eyes and look at only one of the buses, I can see that it is moving at a constant rate across the stripes. But the moment I try to look at both, the illusion takes over. I can sort of get half the illusion by focusing my attention on one of the buses, but still 'noticing' the movement of the other: in that case I will see the bus I am paying attention to move at a constant rate and the other bus move in a stepping motion.

When I focused my eyes somewhere away from the screen and I tried to observe the buses from my peripheral vision, I saw them move together at the same time. But at some point my brain caught up and they did the stepping thing again, even in my peripheral. Such an interesting illusion!

To me, the colored rectangles appear to be moving at the same speed, but with an alternating intermittent forward motion. The yellow rectangle will jerk forward, then the blue, then the yellow, and so on across the field.

Hence the name “stepping feet”

That seems the obvious interpretation, and it's strange that the article goes on about "faster/slower" and not "visible/invisible" motion.

>This special illusion shows how the background of the object or the object around it has a significant effect on the perceived speed of the object

Does it imply that if I drive a brighter color car, it will appear that I am driving faster? (when compared to a darker color car traveling at the same speed)

I think that this illusion is based on low-contrast change when brighter bus moves in to a brighter stripe (and vice versa). Your eye can’t tell yellow from white as much as it can tell blue from white. If you’re driving on a non-striped road that doesn’t work.

But I’ve read that if you look at a darker car moving at you, you’ll perceive it is a little less threat than e.g. red or neon-colored one, because dark contours “grow” slower. (Similar thing, but can also be a stereotype bs, learned lots of these before debunking via internet era came)

The reference links are also pretty cool: https://michaelbach.de/ot/mot-pigeonNeck/index.html

(Don’t) see also: https://en.wikipedia.org/wiki/McCollough_effect

McCollough originally reported that these aftereffects may last for an hour or more.[1] However, Jones and Holding (1975) found that 15 minutes of induction, when time-elapse testing is employed, can lead to an effect lasting up to 2.8 months.[2]

wish they had a GIF with higher framerate. I'm on a 120Hz monitor and wonder how pronounced the effect would be with smoother motion.

Here's a high quality version: https://www.youtube.com/watch?v=wAMN1QW5ByM

Also shows what it looks like in pure black & white at the end.

Interesting, I had a much easier time seeing the actual motion instead of the illusion in black and white over colored.

The stepping illusion was created today using just 140 characters of JavaScript, see the illusion animation here with interactive source code: https://www.dwitter.net/d/17527

This feels related to "The Dress", somehow (is it blue and black, or white and gold?).

Do these separate illusions share a common cause (high/low contrast colors juxtaposed)?

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact