Easter Eggs
Easter eggs are traditionally hidden confections. Often programmers will
put these in software for users to find or stumble on and give amusement. In
this activity you will learn how to make a hidden Easter egg for your site
for your guests to find.
You will need one of the following image for your Easter egg
  1.
Open a new image by clicking file=> new. Set the size to 100 by 100, RGB
72ppi, white. 2. Insert a new layer. Click edit=> fill. Set the fill to
50% gray, normal, 100%.
3. Click filter=>render=> Lens flare. Set the lens flare to 115%
50-300mm.
 4.
Click Filter=> Distort=> Polar coordinates.
- Set from polar to rectangular.
5. Click Edit=>transform => flip vertical. 6. Click Filter=> Distort=>
Polar coordinates.
- Set from rectangular to polar.
7. Select the Elliptical marquee tool. Set it to a fixed size of 100
pixels by 100 pixels and click in the upper left hand corner. Add a layer
mask on this layer by clicking the add layer mask button on the bottom of
the layers panel.
Right click on the layer mask and select Apply layer mask. 8.
Click Edit=> Transform=> Scale. Set the width value to 70% and apply.
9. Set your rectangular marquee to a fixed size of width = 100,
height=40 pixels. Click in the lower left hand corner of the image.
 10.
Click edit=> Transform=>scale. drag the center bottom handle up until
the height measurement is about 75%. Apply the transformation.
11. Click Select => All. Click Edit=>Cut. Hold your shift key and click
Edit=> Paste to center the image. 12. Control click the egg shape layer.
Insert a layer. Set the layer to overlay mode, 50% opacity. Select
your gradient tool, set to reflected gradient with the preset spectrum
gradient. Darw a gradient from the center of the egg to the lower
right of the eggs edge.
13. Click layer=> Merge down. Right click on the colored egg layer and
select duplicate layer. Repeat this. Rename the three layers "egg", "egg ccw",
and "egg cw" 14. Click Select=>deselect if anything is selected. Click
on layer "egg ccw". Click Edit=>transform=>rotate. Set the angle to
-30 degrees and apply transformation.
Click on layer "egg cw". Click Edit=>transform=>rotate. Set the angle
to +30 degrees and apply transformation. 15. Control click the "egg"
layer. Insert a new layer on top of all these layers. Turn off the
"egg ccw" and "egg cw". hit your d key to set the color black as
foreground. Select your shape tool, set to the following shape
options:
- fill pixels
-
 boom1
- shape
- opacity=100
- anti alias checked.
Draw a boom shape on the new layer over the top third of the egg shape.
If the shape goes outside the egg shape, it wont show because it is not
within the selection so not to worry
 16.
Duplicate the shape layer. Using a narrow hard brush 1 pixel hard on
the copy to extend the lines out, jagged and some branching.
Duplicate this layer. 17. Open your chick image. click image=>
mode => RGB. crop your image near your chick so resizing for your
egg is easy. Click Imge => Image size. set the height to 50 pixels,
constrain proportions.
18. Drag a copy of your image to your egg canvas. Use your lasso tool
with no feather to select the chick. Hit your add a layer mask button on the
bottom of the layers panel. Make your adjustments on the mask and then right
click on the mask and select apply layer mask.
 19.
Control click the first shape layer. Click back on your chick layer
on top. Click the add layer mask option. Duplicate this layer. 20.
On the mask square of the chick copy layer. use a black color on
your brush and paint out the TOP above the opening to reveal the
chick head in front of the back side of the hole. 21.
Click save and save as egg.psd. Turn the eye off on all layers and
switch to image ready by clicking the button on the bottom of the
tool bar.
 22.
Click on the slice palette. Set the image name to egg and the URL to
where you want the egg to link to. Open the rollovers palette. click
Create Rollover State. With the rollover state active, switch to the
animation panel. 23. Duplicate current frame 8 times so you have a
total of 9 frames. Follow the list below for what layers should be
on for each frame and set the corresponding time.
| frame number |
contents |
time |
| Frame 1 |
blank, |
0 seconds |
| Frame 2 |
"egg" |
0.2 seconds |
| Frame 3 |
"egg CCW" |
0.2 seconds |
| Frame 4 |
"egg CW" |
0.2 seconds |
| Frame 5 |
"egg" |
0.1 seconds |
| Frame 6 |
"egg" and "shape" |
0.1 seconds |
| Frame 7 |
"egg" and "shape copy" |
0.1 seconds |
| Frame 8 |
"egg" plus "shapecopy" plus
"chick" |
0.1 seconds |
| Frame 9 |
"egg:" plus "shapecopy"plus "chickcopy" |
10 seconds |
 24.
Set the animation to play once at the bottom of frame 1. 25. Click
on the optimize panel. Set optimize to
- format= gif
- lossy=0
- Adaptive colors
- 64 colors
- No dither
- transparency
 26.
Click File=> Save Optimized. Set to images and html. save in the same
location you saved your psd. This will create a file called egg.html and an
images folder with two images in it.
 27.
Open a notepad. Use the notepad set to all file types to open the
egg.html. You will see a code in the head of the document that
will need to be copied exactly as is into the head of the
document you plan on putting this mouse over egg.
The script is
contained withint the tags labeled
<!--ImageReady Preload Script--> and <!--End Preload Scrippt -->
 28.
Between the body of the html you will see html code that is
between Image Ready slices tags. Copy this code into your HTML
document where you want to put your Easter egg. Your all done!
|
