labwithleo

Gelaskins for iPhone 4 now available

5F0D0D06 2213 494E ABAF C6247B412EC3iphone photo Gelaskins for iPhone 4 now available

I’ve been a fan of Gelaskins since the first time @LeoLaporte showed me one on his MacBook Pro on the set of The Lab. Since that time, the Gelaskin repertoire has expanded to include iPhones, iPads, Kindles and just about every other consumer electronics product. Today, that announced that they now offer several beautiful designs for iPhone 4. The straight sides of the new iPhone design mean that you not only get this 3M loveliness protecting the back of your iPhone 4, but the front and sides as well.

With the recent comments of @Veronica Belmont notwithstanding, I never understood why anyone would want a case for their iPhone. Steve Jobs unveils these things and we all ooh and ah over how beautiful they are and then, when we get one, we cover it with some gelatinous, lint gathering case that covers over everything that made the iPhone beautiful in the first place. Does this case make my iPhone look fat? Yes, yes it does.

Products like the ZAGG Invisible Shield and Gelaskins do the job for me and keep my iPhone looking like an iPhone.

Gelaskins for iPhone 4 sell for US$14.99 and currently come in over 120 styles. Plus, if you don’t like the artwork Gelaskins has pulled in from everywhere from Marvel and Dark Horse Comics to Buffy the Vampire Slayer and National Geographic, you can upload your own artwork to create a truly one-of-kind skin for your iPhone 4.

Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

(from Episode #74 of The Lab with Leo Laporte)

finish 20070912 143158 Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

S.C.A.M.P.E.R.
Photoshop is supposed to be a creative outlet, right? But it has so many features and settings that sometimes we’re so overwhelmed that we become afraid to just play with it. We might have an effect in mind and we search the internet for it. When we find it, sometimes it’s not what we have in mind or often we don’t find it at all and we just give up. “Photoshop can’t do that.� we tell ourselves.

We have to give ourselves the freedom to play and we have to give Photoshop the freedom to do things that it was never expected to do.

For instance, Photoshop has a Photocopy filter, right? Have you ever tried using it for something other than making an image look like it was photocopied? Give it a chance! Most of Photoshop’s filters can be adjusted to the degree where the effect they produce looks nothing like what its label in the Filters menu would have you expect. What is important to note in those situations is not that the particular combination of settings doesn’t look like a photocopied image, but what does it look like? What effect can you use this combination of settings to achieve?

Don’t be held back by the labels on the menus!

This kind of thinking can (and should) be applied to Photoshop tutorials you find online and in books as well. Follow the tutorials as they were written and see how the effect materializes as it was intended by the tutorial’s author. But then, after you’re familiar with what it does, play around with the tutorial a bit and see what else comes out of it.

Here, we’re going to take my Comic Art Effect tutorial and apply Alex Osborne’s S.C.A.M.P.E.R. principle to see what other effects we can make from it.

start 20070912 143032 Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

S.C.A.M.P.E.R. stands for:
Substitute
Combine
Adapt
Modify
Put to some other use
Eliminate
Rearrange

A brief Breakdown of the Comic Art Effect
This is an effect is based on a Tone layer and a Color layer to approximate the coloring of a vintage comic book illustration and 3 Ink layers to give the effect of “hand drawn� outlines and shading. At the end of the tutorial he recommended adding another color layer to tweak skin tones that may have gone astray, a white layer to brighten teeth and eyes, and a dot screen layer to give the image that course dot pattern associated with old comic books.


substitute 20070912 143459 Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

Substitute
Try Substituting different filters in tutorials. In the case of this tutorial, you might substitute the second and third Ink layers with one where you have copied the original image to a new layer above Ink 1. Set the new layer to “Multiply� with an opacity of 50% and then apply Filter>Sketch>Graphic Pen using the settings 15, 43, Left Diagonal. It gives a much softer illustrative effect.


combine 20070912 143624 Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

Combine
If you have Adobe Photoshop CS3 as part of a Creative Suite bundle, you probably have Adobe Illustrator CS3 as well. Why not combine its abilities with Photoshop to create effects that could not be achieved using either application on their own? He had saved a copy of my finished Photoshop Comic Effect where I turned off all of the Ink layers and saved it as a flattened TIF. He then opened that TIF in Illustrator and used Live Trace to simplify the colors to look a bit like and Andy Warhol pop-art painting.


Adapt
If you look on MacMerc.com, you’ll find that this tutorial has been Adapted for use as a Photoshop Action. It has also been adapted for Adobe Elements. If you don’t happen to own Adobe Photoshop, that shouldn’t stop you from enjoying a free open-source creative outlet—namely, Gimpshop! I unfortunately haven’t adapted this tutorial for use with Gimpshop but that’s only because I have Photoshop. I welcome and encourage any of you Gimpshop experts out there to take a crack at the Comic Art Effect and and let me know how it goes. I’d love to link to your tutorials!!


modify 20070912 143813 Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

Modify
Photoshop has long offered non-destructive ways of modifying an image; affording safe experimentation where any mistakes or undesired results are entirely reversible. Once you’ve finished a tutorial, don’t be afraid to go over it again and change the filter settings. Use Smart Filters, if you can, and then you can go back again and again and try new effects and settings. Layer Masks and Adjustment Layers also allow for experimentation.
I have added an Adjustment Layer to my file to cycle the color of my image through the rainbow to create a psychedelic result.


Put it to some other use
Who says Photoshop has to just be for static images? Go to video! After all, video is just a string of still images strung together and displayed in quick succession. Look at what one person has done using the Comic Art Effect tutorial (click to view video above).


eliminate 20070912 143959 Experimenting with Adobe Photoshop CS3 (Comic Effect Deconstructed)

Eliminate
For “Eliminate,� try turning off all but the Ink layers. For many photos I’ve tried this effect on, turning off everything but the Ink layers creates and pretty cool looking illustrative effect. This was the inspiration for my Frank Miller Sin City Effect.


Rearrange
While my experiments with rearranging or reversing the Layers and steps of this tutorial didn’t return any pleasing results, the technique of Layer shuffling often does produce new and interesting effects that you can call your own.


Conclusion
So, bottom line, I hope you’ll be encouraged to play a bit with Photoshop and apply the S.C.A.M.P.E.R. principle. The only way to feel comfortable using any software is to become familiar with it and an excellent way to do that is to explore and experiment.
Have fun!!

Turn 2-D images into 3-D masterpieces!!

(from Episode #76 of The Lab with Leo Laporte)

Have you ever seen one of those movies or a still image that appeared to be in 3-D when you wore special red and blue glasses? It’s easier than you think to make one of those images. In fact, I’ll show you 2 methods to achieve this effect. The first one requires you to take two pictures of a stationary subject and merge them in Photoshop. The other will take an existing photo and convert it to 3-D.

First, I should explain how 3-D images work. We view the world in 3 dimensions because our two eyes see things slightly differently and our brain interprets the two pictures our eyes see as being 3 dimensional. We unconsciously calculate depth, width and height based on the similarities and the differences between those two pictures. It just happens. We don’t even realize we do it.

These artificial 3-D images we’ll be creating, called anaglyphs, simulate in a 2-D image the 2 pictures our eyes see when we look at actual 3-D objects. The red and blue lenses of the 3-D classes block out certain information in the 2-D image allowing the blue lens only see the red channel of the image and the red lens to only see the blue and green channels. This allows a single 2-D image to hold the 2 slightly different images our eyes need to see in order to perceive 3-D information.

Here are a few methods you can can use to make one of these images:

The 2 picture/1 camera method (this method works on stationary objects)

With a digital camera affixed to a sturdy tripod, take a picture of the stationary subject. Carefully move the camera and tripod 2.5 and 3 inches to the right and take another picture.

What you have effectively done is taken a left eye image and a right eye image.
lefteye 20070919 184629 Turn 2 D images into 3 D masterpieces!!
righteye 20070919 184732 Turn 2 D images into 3 D masterpieces!!
Open both images in Photoshop. Using your first image (your “left eye” image) open the Channels palette and click the Red channel (Ctrl-1 on PC or Command-1 on Mac). Select all (Ctrl-A on PC or Command-A on Mac) and copy (Ctrl-C on PC or Command-C on Mac).

Now go to the second image (your “right eye” image) and click the Red channel (Ctrl-1 on PC or Command-1 on Mac) in the Channels palette. Paste the Red channel from the “left eye” image in Red channel of the “right eye” image (Ctrl-V on PC or Command-V on Mac).

Click the RGB composite channel in the Channels palette (Ctrl-~ on PC or Command-~ on Mac) and put on your 3-D glasses (make sure the left lens is red and the right lens is blue).
3dimage 20070919 184851 Turn 2 D images into 3 D masterpieces!!


The 2-D to 3-D conversion method

The problem with the 2 picture/1 camera method is that you can’t capture action. No pictures of your dog jumping to catch a frisbee. No 3-D pictures from the airshow. None of that.

The 2-D to 3-D conversion method allows you to alter an existing 2-D image and make it 3-D.

I’m going to start with this image of Dr. Tiki and Leo on the set of The Lab…
drtiki 20070919 185021 Turn 2 D images into 3 D masterpieces!!
What you need to do is select the frontmost item in the photo and save the selection as a channel. Then select the next most foreword item and save that as a channel and so on and so on until you reach the background. How detailed you want to be is up to you. I have selected Dr. Tiki’s face, then his body, then Leo’s arms and camera, then Leo, then the column behind Leo and then I left everything else as the background. Here’s what my Channels palette looks like:

channels 20070919 185209 Turn 2 D images into 3 D masterpieces!!
Now, create yet another new empty channel and fill it with white. In your Swatches palette, select 20% Gray, load the back-most item in the Channels palette as a selection (in my case, “Alpha 5″ in the screenshot above) and then fill the selection with 20% Gray in the new channel. Continue to select progressively darker shades of gray and use the color to fill the selections of each increasingly more foreground channel in our new channel. So, for my image, I’ll make a selection of Alpha 4 and fill with 40% Gray, then make a selection of Alpha 3 and fill that with 60% Gray, then Alpha 2 with 80% Gray and Alpha 1 with Black. Plan out your selections and grays so that you can make a smooth progression from the background in White to the foreground in Black. Here’s what my channel looks like:
dispmap1 20070919 185255 Turn 2 D images into 3 D masterpieces!!
I know it looks scary–bear with me.

Go Filter>Blur>Gaussian Blur… and use a setting of 10. Click OK. This with blend the levels a bit. Now we need to expand the coverage of the different levels of depth a bit. To do this we will use a Filter called Minimum which shrinks the coverage of the lighter areas of the affected image.

Go Filter>Other>Minimum… and plug in a value of 10. Click OK.
dispmap2 20070919 185343 Turn 2 D images into 3 D masterpieces!!
Select All (Ctrl-A on PC or Command-A on Mac) and Copy (Ctrl-C on PC or Command-C on Mac). Create a new Photoshop document and Photoshop will automatically plug in the height and width of the image held in the clipboard’s memory, so you need only click OK.

Paste the funky channel in the new document (Ctrl-V on PC or Command-V on Mac) and save this new document as a Photoshop (.psd) file and save it somewhere where you will easily find it again. Close this new file and direct your attention back to the main document.

Click the Red channel in the Channels palette (Ctrl-1 on PC or Command-1 on Mac) and activate the “eye” icon next to the RGB composite channel in the channels palette (just activate the “eye” don’t select the RGB composite channel itself). It should look like this:
redchannel 20070919 185439 Turn 2 D images into 3 D masterpieces!!

You should see the full color image in the document window but what you’re about to do will only affect the Red channel.

Go Filter>Distort>Displace… and enter 20 in the Horizontal Scale field and 0 in the Vertical Scale field and click OK.
displace 20070919 185542 Turn 2 D images into 3 D masterpieces!!
And that’s it! It’s in THREEEEEEEEEEEEE-DEEEEEEEEEE!!!
3Dtiki 20070919 185617 Turn 2 D images into 3 D masterpieces!!

Still need more 3-D stimulation?

Check these anaglyphs on Flickr.

Do you just need to buy some 3-D glasses? I bought mine here.