Introduction: Message in a Magnet

For Valentines Day this year I decided to surprise the girls in my life with custom refrigerator magnet art. For a special twist I hid secret messages inside the magnets using two completely unrelated technologies.

  1. Magnetic fields
  2. 3D stereogram

Secret Hidden Magnetic Fields

I wrote a secret message on a sheet magnet using a small strong "rare earth" Neodymium magnet. The message can be viewed using a special sheet of green plastic magnetic viewing film.

Warning, you might not want to try this first on one of your favorite refrigerator magnets -- especially in the step where I talk about erasing your secret message. After you are done, it may not stick to your fridge ever again! (But at least it will have a cool message hidden inside!)

Stereogram Picture

To make it interesting, I printed a 3D stereogram onto the front. Many of us will remember the Magic Eye fad popular in the 1990's. It turns out these are not all that difficult to make.

The stereogram pictures scattered about in this Instructable might be difficult to see on a small screen such as a mobile phone. You can try tipping your phone horizontally to view but consider revisiting on a computer that has a bigger screen. Stereograms are fun. So definitely worth a second visit.

Here is a link to my website where you can create a stereogram of your own. I'll explain the javascript in step 4 of this Instructable.

http://stereogram.madwrapper.com/

Supplies

  • Green Magnetic Viewing Film
  • Strong Rare Earth Neodymium 12-pack Disks (The eraser)
  • Small Rare Earth Neodymium cubic magnet (The pencil)
  • Large car magnet. (Or one of those political campaign magnets or a non-profit refrigerator clutter-maker delivered free to your mailbox).
  • Or a printable magnet sheet. The ones I found at Staples printed nicely on my inkjet printer.

Step 1: Secret Message Written Into the Magnetic Fields

This step is such a simple step to accomplish: just take a small Neodymium bar magnet and scribble away. Use a sheet of magnetic viewing film to view your creation. Done!

Flexible Magnet Sheeting

Flexible magnet sheeting is made from bits of magnetized iron (scientists call it ferrite) embedded in rubber. Most of us will recall playing with iron filings making interesting shapes with a magnet. Same thing! That's the same iron, they just stuck it in rubber.

Since these sheets are simply made out of magnetized iron filings, we can easily demagnetize and re-magnetize them anyway we want. All we need to do is touch it lightly with a good strong magnet. We'll get to that soon.

You can find sheet magnets everywhere. Odds are you have a few attached to your refrigerator right now. If not, you've probably got a stash saved up from various non-profit or political mailings. Or you might have one stuck to your car to advertise your thing: "I Heart My Dog" or "Warning: This Car Stops for Turtles". The larger "car" magnets are best for this project since the front needs a big viewing area to see the secret stereogram message I will talk about elsewhere.

Or you could buy printable inkjet sheets from your local office supply store. Same thing.

Neodymium

"Rare earth" Neodymium magnets are very strong. This is element 60 on the periodic table. You can find it all the way down near the bottom of the table on top of Uranium. It is mined from the earth all over the world.

Did I say these things are strong. Yes they are strong. Very strong! They are so strong we can use them to draw on iron.

Magnetic Viewing Film

Bad news: we can not see magnetic fields with our naked eyes so your creation of rare earth on iron remains invisible.

Good news: scientists have invented the Magnetic Viewing Film.

Magnetic viewing film comes as a sheet of green plastic embedded with bits of nickel. When you place this on top of any magnet, the nickel aligns with the magnetic fields and shows the pattern. (So I wish this stuff came in some cooler colors other than green. But green is pretty cool anyway.)

So place your magnetic viewing film on top of your magnetic sheet. Voila: the secret message is revealed.

Neodymium Eraser

Warning: erasing your message could weaken your magnet significantly. After doing this, it might not stick to your refrigerator ever again! Experiment with a junk magnet first before trying this on one of your special ones.

So, you ask, what if I don't like my scribble? Simple: use a Neodymium magnet to erase it! I found it easiest to use a stack of magnetic disks for this erasing. The side of your small Neodymium bar magnet "pencil" should work fine as well.

Just swipe with wide lines and the message will be erased. Ready to draw a new one.

"I Heart Robots!"

Don't you!

Step 2: About Stereograms

Anyone who is old enough will remember the fad that hit America in the 1990s. Magic Eye came out with a ton of posters and books and whatnot for you to stare into to look for secret messages or hidden things. Magic Eye is still around so maybe you've seen this even if you were born in the 20th century.

You can see it. I know you can!

(Well, I guess there is some bad news. If you are blind in one eye unfortunately you will not be able to see one of these. It takes two eyes. No more. No less. Sorry.)

But if you've got two eyes. Here you go.

It can take a little while to get the hang of it.

  1. Hold the image up close to your face.
  2. Put your nose right up into it.
  3. Relax your eyes. The image will probably be blurry.
  4. Now, very slowly, move the image away from your face. Very slowly.
  5. Keep your eyes relaxed until the pattern of tiles from one column overlaps on top of tiles from another column.
  6. If you are successful, a 3D image will pop out of the paper (or pop into the paper depending on how you look at it).
  7. You should see only two layers: a background in one plane, and some words in the other plane. If instead you see something that looks like a mountain range from the sky, you've probably crossed your eyes too much. Getting there. Try it again.
  8. You probably won't succeed the first or second time. Keep trying. It is totally worth it.

Step 3: Simple Parlor Trick: an Easy-Make Stereogram

Here's a nice parlor trick anyone can do. All you need is a text editor.

Try this. It's very interesting.

Stare deep into the text below and cross your eyes until letters overlap. Let your eyes slide "abcd" over to the left so it overlays on top of another "abcd". Eventually you will see a rectangle pop from the screen (or a swimming pool dug deep into the screen).

Notice how I removed some of the letters "j" from some lines. These are the lines that all end in "g". The pattern repeats every 12 characters except for where I removed a "j" that matches 11 characters back. The background go back to normal on the column when the next "k" matches a "k" 12 characters previous.

Note: if you are making one for yourself, this works best with monospace font (like courier).

If you are viewing this on a small device like a phone, you might need to tip it horizontally to get rid of lines that are longer than the width of your screen. Or you might need to find a computer with a bigger screen.

abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghiklabcdefghijklabcdefghijklabcdefg
abcdefghijklabcdefghijklabcdefghiklabcdefghijklabcdefghijklabcdefg
abcdefghijklabcdefghijklabcdefghiklabcdefghijklabcdefghijklabcdefg
abcdefghijklabcdefghijklabcdefghiklabcdefghijklabcdefghijklabcdefg
abcdefghijklabcdefghijklabcdefghiklabcdefghijklabcdefghijklabcdefg
abcdefghijklabcdefghijklabcdefghiklabcdefghijklabcdefghijklabcdefg
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef
abcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdefghijklabcdef


Think of it this way. In nature, as a thing moves closer to you, your eyes will track it in. As you track, the angle between your eyes changes. In a flash your brain does a quick calculation to estimate the range. A faraway object leaves you wide-eyed. A closeup object will make you cross-eyed.

That first missing "j" in the image above makes your brain go cross-eyed (so to speak.)

Step 4: Stereogram Javacript

The program is on my website

You can go to my website and run the javascript described in this Instructable step.

http://stereogram.madwrapper.com/

Once you selected a tile to paint with, the webpage will take a long time to render depending on how fast your computer is. But be patient, the results are awesome!

After you've created your personal stereogram, you can save by right-clicking and selecting "save image". After you've saved it, you can do anything you want with the picture, including print it.

If you are not a programmer, feel free to skip the rest of this section.

How this Works

If you are a programmer, or simply curious, go to the above site with the Chrome browser and open "Developer Tools". I wrote the script entirely as javascript so you can see exactly how everything works under the hood.

I tried to make it as simple as possible for demonstration purposes. A professional implementation will, no doubt, be optimized and therefor run a whole lot faster. I hope you find it easy enough to follow.

Initialize a Column of Tiles

First we need to initialize the stereogram by drawing a vertical column of tiles down the left side. We need this so that the main loop can have some colorful pixels to copy from.

	for (y=0; y<stereogramHeight; y+=imgHeight) {
            ctx.drawImage(img, 0,y,imgWidth,imgHeight);
	} 

Copy Pixels

Fundamentally it's all about copying a pixel color from there to here. The "there" where you copy from depends on whether you want to be in the background or the foreground. The foreground is all the spots corresponding to lettering.

The width of a tile is 100 pixels. If you are showing background, copy the pixel in the position 100 to the left of where you are. If you are showing the foreground (aka a letter) shift over and copy the pixel 96 to your left.

The upper canvas is a large area with a white background. Here we write the user's secret message text in a huge black font. The lower canvas is where we will render the stereogram based on the text in the upper canvas. Both canvases are equally sized at 800x800 pixels each.

Conceptually here is the loop:

for (line=0; line<800; line++) {
   for (column=100; column<800; column++) {
       if (textCanvas.pixel[column, line] == white)
           isBackground = true;
       else
           isBackground = false;
       if (isBackground)
            copy(from: stereogramCanvas.pixel[column-100,line],
                 to: stereogramCanvas.pixel[column, line]);
        else
           copy(from: stereogramCanvas.pixel[column-96,line],
                 to: stereogramCanvas.pixel[column, line];
    }
}
Note: in reality the script is not quite like the conceptual sample above. The outer loop "for (line=0; line<800; line++)" is implemented so it will pause every millisecond to give your browser some time to display the line after it completes. The javascript function setInterval() is a strange but invaluable feature.

The Rest is Boilerplate

The bulk of the rest of the script is standard javascript stuff needed to interact with the user to select the various text, color, and image to tile. There is a wealth of information on the internet that will explain all that. Search and you will find it.

Step 5: Hearts and Flowers

I needed to make some good tiles as the base for my stereograms so I took a bunch of pictures of valentine(ish) things.

I took pictures of candy sprinkles and I took pictures of a montage arrangement of hearts and charms I bought from the local craft store. (50% off sale on all valentine crafts. What a deal!)

I also grabbed a picture of some flowers. And I grabbed a picture of a bed of roses.

And I totally Photoshopped an Instructable Robot a couple of different ways. Soon you will see why I did what I did.

After scaling and cropping these images, I saved the thumbnail images in PNG format so they can be used as tiles. (And for programming reasons I reformatted them to base64 for embedding onto the javascript.)

Different Tiles Different Results

I think I provided a good enough selection of types of tiles to show you the advantages and disadvantages of styles of tile. There are tradeoffs depending on what you are looking for.

Sorry, No Cartoons

First of all, cartoon characters are out. Drawings such as the awesome Instructables Robot do not work well as a stereogram tile. You need to have good color variation throughout your image to make this work. Large areas of of solid uniform color are no good no matter how cool the picture is in real life.

Robots Are Crazy

Sorry Robot: you are such an awesome robot but not so talented when it comes to stereograms. Time for an upgrade!

Since I wanted desperately to give the robot guy his deserved recognition, I took an original stolen from the Instructables website and photoshopped it like crazy. The texture gallery "grain" and "stained glass" came in very handy.

And more. I stole a ton of other community created Instructable Robots dressed in festive colorful garb. I miniaturized them into tiny little wheely specks and scattered them like celebration in the streets.

After all that, I decided that I needed even more variation for my tile. So I generated a random background of junk. In Photoshop I overused all sorts of textures and scramble effects until my mess was complete. So now the whole thing looks like and old 1970's TV screen with a faulty antenna.

Perfection!

You will find two variations of my robot: "somewhat speckled" and "very speckled." The "somewhat speckled" robot makes a nicer looking stereogram for hanging on the wall as art. The "very speckled" robot makes a stereogram that reveals it's hidden message more easily. Go ahead: I dare you to pick a favorite.

Candy is Good

Of the various images I tried I think the "candy hearts" tile generates a stereogram that is among easiest to see the secret message. The tile picture has a lot of natural subtle color variation so any given background pixel is unlikely to match a neighboring foreground pixel.

I also like this one since it is realistic enough to be interesting. And is uniform enough to flow evenly from tile to tile.

A Big Heart is Tough to Break

The "sparkling big hearts" (red and white) look really cool as you stare in looking for the message. But the message itself difficult to see. Not for the faint. That said, it is totally worth the challenge once you break the code.

This tile contains a lot of regions filled by the same shade of red or the same shade of white so background and foreground can get confused. The color is not as uniform as that of a flat cartoon character so it is definitely a candidate for stereogram magic.

Flowers for the Holiday

The bed of roses might be my favorite background. I'll save that one for my wife. I think she will appreciate it on Valentines Day.

The spring flowers are nice too. That's another picture that has good balance of "pretty" and "message clearity." That'll be a good one for Easter.

Step 6: Printer, Paper, Scissors

I created a couple magnet variations. One allowed me to recycle some old magnets. The other allowed me to experiment with an new type of printer "paper" I recently discovered.

Sticky Labels on Recycled Magnets

  1. Print a set of stereograms onto a 8.5x11 shipping label.
  2. With a pen, draw an outline on to the label, tracing around the magnet.
  3. Cut on the line.
  4. Peel the backing off half the label.
  5. Closely align the label onto the magnet keeping the sticky half lifted in the air. Once you are sure the alignment is perfect you can press down the sticky half. (I misaligned my first one. The glue is impossible to get off so I simply printed another label and applied it over the top of my first. Better results the second time.)
  6. Draw a secret message with your Neodymium "pencil". (See step 2)

Printable Magnet Sheets Are Awesome

I used Photoshop to create masks to make nice looking stereogram hearts. Then I printed the hearts directly onto a printable magnet on my inkjet printer. Pretty easy once you have a good image to print. Photoshop took some time but not too bad.

Photoshop Masking

Every time I attempt to create a masked image in Photoshop I have to search YouTube to figure out how. Photoshop is great. Photoshop is powerful. But sometimes Photoshop does not make any sense. Here are the steps I did.

I included a screenshot with lots of circles and arrows. Maybe this will help you. If not: YouTube has it all.

The screenshot shows all the steps to create oval masks. After making this diagram I changed my mind and settled on hearts, not ovals. To make a heart, select the cookie cutter in step one on the diagram.

If you have the same version of Photoshop that I do, here are the steps:

  1. Select the cookie cutter "blob" in the bottom and pick the heart. (Or select the oval.)
  2. Fill the heart with black.
  3. Duplicate the layer if you want to print two stereograms on one page.
  4. Reposition until you are happy.
  5. Select the two layers.
  6. Merge layers.
  7. Select the newly-merged layer.
  8. At the top of the layers sidebar there is a square icon with a circle in it ("Add Mask"). Click that.
  9. Copy/paste your stereogram images into layers above (in front) the mask. (Yes, that is totally confusing to me but it is the way it is: put the image in front of the mask.)

  10. Select your stereogram image layer.

  11. With you image selected, go to the "Layer" menu way up top, and pick "Create Clipping Mask". (Pretty hard to find if you ask me.)

  12. Now you should have a couple of cutout windows showing what will print.
  13. Reposition as needed.
  14. Print
  15. Cut out the image.
  16. Draw a secret message with your Neodymium "pencil". (See step 2)

Step 7: Happy Valentines Day!

Happy Valentines Day to all the people, pets, turtles, and robots and everything else there is!

Magnets Challenge

Participated in the
Magnets Challenge