Abdur Rahim jAnTu

Disaster unfolds slowly in the Gulf of Mexico

2010-07-02T16:23:00.001+06:00

In the three weeks since the April 20th explosion and sinking of the Deepwater Horizon oil rig in the Gulf of Mexico, and the start of the subsequent massive (and ongoing) oil leak, many attempts have been made to contain and control the scale of the environmental disaster. Oil dispersants are being sprayed, containment booms erected, protective barriers built, controlled burns undertaken, and devices are being lowered to the sea floor to try and cap the leaks, with little success to date. While tracking the volume of the continued flow of oil is difficult, an estimated 5,000 barrels of oil (possibly much more) continues to pour into the gulf every day. While visible damage to shorelines has been minimal to date as the oil has spread slowly, the scene remains, in the words of President Obama, a "potentially unprecedented environmental disaster."

Seawater covered with thick black oil splashes up in brown-stained whitecaps off the side of the supply vessel Joe Griffin at the site of the Deepwater Horizon oil spill containment efforts in the Gulf of Mexico off the coast of Louisiana Sunday, May 9, 2010. (AP Photo/Gerald Herbert)

A tugboat moves through the oil slick on May 6, 2010 in the Gulf of Mexico. (Michael B. Watkins/U.S. Navy via Getty Images) #

Oil burns during a controlled fire May 6, 2010 in the Gulf of Mexico. The U.S. Coast Guard is overseeing oil burns after the sinking, and subsequent massive oil leak, from the sinking of the Deepwater Horizon oil platform off the coast of Louisiana. (Justin E. Stumberg/U.S. Navy via Getty Images) #

Dark clouds of smoke and fire emerge as oil burns during a controlled fire in the Gulf of Mexico, May 6, 2010. The U.S. Coast Guard working in partnership with BP PLC, local residents, and other federal agencies conducted the "in situ burn" to aid in preventing the spread of oil. (REUTERS/Mass Communication Specialist 2nd Class Justin Stumberg-US Navy) #

The crew of a Basler BT-67 fixed wing aircraft releases oil dispersant over parts of the oil spill off the shore of Louisiana in this May 5, 2010 photograph. (REUTERS/Stephen Lehmann/U.S. Coast Guard) #

A pod of Bottlenose dolphins swim under the oily water Chandeleur Sound, Louisiana, Thursday, May 6, 2010 in the Gulf of Mexico. (AP Photo/Alex Brandon) #

Winds cause ripples to form on the water of grassy marsh wetlands in St. Bernard Parish, Louisiana, as work continues to try to protect it from the massive oil spill on May 9, 2010 in Gulf of Mexico. (Joe Raedle/Getty Images) #

A worker with one of the shoreline clean-up crews deploys a snare boom on the west side of the South Pass near Port Eades, Louisiana May 11, 2010. (REUTERS/Sean Gardner) #

A man holds a plastic bag with seawater and oil from the Gulf of Mexico oil spill south of Freemason Island, Louisiana May 7, 2010. (REUTERS/Carlos Barria) #

An oil-stained cattle egret rests on the deck of the supply vessel Joe Griffin at the site of the Deepwater Horizon oil spill containment efforts in the Gulf of Mexico off the coast of Louisiana, Sunday, May 9, 2010. (AP Photo/Gerald Herbert) #

Oily water is seen off the side of the Joe Griffin supply vessel at the site of the Deepwater Horizon oil spill containment efforts in the Gulf of Mexico on Saturday, May 8, 2010. (AP Photo/Gerald Herbert) #

A helicopter takes off from the helipad of the Development Driller III, which is drilling the relief well at the site of the Deepwater Horizon oil spill, in the Gulf of Mexico on May 11, 2010. (REUTERS/Gerald Herbert) #

Oil washes onto the sides of a 100-ton concrete-and-steel pollution containment chamber as the mobile offshore drilling unit Q4000 lowers it into the water at the Deepwater Horizon site on May 6, 2010 in the Gulf of Mexico . The chamber was designed to cap the oil discharge that was a result of the Deepwater Horizon incident. (Patrick Kelley/U.S. Coast Guard via Getty Images) #

The single cable supporting the 100-ton oil containment device being lowered to the sea floor disappears into Gulf waters off the side of the Q400 mobile drilling platform on Sunday, May 9, 2010. Efforts to contain the leak with the device were unsuccessful due to ice crystals forming in its domed roof. (AP Photo/Gerald Herbert) #

One of the New harbor Islands is protected by two oil booms against the oil slick that has passed inside of the protective barrier formed by the Chandeleur Islands, as cleanup operations continue for the BP Deepwater Horizon platform disaster off Louisiana, on May 10, 2010. (MARK RALSTON/AFP/Getty Images) #

Workers attempt to secure an oil boom into place in an effort to protect the coast line from the massive oil spill near Hopedale, Louisiana May 10, 2010. (REUTERS/Sean Gardner) #

Blobs of oil from the massive spill float on the surface of the water on May 5, 2010 in Breton and Chandeleur sounds off the coast of Louisiana. (Joe Raedle/Getty Images) #

Crews build a sand berm to protect the island from the potential of oil washing onshore, on Dauphin Island, Alabama May 10, 2010. (REUTERS/Brian Snyder) #

Unemployed commercial fishermen and their families wait in line to receive handouts from New Orleans Catholic Charities on May 5, 2010 in Hopedale, Louisiana. Many local fishermen have been temporarily shut down but have been hired by British Petroleum (BP) to lay oil booms in sensitive areas. (Sandy Huffaker/Getty Images) #

Captain Johnny Bourgeois and deckhand Chris Crappel (left) of Venice, Louisiana retie netting for shrimp trawling as they wait for the shrimp season to reopen in Venice, Louisiana May 9, 2010. Louisiana Department of Wildlife and Fisheries (LDWF) Secretary Robert Barham announced that the shrimp season in the territorial seas of the central coast of Louisiana from Four Bayou Pass to Freshwater Bayou were closed effective sunset Saturday. (REUTERS/Sean Gardner) #

Louisiana National Guard Private Dallas Bacon guides a dump truck as they use dirt to create an earthen barrier as they try to protect an estuary from the massive oil spill on May 10, 2010 in Lafourche Parish, Louisiana. (Joe Raedle/Getty Images) #

Louisiana National Guardsmen use Blackhawk helicopters to build a dam to protect the fragile wetlands known locally as "Bayou" near the town of Grand Isle, as work continues to protect the coastline from oil after the BP Deepwater Horizon platform disaster off Louisiana, on May 11, 2010. (MARK RALSTON/AFP/Getty Images) #

Mississippi River water (left) meets sea water and an oil slick that has passed inside of the protective barrier formed by the Chandeleur Islands, off the coast of Louisiana, on May 7, 2010. (MARK RALSTON/AFP/Getty Images) #

Oil from the Deepwater Horizon oil spill makes its way to shore on Chandeleur Islands in Louisiana on May 7, 2010. (AP Photo/The Dallas Morning News, Vernon Bryant) #

An aerial view of the northern Chandeleur barrier islands shows sheens of oil reaching land, Thursday, May 6, 2010 in the Gulf of Mexico. The islands rest 20 miles from the main Louisiana coastline. (AP Photo/David Quinn) #

Danene Birtell and Dr. Erica Miller of Tristate Bird Rescue and Research and Heather Neville rinse off an oiled brown pelican which was captured on a barrier island off the fragile Louisiana coast on Tuesday, May 4, 2010 at a triage center in Fort Jackson, Louisiana. (MIRA OBERMAN/AFP/Getty Images) #

This image provided by NASA shows the Mississippi Delta (top right) and the growing oil slick in the Gulf of Mexico on May 5, 2010. Photo was taken by International Space Station Expedition 23 flight engineer Soichi Noguchi. (AP Photo/NASA - Soichi Noguchi) #

Oil and oil sheen are seen moving past an oil rig, top right, in the waters of Chandeleur Sound, Louisiana, Wednesday, May 5, 2010. (AP Photo/Eric Gay) #

Steve Henne, of Marine Spill Response Corp., heads back to the Premier Explorer after a controlled burn in the Gulf of Mexico May 6, 2010. The U.S. Coast Guard working in partnership with BP PLC, local residents, and other federal agencies conducted the "in situ burn" to aid in preventing the spread of oil following the April 20 explosion on Mobile Offshore Drilling Unit Deepwater Horizon. Picture taken May 6, 2010. (REUTERS/Mass Communication Specialist 2nd Class Justin Stumberg-US Navy) #

An oil soaked bird struggles against the oil slicked side of the HOS Iron Horse supply vessel at the site of the Deepwater Horizon oil spill in the Gulf of Mexico off the coast of Louisiana Sunday, May 9, 2010. (AP Photo/Gerald Herbert) #

An aerial view of the oil leaked from the Deepwater Horizon wellhead, May 6, 2010. (REUTERS/Daniel Beltra) #

Dark clouds of smoke and fire emerge as oil burns during a controlled fire in the Gulf of Mexico May 7, 2010. (U.S. Navy photo by Mass Communication Specialist 2nd Class Justin Stumberg/Released) #

Bruce Padilla, left, and Adam Shaw, Louisiana oilfield divers, return through blackened seawater from watching a controlled oil burn in the Gulf of Mexico May 7, 2010. (U.S. Navy photo by Mass Communication Specialist 2nd Class Justin Stumberg/Released) #

Boom to protect Louisiana's fragile wetlands is put into place on Lake Machias on May 9, 2010, following a massive oil spill that is threatening the state's coastal islands. (Alex Ogle/AFP/Getty Images) #

Oil, scooped up with a bucket from the Gulf of Mexico off the side of the supply vessel Joe Griffin, coats the hands of an AP reporter at the site of the Deepwater Horizon oil spill in the Gulf of Mexico, May 10, 2010. (AP Photo/Gerald Herbert) #

Shrimp boats are used to collect oil with booms in the waters of Chandeleur Sound, Louisiana, Wednesday, May 5, 2010. (AP Photo/Eric Gay) #

Sunset, seen over wetlands outside of Venice, Louisiana on May 5, 2010. (REUTERS/Carlos Barria) #

Risers, the outer casings of oil drill pipes, are seen on the deck of the service vessel Joe Griffin as it prepares to head to Port Fourchon at the site of the Deepwater Horizon oil spill in the Gulf of Mexico on May 11, 2010. (AP Photo/Gerald Herbert) #

Capt. Demi Shaffer pilots the Joe Griffin as it enters the Gulf of Mexico carrying the containment vessel to the rig collapse site which will be used to try to contain the Deepwater Horizon oil, Wednesday, May 5, 2010. (AP Photo/Gerald Herbert) #

2010-04-26T00:57:00.001+06:00

THInkInG Is jUsT A Waste of Time? SO Don't ThInK JUST Do iT.

Eleven to take on the world

2010-04-01T15:14:00.001+06:00

Eleven to take on the world

Posted using ShareThis

2010-03-23T16:59:00.001+06:00

Shahid Afridi named Pakistan captain - http://shar.es/mfVw4

2010-03-23T16:57:00.001+06:00

Shahid Afridi named Pakistan captain | Cricket News | ICC World Twenty20 2010 | Cricinfo.com http://shar.es/mfVw4

2010-03-14T20:51:00.001+06:00

http://ping.fm/7cpe8

How to Create a Slice of Nature Photo Manipulation

2009-06-23T23:18:00.004+07:00

Step 1

To begin with we need to prep the files. This is the part that designers dread, or at least I do.

First off, I started with the tree as I knew it was going to be the most time consuming. Everyone has their own tricks and tools that they like to use when extracting an image.

For the tree I used a two part approach. For the base and limbs I used the Pen Tool zoomed in to 400% and as many points as I needed. You can see that I try to cut the fuzzy edge of the image to give it a clean look.

Once you are finished with your path you can use it to create a mask. With the Pen Tool right-click on the finished path and select make selection. Set the feather radius to 0 and make sure that Anti-aliased is checked.

Then with the selection active click on the add layer mask button.

Step 2

For cutting out the foliage, I took a different approach. Using the Pen Tool would have been too time consuming. First duplicate the "tree" layer. Next desaturate by clicking Image > Adjustments > Desaturate (Command +Shift + U).

Next we'll to try to make the foliage as dark as we can. Do this by adjusting the levels. Go to Image > Adjustments > Levels (Command + L). Click on the set black point eye dropper and then click on the lightest part of the foliage. You can keep trying different points until you get the foliage almost black.

After the levels adjustment, use color range to select just the black foliage. Go to Select > Color Range. I like to set the selection preview to Grayscale for this, it can make it pretty easy to tell how your selection looks. Make sure Select is set to Sampled Colors, then use the Eyedropper Tool to select the black foliage. Adjust the fuzziness slider until only the foliage is selected.

Once you have created your selection, simply delete the grayscale copy. Then invert your selection by going to Select > Inverse or Command + Shift + I. Select a decent sized (I used 60px) hard brush and click on your mask. Now use the brush to paint around the foliage, adjusting the size of your brush so you don't mask out any of the tree itself.

Once you're done carefully painting in your mask, it's time for some touch-up work. When you use a system like this the selection is never going to be perfect. The only real solution is to go through with a small brush and touch up any imperfections.

As you can see, I used a hot pink background layer below my tree so that it is easy to see where I have missed on the mask. I usually use a three layer system: 1 high contrast (usually hot pink because nothing in nature is usually hot pink), 1 white, and 1 black. This way I can turn on and off the various backgrounds to make sure that the final product looks good.

After the mask is completed, you can use the mask to select the object and drop it into your composition. Simply Command-click on the mask in the layers palette to make a selection. Then click on the main tree in the layers palette, and either Edit > Copy or Command + C to copy. Go to you main composition and Edit > Paste or Command + V to paste it.

This is really the only image that we need to do a serious cut job on. The rest will be taken care of as we move through the composition.

Step 3

Let's work on the composition now. The first thing we want to do is create the background. I find that illustrations come together better with a background than on a blank canvas.

Start a new file with an A2 canvas (420mm x 594mm). Create a new layer folder named "Background." Open the cracked earth photo, copy it, and paste it into the "Background" layer folder. Rename the layer "Soil."

We are going to set the horizon line at about the center of the canvas. Hit Command + T to transform the "soil" layer. We need to resize the layer and give it some perspective so that it looks like actual ground.

Right-click anywhere on the canvas and choose Perspective. Pull the top anchors towards the center of the canvas, this will shrink the top of the image while leaving the bottom the same size giving the illusion of a horizon. Your goal here is to match the perspective to that of the slice of soil we are using for the base of the tree, as shown below.

Step 4

Now we will enhance the illusion of the ground running away from us. First we are going to add some lens distortion at the very bottom of the image. Duplicate the Ground layer by clicking Command + J or drag the layer in the layers palate down to the New Layer icon. Rename this layer "Ground Lens Blur," then go to Filter > Blur > Gaussian Blur. Set the radius to something small around three as we don't want the blur to be too pronounced.

After applying the blur we need to mask out all of the area that we don't want to have the blur. Make sure that you have the "Ground Lens Blur" layer selected and then click on the layer mask button at the bottom of the layers palette.

Press D to set the colors to default (black and white) and click on the Gradient Tool. Make sure you have the linear gradient selected. Click on the layer mask and draw a thin gradient going from white to black from the bottom of the layer to the top, your mask should look like the image below.

And the ground should now look like the following image.

Step 4

Now we are going to desaturate the ground as if it's going away from the camera. Duplicate the original "Ground" layer again and name this one "Ground Desaturate." Desaturate the layer by going to Image > Adjustments > Desaturate (Command + Shift + U).

Now create a mask for this layer like we did for the "Ground Lens Blur" layer. Use the Gradient Tool again to create a gradient in the opposite direction right along the horizon.

Set the "Ground Desaturate" layer to 72% Opacity. Your ground should now look like the following image.

Step 5

Now we are going to darken the ground at the horizon to match the dark sky. Create a new layer and name it "Ground Darken." Command-click on the "Ground" layer. Use this selection to create a fill in the "Ground Darken Layer."

Fill the selection with the color #463221, this is a dark color selected from the shadows of the cracks in the image. Alt-click on the mask of the "Ground Desaturate" layer. This will show you the actual mask.

Command-click on the Layer Mask on the "Ground Desaturate" layer, then select the "Ground Darken" layer and click on the Create Layer Mask button. This will create a mask identical to the mask on the "Ground Desaturate" layer. Your image should now look like that shown below.

Step 6

Now we will add the sky. Open up the sky image and copy and paste it into the "Background" layer group. Place it below all the ground layers. We want to resize it so that it fits the width of the image. Then flip it horizontally by using Command + T, then right-clicking on the image and choosing Flip horizontally. Then we are going to mask out the little dangling cloud on the bottom-right of the image.

Just create a mask for the layer, and paint out the cloud with a large, soft brush. Using the same brush, fade out the rest of the bottom of the image. It should look like the image below.

Create another layer below the clouds and name it "sky." Fill it with the color #161a23, as shown.

Step 7

Now we are going to add in the slice of soil. Create a new Layer Group name it "Soil." Open up the parsley pic and copy and paste it into the "Soil" layer group. Normally I would take this pic and cut it out, but for this I want to preserve the shadow from the original. To do this, I set the layer mode to Multiply.

Next, we are going to mask out the layers below it so that the white background will show through. Set the Layer Blend Mode on the "Dirt" layer to Multiply. Go ahead and erase the parsley stalks from the top with an eraser.

Now to mask out the background so the cracks don't show through the dirt and roots. Click on the "Background" layer group and click the Create Mask button.

Use a hard brush to paint black on the mask to mask out the background. You want to pay the most attention to the front sides and the roots. For the roots zoom in tight (400%), and make sure you stay inside the lines. If you make a mistake hit X to switch to white and just paint the background back in.

Step 8

Now we will add in the grass. Create a new Layer Group named "Grass." Open up the green hills pic and copy and paste it into the "Grass" layer group. Rename it "Grass." We want to shrink it down quite a bit so Command + T to transform it.

Shrink it down quite a bit, then right-click and choose Distort to change the perspective a bit. This takes a bit of playing around. What you want is to flatten out the hills a bit so that it looks more like rolling plains than just large hills. Experiment until you get something you like. I ended up with the image below (the crown of the hill will be masked out).

Now we need to mask out the unwanted parts of the grass. Create a mask on the "Grass" layer and paint out the unwanted areas with a hard brush. On the front sides try to follow the contours of the land as you mask. Play with it a bit until it looks natural, like a clean slice of the land.

Now we are going to paint a light shadow on the top of the soil beneath the grass. Create a new layer named "Dirt Shadow" in the "Grass" layer group. Place it below the "Grass" layer, this will let you paint on it without worrying about going over the grass. With a medium sized soft brush paint black on both of the faces just below the grass. Set this layer to Multiply and a medium Opacity (I have it at 57%).

Step 9

Now for the main focus of the illustration - the tree. This is where we are really going to focus a lot of our efforts, as this makes up the bulk of the illustration. Create a new layer group named "Tree." Open your masked tree image. Command-click on the mask, copy and paste the tree into the "Tree" layer group. Rename this layer "Tree."

If you notice any faint haloing around the image (small bands of light or dark) you can use defringe to clean it up. Go to Layer > Matting > Defringe and set the width. Experiment with a couple different widths to see which you like. I chose a width of 2.

Now we need to change the perspective of the tree. I wanted the tree to look like it was leaning forward a bit, not only to match the perspective of the piece, but also to accentuate the intertwined limbs at the top. Use transform to resize and then right-click to choose Perspective.

I always try to go smaller with the Perspective tool, than bigger because you can end up with some pretty pixely looking images by increasing the perspective too much. Grab one of the bottom handles and move it towards the center of the canvas, this will make the tree look like it is leaning forward. Find a look that you like.

Step 10

Now we need to mask out the bottom of the tree a bit so that it blends better with the grass below. Make sure that the "Tree" layer is active and click on the Create Layer Mask button. Load the Natural Brushes up and choose the very first brush (the 12px one), and set the Opacity to around 50%.

Now brush away at the bottom of the tree where it meets the grass. The idea is to create the illusion of grass growing up and around the base. You should only do a slight fringe as the tree is much larger in proportion to the grass.

Step 11

Now we are going to add a bit of moss growing up the tree. Create a new layer in the "Tree" layer group. Choose the Clone Tool and select the same brush that we just used for creating the mask at the base of the tree with the same Opacity.

Make sure that Align and Sample All Layers are checked. Alt-click to chose the grass as your source, then paint some moss onto the base of the tree. You want it to be thicker at the bottom and thin out towards the top. Also don't paint with long strokes, instead just click repeatedly to build up the texture.

Step 12

Now we will add a curves adjustment layer to beef up the contrast a bit. Always use adjustment layers when you can. They will allow you to change the settings and look of layers, if you change your mind. Command-click on the "Tree" layer to make a selection.

By doing this the new adjustment layer will automatically have a mask so that it applies to only the selection. Go to Layer > New Adjustment Layer > Curves. We are going to lower the light level a bit and bump the contrast just a tad. To lower the light lever, grab the upper-right hand corner of the curve and pull it down.

To bump the contrast, you want to create a mild S-curve with an upward hump in the right third and a downward hump in the left third. This another spot to play with your settings until you get it exactly how you like.

And your image should now look something like this.

Step 13

Now we are going to bump up the highlights and shadows even more. Create another layer above the Curves Adjustment Layer. Alt-click on the New Layer button, this will bring up the new layer dialog box. Name the layer "highlights and shadows." Set the blending mode to Overlay and check Fill With Overlay-neutral Color (50% Gray)

Now we are going to paint some highlights and shadows onto this layer. Choose a soft, round brush and set it to a low Opacity (around 10%). Press D to make sure your default colors are selected. You are going to use black to enhance the shadows and white to enhance the highlights. You can easily switch between the two colors by hitting X. This is where it pays to think artistically, you want to play up certain features of the image here. Again experimentation is the key.

Step 14

Now we are going to make it look like the clouds on the left are enveloping the top of the tree. Create a new layer (not inside any of the layer groups) and name it "Front Cloud."

Select the Clone Tool and choose a soft, round brush set to about 50% Opacity again, and make sure that Sample All Layers is still checked. Look at your image and decide where you want the cloud to come out in front of the tree. Now click on the eye icon next to the "Tree" layer to hide it. This allows you to clone the clouds without worrying about picking up any of the tree.

When doing something like adding clouds, the secret is to constantly resample so that you don't have artifacts that repeat over and over. Again an artistic eye is important here. You want your clouds to look like real clouds. Keep clicking your tree layers on and off so you can see how the cloud looks in relation to the tree. Once you're done, you should have something like the image below.

As you can see, I painted in some of the darker background cloud also. Now we want to mask out some of the clouds we created so the tree shines through. Create a mask on the "cloud" layer.

Use a soft, 100% opaque brush to paint the tree back in over the darker part of the clouds. Do the same with a few of the tips of the foliage. Then turn the Opacity down to around 10% and paint over some spots in the clouds a bit to make them look thinner. Eventually you should have something like the image below.

Step 15

Now to add some rain off the cloud. There are as many techniques for creating rain as there are photoshop users. This is one way to do it that is pretty quick. Create a new layer and name it "Rain."

Create a square selection (the selection doesn't need to be huge, as we only need a bit of rain) on the layer and fill it with 50% gray (#808080). Go to Filter > Noise > Add Noise. Set the amount to 12 and make sure Monochromatic is checked and Gaussian is chosen.

Set the layer mode to Screen. Now go to Filters > Blur > Motion Blur. Set your distance to 17 and your angle to -69. This will give your rain a slight left to right path.

Go to Image > Adjustments > Levels. Here you want to push both the white and black sliders so that they are right at the edge of the curve. This will make the rain more pronounced.

Now we just need to mask out the area we don't need. I also turned down the opacity some (72%) to make it look a bit more realistic.

Step 16

Next we are going to add the river that flows out and around the tree. Open up the river image and copy and paste it into the main image. Hit Command + T to transform it, right-click and choose Flip Horizontal. We want the river to look like it is coming around the right side of the tree. Fool with the perspective a bit to so that it looks like it is laying flat along the land.

Now create a mask on the "River" layer and use a soft edged brush to mask out the sides of the river. Try to leave a bit of the rocky shoreline intact so that it still looks like a river. The soft brush will help the river rock blend over into the grass.

Then we are going to mask out the front of the river so that it looks like it ends with the end of the land. Use an 80% hard brush to do this, so you get a pretty clean edge. Try to cut it relatively straight along where the edge of the grass is. Don't worry if your grass shows a bit as we'll be covering it up later.

Next we need to fix up the front-left shoreline a bit and extend the water there as well. We will use pretty much the same technique as we did with the clouds.

Create a new layer called "Shoreline." Pick the Clone Tool and a soft 50% brush. Now clone the rocky shoreline along the front-left, down to the edge of the soil. Clone in the water also.

Next we need to soften up the outermost edge of the rocky outcropping. Work along it with the clone brush until it blends naturally into the grass. I also cloned in some of the scrubby bushes from farther up the shoreline.

Step 17

Next we need to create the cutaway of the water. Create a new layer called "Underwater." Using the Lasso Tool or Pen Tool to create a selection for the cutaway of the water. Fill it with the color #43605e (selected from the water).

Create a mask for the layer. Get the 12px natural brush that we used for masking out the bottom of the tree and use it to mask out the edges of the underwater a bit so that you are creating an underwater shoreline.

Now we need to darken it up a bit so it looks like underwater. Create another layer called "Underwater Shadow." Set it to Overlay and about 75% Opacity. Command-click on the "Underwater" layer so that the water is selected. Then paint over it with a soft 25% Opacity brush set to Black. You want the water to get darker as you move down and away.

Step 18

Now for the last part of the illustration - the waterfall. Create a new layer group named "Waterfall." Open up the waterfall pic. Using the Lasso or Pen, make a selection around the waterfall. This selection doesn't have to be to accurate, just close enough to get most of the background out.

Copy the selection and paste it into the "Waterfall" layer group and rename it "Waterfall 1." We are going to put the waterfall right at the crook of the tree where the rain is falling. Set the blending mode to Lighten and lower the opacity just a bit (82%).

Set the top of the fall where you want it. Now with a mask and soft brush, mask out the unwanted parts so that it appears to be behind the tree. Repeat the same procedure in the middle of the tree and down at the base flowing into the river, adjusting the size and opacity as needed.

Now we'll add some little splashes at the bottom waterfall. Create a new layer named "Splashes." Set the mode to lighten. Use the Clone Tool (with the same 12px Natural Brush) to clone some bits of the waterfall to create some water splashing off the fall and some white water from the falls hitting the river. This effect should be pretty subtle.

Image Tweaks and Adjustments

Now its time for adjustment layers to give the image a little extra oomph and then we should be done. First here is the full-size image without any adjustments.

Add a gradient adjustment to "layer 1." Set the Color to 39% Opacity. This is the Chrome gradient. Mask out the entire layer then brush in the edges with a soft brush. This adds some interesting colors around the edge that set off the piece.

Add a Warming (81) Photo Filter set to Normal 45%, which obviously warms the piece a bit.

Add a Hue/Saturation Normal 100%, which punches up the colors a bit, especially the ground in the foreground - makes it pop.

Add Curves Normal 100% - to up the contrast.

Add a Gradient Map (Medium Spectrum) with Soft Light 100%. Completely mask and brush back in at the edges. Again this adds a little color and highlights around the edges.

I like using off-color gradient maps and then just making them barely visible around the edges. I think it can help push the focus of the image a bit. I think bumping the colors a bit and upping the contrast helps too. But steps like this are all about preference and look and what feels right.

From here you could add a texture to the image or up the surrealism with some insects crawling around on the tree. You could even add a boat to the river or maybe some small animals to the grass.

Conclusion

I hope you enjoyed the tutorial, as much as I did creating the image. Remember this wasn't just to show you how to do this image, but how to think and work to create your own images. Have fun creating!

Abdur Rahim Jantu
Community Manager at dotnetshoutout.com
of Operations at kigg.com
Mobile : +880-1714-246603

jantuR CSS Frameworks Lab.“hurry-up and be creative” demands of the graphic design industry.

2009-05-27T21:22:00.001+06:00

Easy Menu in Minimalist Style

In this Photoshop tutorial we’ll be designing an easy menu in minimalist style.

Now we’re going to make a background. Create a new document in Photoshop, something like 500×300 pixels and drag a linear gradient with colors of #ffffff and #d5dfe0.

Alright, now I would like to create a window to see how the future menu buttons will be situated. Select the Rounded Rectangle Tool (Radius: 7 px) and make a shape like on a picture below using white color:

After that apply Outer Glow, Inner Glow and Stroke layer styles to this layer:

You can see the result:

Ok, now we can begin the main part of tutorial creating the menu. First of all I would like to create some substrate under the buttons. Select Rounded Rectangle Tool (Radius: 7 px) again and draw a rounded rectangle onto your canvas as on picture below:

Then apply the Outer Glow layer style for this layer:

And now our substrate should look like this one:

I think the time to create the button. Select Rounded Rectangle Tool (Radius: 5 px) again and draw a rounded rectangle like mine:

After that apply Inner Shadow, Gradient Overlay and Stroke layers style to this button:

Your picture should look as mine:

Time to bring some glare to the button. Find and get out the Pen Tool and make the shape as below using white color:

Click the Layer Thumbnail in the Layers Palette and chose Rasterize Layer. After that apply Quick Mask Mode with gradient as below:

Then go back to Standard Mode. Now we have some selected area. Press Delete to clear image into the area.

Then press Ctrl+D to deselect area. After that go to the button layer and apply Select > Load Selection, then apply Select > Modify > Contract to contract the selection about 1 px and press Ctrl+Shift+I to invert selection. After that go back glare layer and press Delete to clear selected area. Press Ctrl+D to remove selection and change layer opacity to 60%.

Looking good, isn’t it? Ok, duplicate this layer with Ctrl+J, after that select the Rectangular Marquee Tool (Feather: 2px) and create the selection like on picture below:

Press Delete to clear the chosen area, remove the selection with Ctrl+D, then move this layer 1 px down.

The next step that we need to do add two lines to the menu button. Get out the Pencil Tool and draw two lines like on my picture:

The color I’ve used above for lines #e5f3ff. To finish the menu I think we should add some title to the button. You can do this with Horizontal Type Tool. I’m going to use Myraid Pro (Semibold Condensed, 15 pt, Crisp) font with is commercial, that’s why you can try the different one or get it somewhere.

To make the button title more contrast apply the Drop Shadow layer style for this layer:

To get something like this:

Good! Now I would like to add a couple of buttons more to get the real menu.

That is it for now! Hope this tutorial was interesting and useful for you!

Abdur Rahim jAnTu
Community Manager at kigg.com
Mobile : +880-1714-246603
E-mail : abdurrahim@dotnetshoutout.com ,bossjantu@hotmail.com
Website : privatebeta.dotnetshoutout.com

HTML, CSS

2009-05-27T20:16:00.005+06:00

Div A Before Div B

I currently have div B before div A in the HTML, and div B has float. I want to reproduce this, but with div A before div B in the HTML.

As long as both div B and div A have fixed widths, which when added together is less than or equal to the width of its parent, then it doesn’t matter which of them comes first in the HTML!

Equally important to mention is that if div A and div B do not have a fixed with, then they should, because floating elements without widths is a recipe for trouble.

Position Absolute With Text Wrap?

This is an interesting one. Of course we can position a div to the bottom-right with absolute positioning as described above. But as soon as we do that, the div is “removed from the flow” of the document, meaning that regular text in the parent div will ignore its placement and go right over it.

I’m struggling to think of a really great solution for this… So if anyone has something, please share it in the comments. One short-term, hacky solution would be to force some sensibly placed line breaks in the text at the bottom that would make it seem like it’s wrapping at default font sizes. Or place the image inline and floated to the right, but in the middle of the text, towards the bottom of it.

cricket

2008-10-02T20:00:00.006+06:00

Paul Adams announces retirement

Boss jantur News

October 2, 2008

Start the blender: Paul Adams stunned world cricket when he first came onto the scene

Paul Adams, who burst onto the international scene after only five first-class matches for Western Province in 1995-96, has announced his retirement from professional cricket.

A chinaman bowler with a unique action, famously described as resembling "a frog in a blender", he took eight wickets on his Western Province debut against Northerns, earning him a call-up for South Africa A against England where he took 9 for 181 in the match. Six weeks later he became the youngest person to play for South Africa when picked for the Boxing Day Test at Port Elizabeth. He took eight wickets in the last two Tests of the series as South Africa won 1-0.

Adams bamboozled batsmen in his early appearances, but his effectiveness diminished with familiarity. In his first three series he took 31 wickets at 25.06 but he was rarely as effective again.

He was further hampered by injuries, while always prone to the occasional bad ball and as these became more frequent he was seen by the selectors as too much of a gamble. Even at provincial level, captains appeared reluctant to pick him and he drifted into the second tier of domestic cricket.

The last of his 45 Tests was at Hamilton in March 2004 where he took 2 for 118. He finished with 134 wickets at 32.87, and in all first-class cricket he took 412 at 32.66. His best return in Tests was 7 for 128 against Pakistan at Lahore in 2003-04.

Regards,
Abdur Rahim Jantu
Community Manager at dotnetshoutout.com
Mobile : 01714-246603
E-mail : abdurrahim@dotnetshoutout.com ,bossjantu@hotmail.com
Website : dotnetshoutout.com/About
privatebeta.dotnetshoutout.com
abdurrahimjantu.blogspot.com
bossjantu.spaces.live.com
jantus.wordpress.com
jentu.wordpress.com

Rehab say sorry Naughty boy George Michael !!!

2008-09-22T20:34:00.006+06:00

George Michael was Busted !!!

Naughty boy George Michael was Busted for drug possession this weekend in London.

The drug-toting singer released this for us all:

Regards,
Abdur Rahim Jantu
Community Manager at dotnetshoutout.com
Mobile : +880-1714-246603 off :Tribute Homes, Apt #C1 Gulshan-2
E-mail : abdurrahim@dotnetshoutout.com ,bossjantu@hotmail.com
Website : dotnetshoutout.com/About
privatebeta.dotnetshoutout.com
abdurrahimjantu.blogspot.com
bossjantu.spaces.live.com
jantus.wordpress.com
jentu.wordpress.com

Madona will always be Madona

2008-09-17T23:17:00.007+06:00

Talking about Madonna

View photos of Madonna's opening night of her Sticky & Sweet Tour

Madonna's Sticky & Sweet Tour - Opening Night
Madonna performs during the opening night of her Sticky & Sweet Tour in Cardiff, England, on Aug. 23, 2008.

Madona will always be Madona...

Madonna Louise Ciccone
Also known as Madonna Louise Veronica Ciccone Ritchie
Born August 16, 1958 (1958-08-16) (age 50)
Bay City, Michigan, United States
Origin New York City, New York, United States
Genre(s) Pop, rock

Dream Come True"

2008-09-13T13:52:00.009+06:00

Get the iPhone 2.1 Software Update for iPod touch. Learn more

iPod touch. Starting at $229.

Abdur Rahim Jantu
Community Manager at dotnetshoutout.com
of Operations at kigg.com
Mobile : +880-1714-246603
E-mail : abdurrahim@dotnetshoutout.com ,bossjantu@hotmail.com
Website : dotnetshoutout.com/About
privatebeta.dotnetshoutout.com
abdurrahimjantu.blogspot.com
bossjantu.spaces.live.com
jantus.wordpress.com
jentu.wordpress.com

youngster’s brain

2008-08-30T17:10:00.002+06:00

BoSs JaNtU Think Nokia n85 mobile can do to a youngster’s brain in 2 mins !!!

destined to be popular..

The Nokia N85 seems like the long-waited update of the popular N81 and given the features on board it’s almost destined to become a market success. Comparing the N85 to the Nokia N95 8GB, the gap doesn’t seem that big now, but you have got to remember that back in the day the N95 was the portfolio flagship, while this time that place is reserved for the long-awaited and seemingly overpriced Nokia N96. The Nokia N82 might be counted here too, but the dual slide design of the N85 tends to speak of a closer kinship to the first two N-series devices.

The Nokia N85 can even be counted as an upgrade to N95 8GB in some respects if it wasn’t for the smaller display - there’s the more compact size, the touch-sensitive Navi wheel, the more compact microUSB port, the supposedly better GPS chipset with 3-month worth of free navigation license and finally, there’s the FM transmitter. The Nokia N85 also has a microSD card slot with a pre-bundled 8GB memory card in contrast to the fixed-size memory of the N95 8GB.

Overall, the Nokia N85 will occupy a strong upper mid-tier market position and will probably be the next Nokia best-seller - the changes it brings are not revolutionary, but they are some fresh blood to the family. Simply said, the Nokia N85 is everything the Nokia N81 8GB should have been.

Nokia N85

Nokia N85 at a glance:

Successor of Nokia N81
Construction and design combine N81 design with a dual slider form factor
5mm thinner than Nokia N95 8GB (measures 103 x 50 x 16mm and weighs 128 grams)
2.6-inch QVGA (320 x 240) display with OLED technology
5 megapixel auto focus camera with dual LED flash, records VGA video at 30 fps
Dedicated multimedia/gaming keys
Touch sensitive Navi Wheel
Symbian S60 9.2 with the latest Feature Pack 2
Accelerometer sensor for auto screen rotation
Quad-band GSM, tri-band 3G with HSDPA
WiFi, stereo Bluetooth (A2DP)
GPS receiver with A-GPS support and Nokia Maps application (3-month free navigation license included)
microUSB port and 3.5mm audio jack
microSD card slot (ships with a 8GB card)
FM radio with RDS and FM transmitter
Stereo speakers
1200 mAh battery

We’ve already mentioned that the Nokia N85 is more compact than the N95 8GB. The slider mechanism feels sturdy and so is the whole construction. The bronze back panel has a glossy finish that adds to the looks of the device.

The 3.5mm audio jack and the microUSB port are place on the top of the body, while the uncomfortably placed keypad lock key seen in N81 has found a much better place on the right-hand side of the device.

The dedicated multimedia keys that get revealed when you slide the handset downwards serve the double purpose of gaming keys. Speaking of gaming, the N85 comes preloaded with 15 N-gage titles, however since there is an unlock code for only one, you’ll have to choose carefully which one you will get in a full version.

More of Nokia N85

At 2.6 inches, the Nokia N85 display is slightly smaller than the ones of N95 8GB and the N96, but its most novel feature is the OLED technology used. Nokia first used it on Nokia 7900 Prism and then on the Nokia Arte. The OLED display is supposed to give you lower power consumption, wider viewing angles and better contrast (black is more intense, for example).

Since we have up-close and personal experience with both the Nokia 7900 and the Nokia Arte, we can testify that the OLED displays sport some really nice color rendering. However, they are not as good in direct sunlight as all other transflective Nokia displays. It’s a downside that we find inadequate and we would gladly stick to the excellent TFT displays used by Nokia up so far. Let’s hope that the lower power consumption will make up for this con.

Here’s how the N85 display looks in direct comparison to the Nokia 6210 Navigator display. Unfortunately, the light conditions make the differences not that easy to spot.

The Nokia N85 OLEd screen directly compared to the TFT display of Nokia 6210 Navigator

The Nokia N85 has a 5 megapixel auto focus camera with Carl Zeiss optics and an active lens cover. Video recording is also commendable - VGA resolution at 30 fps seems enough for us, although point-and-shoot cameras are already taking it to the next level with HD recording, not to mention the high-speed videos of LG Viewty and LG Secret.

That being said, the only downside we find in the camera department is the lack of a xenon flash. Instead the N85 has a dual LED flash and an auto-focus assist light.

The camera is snappy but there are no significant changes to the camera interface - GPS image geotagging is among the few novel features here.

Here are several camera samples - bear in mind that those were taken with a pre-release unit, so improvement of the image quality is to be expected.

Nokia N85 camera samples

Nokia N85 first impressions

The Nokia N85 is an excellent performer with a full bag of features on board. It’s got pretty much every modern feature there is and there are no obvious compromises made feature-wise. The N85 has left us with nothing but good impressions and we are looking forward to taking a final unit for a spin.

Regards,
Abdur Rahim Jantu
Community Manager at dotnetshoutout.com
of Operations at kigg.com
Mobile : +880-1714-246603 off :Tribute Homes, Apt #C1 Gulshan-2
E-mail : abdurrahim@dotnetshoutout.com ,bossjantu@hotmail.com
Website : dotnetshoutout.com/About
privatebeta.dotnetshoutout.com
abdurrahimjantu.blogspot.com
bossjantu.spaces.live.com
jantus.wordpress.com
jentu.wordpress.com

Jantu'R Nokia World !!!

2008-08-28T14:55:00.004+06:00

Today Nokia introduced officially two new members of the Nseries family - Nokia N79 and Nokia N85. The two devices come with rather different designs but both have quite extensive specs sheets to brag about.

Nokia N85

Nokia N85 is a quad-band GSM and tri-band UMTS dual slider, inspired by the controversial design of the Nokia N81. It's also got HSDPA support to improve network data transfer speed even further. Undoubtedly, the most exiting feature about the N85 is the display - a 2.6" 16M color AMOLED unit of QVGA resolution. There is a built-in accelerometer for automatic rotation of the UI and dedicated gaming keys for improving the N-gage gaming expirience.

Nokia N85

Some of the other features of the Nokia N85 include microUSB slot, 3.5mm standard audio jack and GPS. The handset running of the Symbian OS with S60 UI and Feature Pack 2 preinstalled will also have WLAN and Bluetooth among its connectivity options. A 5 megapixel camera with autofocus, dual-LED flash and autofocus assist light is mounted at the back of the device. It can manage the sweet VGA video recording at up to 30 fps. A secondary CIF camera is at the front to take care of the video calls.

The built-in memory of the Nokia N85 is 74MB and there is a microSD card slot to extend that. An 8GB card (the largest currently available on the market) will be included in the retail package. The final multimedia touches to the Nokia N85 are the FM radio and FM transmitter.

Nokia N85 will be available in Copper color in October for an estimated retail price of 450 euro (660 US dollars) before taxes or subsides.

Nokia N79

The bar-shaped Nokia N79 has a bit more modest feature list but has better (or so it seems to us) looks and a more compact boy. It still supports all the four GSM bands but the 3G works only on the 900 and 2100 MHz bands. The display on the N79 is a 2.4" QVGA one, capable of showing up to 16M colors. Wi-Fi, GPS and a 5 megapixel camera are some of its other more important features.

Nokia N79 also sports FM radio and FM transmitter, allowing you to broadcast your favorite tracks within a short range over radio waves. Quite as expected, it too runs on the Symbian OS with S60 v3.2 UI. Nokia N79, much like the N85, features the interesting Navi wheel navigation solution which we first came to know in the Nokia N81. The 3.5mm standard audio jack, the Bluetooth connectivity and the microUSB slot are hardly a surprise to anyone. The internal memory of the N79 is 50MB and it will be expandable through the microSD card slot (a 4GB memory card will be included in the retail package).

Nokia N79

The other upgrade of the Nokia N79 over the N78 (in addition to the improved camera and video recording) is its easily customizable exterior. The handset will come with two extra Xpress-on covers in the retail package and additional ones can also be purchased.

Nokia N79 color version

Nokia N79 will hit the shelves in Canvas White and Seal Grey color versions in October and will cost 350 euro (515 US dollars) before taxes or subsides.

iPhone Key features & Main disadvantages !!

2008-08-28T13:29:00.003+06:00

Jantu'R iPhone Experiment. PLEASE NOTE: I originally posted this on my personal blog.

It’s finally here - the iPhone 3G. No, we mean that literally. It’s finally at our office and boy, are we excited! GPS, HSDPA purring under the new iPhone hood with a hefty number of software enhancements.

But all them software goodies are available for the first-gen iPhone too - so is it worth the fuss? It may as well be, but we never know before we take it out for a spin.

Apple iPhone 3G official images

Key features:

3.5″ 16M-color TFT display with a resolution of 480 x 320 pixels
Quad-band GSM support
Tri-band UMTS support with HSDPA
Built-in GPS receiver
Wi-Fi
8 to 16GB of onboard storage
Accelerometer, proximity sensor and ambient light sensor
2 megapixel camera
Silky smooth user interface with multi-touch user support
Unsurpassed web surfing experience
Push email with MS Exchange support
AppStore access for direct application download and installation
Redone rear
TV-out port

Main disadvantages:

No video calls over the 3G network
The handset wobbles on hard even surfaces
There are a number of messaging downers
Camera has no auto focus, nor video recording… nor any settings at all
Safari browser doesn’t support Flash and Java, doesn’t have a download manager
Bluetooth support limited to headset use only (no A2DP or file transfers)
No office document editor
No copy/paste functionality
You cannot sync Notes and TO-DOs
No memory card slot (but knowing Apple there will never be one)

Now, since we’ll be heavily comparing the old and new iPhone, how about the following arrangement - the first one we’ll call Number One and the newbie will be Number Two. Sorted. Wait a minute, no good? Crap, we knew it. OK then, the first one will be the iPhone 1G (as in “generation” of the device), while the new one will still be iPhone 3G (as in “generation” of the wireless network). That might sound inconsistent, but it’s short and we like it this way, so before you go ballistic in the comments section, remember Number One and Number Two.

The iPhone 3G 16GB (White) in hand

So, back to the drill - the 3G-enabled iPhone was rumored ever since the iPhone 1G surfaced last year. Now that we have the real thing in our hands, it doesn’t seem that groundbreaking anymore. Nevertheless, there are quite a few things to cover so we think reviewing it in detail is worth it. There’s the updated design, the new white color (which we happen to have), the new iPhone 2.0 firmware/software/OS (call it what you will) with AppStore on board, the push email functionality and, finally, the GPS and HSDPA topping.

The Apple iPhone 3G

We will also be on the lookout for improvements in terms of audio quality, loudspeaker volume and camera image quality against the iPhone 1G.

Seems like quite a workload, so let’s waste no more time and get to it. Join us after this short break for more on the iPhone 3G.

Jantu'R Dream Phone Nokia n85 !!

2008-08-26T16:37:00.004+06:00

My Current Dream Phone Nokia n85 !!

Nokia N85 Finaly Release !!

The Nokia N85 (the smallest dual-slider Nseries) features a 2.6Ã¢â‚¬Â³ AMOLED QVGA (240Ãƒâ€”320 pixels) display that supports 16 million colours. The OLED display should have a faster responce time, refresh rate and use less power than LCD displays and a 5 megapixel camera with support for geotagging.

There are also dedicated gaming keys and 10 pre-loaded demo titles to try out and you will be able to choose 1 game to have for free! Other features include a built-in FM transmitter, GPS and a 3.5mm audio jack. There will also be enough power from the BL-5K battery (1200mAh) for 28 hours of music playback. Many people have asked for the ability to charge their devices through USB, and the N85 is also the first Nseries device to support USB charging!

Like the N79, the N85 will have a microSD card included in the sales package - this time an 8GB card instead of having built-in mass storage.

This device should also be available next month!

It is great to see that Nokia are releasing their devices a lot quicker than before. There has been a long wait for the N96 and fingers crossed that device will also be available within the next month.

The N85 is actually quite an interesting device since it can do everything the N96 can but features a higher capacity battery in a slimmer design and a lens cover for the camera. A couple of things you do loose however is the 16GB Mass Memory and the 2.8Ã¢â‚¬Â³ screen - but I canÃ¢â‚¬â„¢t wait to find out how well the OLED display performs.

Would you consider the N85 over the N96?

Nokia N79 and N85

Nokia have announced the latest additions to their Nseries family, and as predicted, it is the new N79 and N85 devices!!!

They have also been promoting/re-launching the N96 today as well but there have been no changes to the device itself.

More details and higher resolution images after the break!!!

Marshall finished 12-year-old record !

2008-08-23T14:34:00.006+06:00

Marshall breaks sixes record in West Indies win

Abdur Rahim Jantu

August 22, 2008

West Indies 303 for 4 (Marshall 157*, Johnson 51, Rizwan Cheema 3-31) beat Canada 254 (Rizwan Cheema 89, Nash 3-56) by 49 runs

Xavier Marshall hits one of his record 12 sixes
Xavier Marshall blasted the most sixes in a one-day international innings as he demolished Canada's bowlers and set up a 49-run victory for West Indies. Marshall's 12 sixes broke a 12-year-old record of 11 in an innings, set in 1996 by Sanath Jayasuriya and equalled six months later by Shahid Afridi. Marshall finished unbeaten on 157 from 118 deliveries - he also struck 11 fours - and it was a memorable way for him to pass fifty for the first time in an ODI. Two of West Indies' newest players gave him strong assistance with Leon Johnson scoring 51 in a 128-run stand with Marshall.

But the most destructive period came in the final 12 overs, when Marshall really cut loose and combined with Brendan Nash (39 not out) for an unbeaten 111-run partnership that pushed the score to 303 for 4. The only Canada bowlers to finish with respectable figures were Eion Katchay, who picked up 1 for 25 from ten overs, and Rizwan Cheema, whose ten brought him 3 for 31.

It continued an excellent debut series for Cheema, and he proceeded to keep his side afloat with a powerful 89 from 69 deliveries. For a while he was threatening to challenge Marshall's hours-old record and he had six sixes when he was caught off Nash in the 19th over.

From there Canada's batsmen could only manage a few solid starts as Nash continued his strong all-round game to finish with 3 for 56. Dave Mohammed, playing his first ODI in nearly two years, picked up 2 for 34 as West Indies made the victory a formality. They will again meet Canada on Sunday in the final of the tri-series.

Regards,
Abdur Rahim Jantu
Community Manager at dotnetshoutout.com
Mobile : +880-1714-246603 off :Tribute Homes, Apt #C1 Gulshan-2
E-mail : abdurrahim@dotnetshoutout.com ,bossjantu@hotmail.com
Website : dotnetshoutout.com/About
privatebeta.dotnetshoutout.com
abdurrahimjantu.blogspot.com
bossjantu.spaces.live.com
jantus.wordpress.com
jentu.wordpress.com

CSS to Do Anything !!

2008-08-15T20:23:00.003+06:00

Using CSS to Do Anything: 50+ Creative Examples and Tutorials

CSS can powerfully open the doors to a lot of rich and unique techniques. Today we are presenting a round-up of CSS coding, creative approaches and techniques. Definitely worth taking a very close look at! We also included some basic techniques you can probably use in every project you are developing. This is just the third article in this series , the forth part will be coming soon, stay tuned and Enjoy!

You can also take a look at other 2 articles in this series :

So let’s get started and don’t forget to subscribe to our RSS-Feed to keep track on our next post in this series.

Styling Lists

The Amazing

- With a little CSS, the

becomes one of the most powerful and versatile tags in a web designer's arsenal. This article is a tutorial and a tribute to the amazing

So let’s get started and don’t forget to subscribe to our RSS-Feed to keep track on our next post in this series.

Better Ordered Lists (Using Simple PHP and CSS)- Here is an example where you ditch the traditional ordered list and create your own!

Style Your Ordered List- Here is a quick CSS tutorial on how you can use the ordered list

element to design a stylish numbered list.

Live DemoView it Here
Download zip file

List Based Calendar- A simple way to add multiple views to a calendar, so you can view your events in a simple list, or in a month based calendar format.

Live DemoView it Here

Forms and Form Elements

Datasheet-style form using HTML and CSS- Make a datasheet-style web form using HTML, CSS and JavaScript with multiple similar records,

Styling File Inputs with CSS and the Dom - File inputs () are the bane of beautiful form design. No rendering engine provides the granular control over their presentation designers desire. This simple, three-part progressive enhancement provides the markup, CSS, and JavaScript to address the long-standing irritation.

Live DemoView it Here
Download zip file

Better Web Forms: Redesigning eBay’s Registration- Is a detailed walkthrough of simple changes that have a dramatic positive impact.

Uni-Form- Uni-Form is an attempt to standardize form markup (xhtml) and css, “modularize” it, so even people with only basic knowledge of these technologies can get nice looking, well structured, highly customizable, semantic, accessible and usable forms

Footers

A CSS sticky footer that just works- In just a few simple CSS classes with minimal extra HTML markup, you can get a sticky footer that even beginners can get a handle on. It’s been tested in IE 5 and up, Firefox, Safari and Opera.

MAKING YOUR FOOTER STAY PUT WITH CSS- How to make your footer dock to the bottom of the screen.

New ideas for Image Replacement

Create Custom Search Bars - With Image Replacement using CSS

HR Image Replacement with CSS- How to replace the HR tag with an image that works cross browser.

Image Sprite

Image Sprite Navigation With CSS- Creating a navigation using an image sprite, you can have a complete navigation, rollovers and all, by only using one image.

CSS image techniques

Create Resizable Images With CSS- A new technique to resize images when the user increases their browser’s text size. Images are resized along with the text rather than staying constant in size.

CSS Stamps- Using the CSS property border and outline to achieve the stamp look.

Image Captions Generated with CSS and JavaScript- The names are not part of the image - they are stored in the img’s title attribute.

Cross-browser semi-transparent backgrounds- Semi-transparent backgrounds are nice. They would be more popular, but Internet Explorer doesn’t support .png transparency. There are a few clunky workarounds. Here’s another that’s a little less clunky.

CSS Rollovers- Learn how to create a simple rollover image using CSS.

Text and Links Effects

“Checkmark” Your Visited Links with Pure CSS- The goal of this tutorial is to get a check mark preceding visited links for a nice visual indicator.

Simple Round CSS Links - Now you can style both (a) and (button) in this super easy and light-weight solution

Pure CSS Popups- Using pure CSS causing text to appear and disappear.

Navigation

Perfect pagination style using CSS- This tutorial explains how to design a pagination for search results or more in general to split a long list of records in more pages.

VISTA style toolbar- How to create VISTA style toolbar with CSS,

Live Demoview it Here
Download codefrom Here

Digg-like navigation bar using CSS- This tutorial explains how to design a digg-like navigation bar using a liquid design with rounded corners for links.

Menu circular en CSS- A circular menu with nice hover effect showing text description for each item in the menu.

Live Demoview it Here

CSS Image Galleries

CSS Image Gallery- A purely CSS based image gallery that displays larger versions of thumbnail images dynamically when the mouse hovers over them. A rich HTML caption can be added to the enlarged image.

Not so simple photograph gallery- A CSS image gallery that have a default image, a line or two of descriptive text and the ability to click an image to hold it on the screen.

A sliding list click gallery- A demonstration to show a sliding tabs gallery, with a click to open action rather than a hover. Also the facility to add some descriptive text to accompany the large image.

Drop Caps

Nice Drop caps with CSS- Using the :first-letter pseudo-element, you can easily create nice drop caps with CSS. No extra HTML or Javascript required and IE5+ browser support.

Live DemoView it Here

Drop Caps- This small snippet of CSS utilises the :first-letter pseudo class to apply a particluar style to the first letter of each paragraph, giving the look of an illuminated initial.

Download codefrom Here

Rounded Corners in a simple New approach

3 Simple Steps in Coding a Rounded Corners Layout- A simple approach to coding fixed width, rounded corners layout in 3 simple steps.

Live DemoView it Here
Download zip file

One pixel notched corners- as used by Google Analytics.

Live DemoView it Here

Auto-Cropping Rounded Corners- A new solution for rounded corners, what it does is: it crops the content below it, so that anything with a background color or image (headers, paragraphs, even images) automatically get the rounded corner treatment with no extra work.

Download Examplefrom Here

Blockquotes

Simple Double Quotes- This CSS tutorial will show you how to display two double-quote images using one blockquote tag.

Live DemoView it Here
Download zip file

Blockquotes with Image Quotes- Adding an image to the blockquote style.

Worth Checking

Pure CSS Animated Progress Bar- A simple demonstration of how you can create animated progress bar using pure css. The trick is very simple. We need 3 elements, one container and 2 nested elements.

Live DemoView it Here
Download zip file

Add a “loading” icon to your larger images- Using CSS to embed a “loading” image, to let visitors know that an image is loading.

The CSS Text Wrapper - The CSS Text Wrapper allows you to easily make HTML text wrap in shapes other than just a rectangle. You can make text wrap around curves, zig-zags, or whatever you want.

Live DemoView it Here

Adding a magnifier to images with CSS and JavaScript

CSS coding can sometimes become a nightmare !!

2008-08-06T12:51:00.005+06:00

CSS isn’t always easy to deal with. Depending on your skills and your experience, CSS coding can

sometimes become a nightmare, particularly if you aren’t sure, which selectors are actually being
applied to document elements. An easy way to minimize the complexity of the code is as useful as
not-so-well-known CSS attributes and properties you can use to create a semantically correct
markup.
We’ve taken a close look at some of the most interesting and useful CSS tricks, tips, ideas,
methods, techniques and coding solutions and listed them below. We also included some basic
techniques you can probably use in every project you are developing, but which are hard to find
once you need them.

SpywareKill

2008-08-04T18:05:00.005+06:00

Talking about Spywarekill

Quote
Spywarekill
http://tech.msn.com/downloads
SpywareKill is the first anti-spyware tool developed in Microsoft .NET technology. Its revolutionary multi-threaded engines detects and cleans all kind of malicious software including key loggers, browser hijackers, browser helper objects, adware, trojans, malicious shell extensions, malicious LSP and commercial surveillance software. Its advance alerting system runs in background and notifies you in real time when it detects any threat. Its updater engine downloads the latest signature periodically from our server to keep your PC up to date from the latest outbreaks.
Version 2.5.2117 includes latest spyware signatures, functionality enhancements and minor bug fixes.
CNET Networks is not responsible for the content of this Publisher's Description. We encourage you to determine whether this product or your intended use is legal. We do not encourage or condone the use of any software in violation of applicable laws.

SpywareKill is the first anti-spyware tool developed in Microsoft .NET technology. Its revolutionary multi-threaded engines detects and cleans all kind of malicious software including key loggers, browser hijackers, browser helper objects, adware, trojans, malicious shell extensions, malicious LSP and commercial surveillance software. Its advance alerting system runs in background and notifies you in real time when it detects any threat. Its updater engine downloads the latest signature periodically from our server to keep your PC up to date from the latest outbreaks.
Version 2.5.2117 includes latest spyware signatures, functionality enhancements and minor bug fixes.
CNET Networks is not responsible for the content of this Publisher's Description. We encourage you to determine whether this product or your intended use is legal. We do not encourage or condone the use of any software in violation of applicable laws.

Jantu's Contact Info

2008-06-13T00:28:00.002+06:00

Jantu's Website/Blog

2008-06-13T00:19:00.002+06:00

Jantu's Website/Blog
dotnetshoutout.com/About
privatebeta.dotnetshoutout.com
abdurrahimjantu.blogspot.com
bossjantu.spaces.live.com
jantus.wordpress.com
jentu.wordpress.com

Abdur Rahim jAnTu

Disaster unfolds slowly in the Gulf of Mexico

Eleven to take on the world

How to Create a Slice of Nature Photo Manipulation

Step 2

Step 3

Step 4

Step 4

Step 5

Step 6

Step 7

Step 8

Step 9

Step 10

Step 11

Step 12

Step 13

Step 14

Step 15

Step 16

Step 17

Step 18

Image Tweaks and Adjustments

Conclusion

jantuR CSS Frameworks Lab.“hurry-up and be creative” demands of the graphic design industry.

Easy Menu in Minimalist Style

HTML, CSS

Div A Before Div B

Position Absolute With Text Wrap?

cricket

Rehab say sorry Naughty boy George Michael !!!

Madona will always be Madona

Talking about Madonna

Dream Come True"

iPod touch. Starting at $229.

youngster’s brain

BoSs JaNtU Think Nokia n85 mobile can do to a youngster’s brain in 2 mins !!!

destined to be popular..

Nokia N85 at a glance:

Nokia N85 first impressions

Jantu'R Nokia World !!!

Nokia N85

Nokia N79

iPhone Key features & Main disadvantages !!

Jantu'R iPhone Experiment. PLEASE NOTE: I originally posted this on my personal blog.

Key features:

Main disadvantages:

Jantu'R Dream Phone Nokia n85 !!

My Current Dream Phone Nokia n85 !!

Nokia N79 and N85

Marshall finished 12-year-old record !

CSS to Do Anything !!

Using CSS to Do Anything: 50+ Creative Examples and Tutorials

Styling Lists

Forms and Form Elements

Footers

New ideas for Image Replacement

Image Sprite

CSS image techniques

Text and Links Effects

Navigation

Further readings on Navigation

CSS Image Galleries

Drop Caps

Rounded Corners in a simple New approach

Blockquotes

Worth Checking

CSS coding can sometimes become a nightmare !!

SpywareKill

Jantu's Contact Info

Jantu's Website/Blog