
3D GIFs Created with a Simple Visual Effect - bpierre
http://www.mymodernmet.com/profiles/blogs/3d-gifs
======
wikiburner
This was submitted last week, but didn't get many upvotes, so I'm glad to see
this submission taking off today:

[https://news.ycombinator.com/item?id=7200147](https://news.ycombinator.com/item?id=7200147)

The following was a really interesting discussion, that I'd love to hear more
opinions on:

==================================

 _pedalpete 8 days ago | link_

This is really interesting. I wonder if the lines have to be so solid, or if a
similar effect could be accomplished without breaking the image so much.

Would a bunch of almost imperceptible lines work? What about a smallish change
in colour saturation or similar? reply

 _gojomo 8 days ago | link_

I was wondering the same thing. Might a finer mesh/grid work? Or bars with
some dimensional shading themselves? Or slight transparency?

Could the bars/layer even be animated, along some consistent plane, so that
there's no static background part of the scene that's always obscured. (That
might allow even thicker bars, if that's otherwise helpful for the plane-of-
reference establishing effect, but which aren't as distracting, since the
mind's persistence will 'see around' them.)

Combining these, maybe there could be more than one synthetic depth plane
active at once, distinguished by color, translucence, or direction-of-motion?
There'd be some perceptual dimming with all that layered-in non-native 'depth
chrome', a little like looking through lenses or filters... but hey, other
stereo 3D tech has similar tradeoffs.

------
neals
Kinda reminds of that other visual effect, where they add circles to a photo
and give the illusion of the people in the picture being naked. Won't post the
link here cause NSFW, but I can imagine it being a related effect: adding
visual markers to change perception.

~~~
tekacs
In case anyone has trouble searching for this, the term you're looking for is
'bubbling'. Parent poster has already warned you that this could presumably be
considered NSFW somewhere (apparently)

~~~
fsniper
TIL There is a subreddit for this.
[http://www.reddit.com/r/bubbling](http://www.reddit.com/r/bubbling).

~~~
basicallydan
Well, that's a pretty weird subreddit. Lots of people on there trying to get
their "friends" bubbled, probably without most of these "friends" being any
the wiser...

~~~
dredmorbius
There are a lot of pretty weird subreddits when you get right down to it.

~~~
basicallydan
Yeah, I guess so. This one verges on dangerous, though.

~~~
dredmorbius
I've seen worse.

I mean, really, if you want to find weird stuff, and this is pushing your
boundaries, don't look too hard.

~~~
basicallydan
Heh, yeah I know what you mean - I'm not offended by the weirdness per se, I'm
just concerned about the privacy aspect of it.

------
SpeakMouthWords
One particularly interesting thing about the origin of this effect is that it
spawned from the file size limit on .gif files on tumblr. If users wanted to
exceed the balance of gif length, frame rate, and detail that they wanted,
they would upload multiple sections of the same scene side by side. Tumblr's
formatting would then add in the white bars automatically. This presumably
gave the inspiration to use this for a 3-D effect.

~~~
gberger
Uhh... But in the scenario that two gifs are side by side, how would the part
that goes above the white bar appear, if the white bar is not part of any
image?

~~~
ATLobotomy
SpeakMouthWords was describing the origin of the white bars shown here (i.e.
originally separating gifs).

These style gifs came later (i.e. gifs with 3d effect from the addition of the
bars), integrating the white bars that had come to be expected from Tumblr
posts.

------
PeterisP
Do note that the effect is much stronger (at least for me) if the moving
object goes outside of the perceived image bounding box - the
[http://bit.ly/1bUkBJQ](http://bit.ly/1bUkBJQ) example in the original
article.

~~~
frooxie
Drawing outside the panel is a standard method in comics when you want to add
extra impact or a 3d effect to a panel.

For example: [http://siguealconejoblanco.es/comics/wp-
content/uploads/2013...](http://siguealconejoblanco.es/comics/wp-
content/uploads/2013/01/planeta-hulk-integral-02.jpg)

------
pareshverma91
Showing the same gifs without those white solid lines for comparison would
have been better. Anyways cool stuff :).

~~~
cstrat
yeah this is something I want to see. i would think that the blur that goes on
on the background part of the images plays some part in the 3D effect.

would like to see how it plays out without the white lines.

~~~
torbit
I just tried the blur effect, but it is too much manual work. I spent 20
minutes, and finished a very small part of the gif. I just deleted it. It
wasn't getting the 3D feel I wanted. I think having solid bright color instead
of a blur, gives it more impact in the outcome.

------
MarcScott
I think these appeared on Tumblr a year or so ago. Found a nice looking
tutorial for making them here -
[http://www.youtube.com/watch?v=TmAWiVxOyto](http://www.youtube.com/watch?v=TmAWiVxOyto)

------
s-macke
[http://www.well.com/user/jimg/stereo/stereo_list.html](http://www.well.com/user/jimg/stereo/stereo_list.html)

Other idea, but gives similar 3d effects

~~~
kingkawn
i think that using stereoscopic video footage run frame by frame back and
forth from one lens to the other would be an interesting experiment

~~~
kingkawn
also using 60 fps footage to do it so that it was essentially watching to 30
fps pieces at once

------
CodeWithCoffee
To answer other commenter's questions about the color, my perception is that
it has to be the same color as the page background. This gives the illusion
that the image is behind a 'window' in the page that is covered by the bars.
Then when something moves from 'behind' the bars to 'in front' of them it
gives the illusion of depth.

------
rurounijones
For me the success of the effect was determined by how smoothly the object
went in front of the lines.

The black and white image of the puppy didn't work for me at all because you
could see the "pop" as it suddenly went in front.

Ice-Age and the Avengers clip seemed to stand out much more for me because it
was smoother (To my eyes at least).

------
tlarkworthy
well that effect is cognitively bookmarked for the next hackathon. Presumably
it will work in games if used sparingly.

~~~
nwhitehead
This would be pretty easy to do in games since you have all the z-buffer info
already. I'm thinking of a HUD that has multiple horizontal "monitors" that
show you the action. Then when things get close, they pop out of the monitors
for the 3D effect. That would be awesome!

------
shmerl
Why specifically GIFs? It's a generic animation technique, works with any
video format.

As was pointed out many times, if you have control over your site, don't use
GIFs for video and animation. Use proper video formats (WebM and etc.). It
will only save space and loading time and improve quality.

~~~
derefr
Basically: GIFs autoplay on people's Tumblr dashboards, proper video formats
don't, and that's pretty much all people are trying to achieve in the first
place.

If we just had some sort of file-extension/media-type (.webg, maybe?) that
signalled to a browser "I'm a video container, but treat me like a gif, by
defaulting to autoplaying, looping, and muting me", we'd replace gifs
instantly.

~~~
seszett
I don't think the current popularity of GIF compared to HTML5 <video> is
really because of autoplay (since <video> can do that too, and loop too).

The big advantage of GIF is that it works in an <img> tag just like any other
image, so you don't need a website to explicitly support it.

Another advantage, I think, is that GIFs are guaranteed not to play sound,
which is great when browsing say imgur.com or pr0gramm.com at work (edit: of
well, I had missed the "muting me" part of your comment, so let's just say
that we agree that it's an important component).

~~~
shmerl
Video can be muted with the tag itself. The only advantage of GIF is like you
said - you can use it in any place where images are supported (forums and
etc.) and video is not. On the sites where you have control over the tags GIFs
are counterproductive. For example they are way bigger for the same length of
video.

~~~
seszett
From a _user_ point of view, you can be sure that a site with pictures,
including GIFs, won't play sound, that's what I meant.

On the other hand, users don't have to know whether the HTML they are served
have <video>s or <img>s, so this could all be done behind the scenes, I guess.

------
dredmorbius
I'd seen this a few times in recent weeks and wasn't overly impressed, but
yeah, sure, whatever. Clicked to open the link in a new tab, continued to
other tasks for a while. It took me some time before I navigated back to it.

I flinched when I did as Capt. America's shield came flying toward me.

Maybe there _is_ something to this after all.

------
hcarvalhoalves
I think this would work without the bars, by just having the object pop out
from the boundary box.

------
vor_
Unfortunately, I don't perceive the effect (I'm assuming there's supposed to
be an optical illusion of 3D). The animations all look flat to me.

~~~
hrjet
Yeah; I experience a sense of perspective, but not a sense of depth.

It would be interesting if this effect was combined with the wiggle 3d effect.

------
samweinberg
I wonder how prominent the bars have to be for this effect to still work. Can
they be translucent or a color other than white?

------
the_cat_kittles
lets see- i wonder if you could take a 3d scan of a scene (still or moving)
and then superimpose a 3d lattice of white lines or something, and
automatically generate the correct occlusion? that would make this effect very
precise. that might be kind of cool. sort of like projecting a 2d lattice on a
golf green to read the break

~~~
Houshalter
There's this:
[http://www.cs.uiuc.edu/homes/dhoiem/projects/popup/index.htm...](http://www.cs.uiuc.edu/homes/dhoiem/projects/popup/index.html)

------
ahcox
They look particularly good expanded out to fill the page:

    
    
       http://hoog.li/g?g=http%3A%2F%2Fwww.viralnova.com%2F3d-images%2F&cimw=480
    
       http://hoog.li/g?g=http://www.mymodernmet.com/profiles/blogs/3d-gifs&cimw=320

~~~
ahcox
... Whoops:

[http://hoog.li/g?g=http%3A%2F%2Fwww.viralnova.com%2F3d-image...](http://hoog.li/g?g=http%3A%2F%2Fwww.viralnova.com%2F3d-images%2F&cimw=480)

[http://hoog.li/g?g=http://www.mymodernmet.com/profiles/blogs...](http://hoog.li/g?g=http://www.mymodernmet.com/profiles/blogs/3d-gifs&cimw=320)

------
bigfaceworm
Off topic: Captain America's throwing form is atrocious. See this for good
form:
[https://www.youtube.com/watch?v=Z0dXR6EiReY](https://www.youtube.com/watch?v=Z0dXR6EiReY)

------
optimo
is it okay to not be impressed with this 'effect'?

~~~
d23
It's HN, so the OP could have cured AIDS while being the first on Mars and it
would be fine to not be impressed.

Edit - ah perfect, see here:
[https://news.ycombinator.com/item?id=7249107](https://news.ycombinator.com/item?id=7249107)

------
chippy
In my opinion it's very clever and interesting, but it's not particularly
nice. It's very obvious in it's cleverness.

~~~
braum
what a useless statement.

------
Siecje
Does anyone have the originals to compare?

------
jazlyn
its really an awesome gif collection. You may also like:
[http://www.thephotomag.com/2012/12/collection-of-30-still-
ph...](http://www.thephotomag.com/2012/12/collection-of-30-still-photos-
with.html)

~~~
slowmover
These are called cinemagraphs, and here's a bunch of them for you:
[http://www.reddit.com/r/cinemagraphs](http://www.reddit.com/r/cinemagraphs)

------
hawleyal
"3D"

------
obamasupporter
Awesome

------
flibertgibit
This affect does not work on me, and, yes, I have two working eyes and neither
is "lazy".

~~~
Crito
Yeah, I am not seeing this effect _at all_. Perhaps relevant: one of my eyes
has poor eyesight, but 3d movies still work for me without wearing corrective
lenses...

I suspect this only "works" if you really want it to.

~~~
anonymfus
Try to close that eye.

~~~
Crito
Nothing. They just look like regular images.

------
LambdaAlmighty
Didn't work on me.

I didn't understand what the "visual effect" is supposed to be until I read
the description.

I still see animated 2D GIFs with bars over them (=no real difference if the
bars were removed).

~~~
ggambetta
The bars aren't _over_ them; at some point they appear to be _below_ some
parts, which is what gives the 3D effect.

