Jump to content

Stereogram / Autostereogram Tutorial


Ego Eram Reputo

Recommended Posts

  • 4 months later...

A couple of times in the past I tried to figure out how to do these with PDN - gave up in the end, but great to now see the methodology.

Nice tutorial - I will definitely have some fun playing with this (BTW - Pyrochild's Random Shape Fill plugin is great for backgrounds):

EnterpriseASG.png

Thanks

-CJ

PKRM.png

PKRG.pngPKRT.pngPKRD.pngPKRP.png

Link to comment
Share on other sites

Beam us up! Fabulous stereogram. How many tiled strips did you use?

Link to comment
Share on other sites

Beam us up! Fabulous stereogram. How many tiled strips did you use?

The image is 800x400, and I used 8 x 100px strips for the background. I then cut the 'image' into 10 x 80px pieces.

I've always loved these 'Magic Eye' pictures - probably because I have no problem seeing them and so many others do, lol.

I am currently working on one for my daughter, based on Twilight (go figure!). I am trying to work out if I can get multiple layers (i.e. one on top of another). My first effort was unsuccessful :( - I'm also trying to see if I can do a true 3D style one, you know, like a shaded 3D texture map image - any ideas?

I suppose that kind of thing would require a sophisticated program, and do it 1 pixel strip at a time, each at different focal distances.

Anyway, I am happy with my first results and will still use this method in the future.

-CJ

PKRM.png

PKRG.pngPKRT.pngPKRD.pngPKRP.png

Link to comment
Share on other sites

I'm also trying to see if I can do a true 3D style one, you know, like a shaded 3D texture map image - any ideas?

I suppose that kind of thing would require a sophisticated program, and do it 1 pixel strip at a time, each at different focal distances.

The problem is that we have to snap the elements to integer pixels when we really need to be able to subdivide them.

E.G. Imagine a playing card tilted away from us so that the left hand side is further away from the viewer than the right. In a perfect world, every 1pixel vertical strip should be moved slightly more/less than the last to get a truly graduated effect from left to right.

I'm sure that tiling vertical strips by integer amounts is always going to create a visual margin where you transition from one whole integer to the next.

Make yours a VERY large canvas and you might get away with it - the transition might be sufficiently small to fool the eye when taking in the whole image.

Link to comment
Share on other sites

@cjmcguinness: I once made a set of tools to ease the stereogram manufacture process Stereogram Tools (beta). I didn't get around to releasing them as they didn't seem that popular (the plugins that is).

You might find them useful.

Link to comment
Share on other sites

@cjmcguinness: I once made a set of tools to ease the stereogram manufacture process Stereogram Tools (beta). I didn't get around to releasing them as they didn't seem that popular (the plugins that is).

You might find them useful.

The 'Backfill' effect is definitely useful, cuts down on a lot of tedious work. However, the 'Echo' effect would benefit from a greater scale of Vertical echo height - 512px seems a bit limited, especially if you want your stereogram to be 800x600. Also, I tend to try and make my backgrounds look as seamless as possible.

I have been starting with something like a 100x600 strip and using the Random Shape Fill plugin to cover the area (repeated), then with the Panelling effect I shift it 50px so the seam is in the middle, then select a 60px wide strip, in the centre, and use the Random Shape Fill again to cover the seam (this time keeping all objects inside, so none cross the edge).

This creates a nice 'tileable' texture. Your 'Echo' effect would be great if I could then paste this into a new layer and 'echo fill' across, however (again) it only works if the image is less than 512 in height. Maybe if I created a 300px height tileable texture I could then panel this in two rows, but I prefer full height strips.

Good work on the 'Backfill' though, I will definitely be using that on any future efforts.

Cheers

-CJ

PKRM.png

PKRG.pngPKRT.pngPKRD.pngPKRP.png

Link to comment
Share on other sites

Good point. I'll increase the Echo maximum to around 1000px. That should satisfy most users.

I'll let you know when it's uploaded.

Link to comment
Share on other sites

Link to comment
Share on other sites

I recall looking at this a year ago but, alas, could not see anything. I've just looked at it again and ........ I now think I can see a Gargoyle

;)

30b8T8B.gif

How I made Jennifer & Halle in Paint.net

My Gallery | My Deviant Art

"Rescuing one animal may not change the world, but for that animal their world is changed forever!" anon.

 
Link to comment
Share on other sites

Which image? Mine are text characters and cjmcguinness' is the starship enterprise - so I'm not sure which one you're looking at.

Link to comment
Share on other sites

I cannot see text or a starship, just a gargoyle in yours Ego. My eyes may be compromised as I wear contacts (mono system). Perhaps the solution is for me to try to make one of these Stereograms myself!

30b8T8B.gif

How I made Jennifer & Halle in Paint.net

My Gallery | My Deviant Art

"Rescuing one animal may not change the world, but for that animal their world is changed forever!" anon.

 
Link to comment
Share on other sites

Which image? Mine are text characters and cjmcguinness' is the starship enterprise - so I'm not sure which one you're looking at.

wtf!.."starship enterprise"..geeze C.J....thought that was a strangely drawn bird.. :lol::lol:

(maybe I should pay a visit to my optician more often!!!)

regards j.d.

Link to comment
Share on other sites

  • 5 months later...

Tutorial of the year - so far. :-)

Only if one can see it David ;)

I've tried over & over again for a few months with different monitors and on different computers and I am none the wiser - which is a tad disappointing. :(

naturesig.png

Link to comment
Share on other sites

Try printing the image. The only other viewing technique I can offer is to hold the image up to your nose & slowly withdraw it while deliberately leaving your eyes unfocussed.

Link to comment
Share on other sites

  • 4 weeks later...

Very nice image! Your color scheme is just like the Magic Eye images.

The swirl must have taken ages to tile - did you use the backfilling plugin or do it manually?

Link to comment
Share on other sites

Very nice image! Your color scheme is just like the Magic Eye images.

The swirl must have taken ages to tile - did you use the backfilling plugin or do it manually?

Thank you! I used the Perlin texture and then Dents to get the background.

The swirl did take a while to tile. I did it manually. I discovered your plug-ins after doing this image (that will teach me to do a tutorial before reading all of the pages following it boltbait.wink.png ).

Your plug-ins for this are great, BTW. They have come in very handy; thank you for taking the time to create them.

Edited by dynojuggler
dynojugglersigsmall-1.jpg
Link to comment
Share on other sites

Very cool! Love the colours too.

Thank you!

I have been trying to put multiple layers in one image and I am sure there is an easier way than what I am doing.

If I just adjust the shift of the fore image without doing anything else I get this (it is just a circle in front of a rectangle; something simple to experiment with)...

EXAMPLE1.jpg

The backfilling of the front image cuts out portions of the back image and the back image distorts the front image.

With some fiddling I can get to this...

EXAMPLE2.jpg

It is a little sloppy right now, but, the cutting out and distorting are pretty much remedied but it took three separate layers to get it.

In a separate image I ran backfill on my front image and used the resulting image to make 2 different cut outs of my back image.

Is there an easier way to get multiple layers in one of these images?

dynojugglersigsmall-1.jpg
Link to comment
Share on other sites

I've never figured exactly the right system for dealing with overlapping elements.

I'm sure that the actual intersection between any two elements would have to be treated as a separate element again.

If you figure it out, please let me know your technique!

Link to comment
Share on other sites

I've played with this for an hour or so. My assumptions above were completely wrong :/

What you need to do is backfill only the parts of background elements that actually show past the foreground elements.

Check out this demo image:

 

Overlapped_elements.jpg

 

This image has a rectangle in the background, and an ellipse in the foreground, overlapping the rectangle's left edge.

The correct backfilling technique is to backfill the rectangle first - but without the piece that the ellipse hides. So you need to remove the ellipse shape from the rectangle THEN backfill it.

After the partial rectangle is done, then do the ellipse (foreground element) as normal.

I hope this muddled explanation helps. I'm keen to see what you come up with!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...