Step 1

Create a new document going to to File > New. The following window will open.

We want to create our calendar vertically so the height size will be higher than width size. I usually create business card sized 85 x 55 mm with 3 mm of bleed for each side. Please consider that size may vary depending on your printer.

Also remember to fill in your printer requirements for bleeds and safe area. Set the document color mode to CMYK with a resolution of 300 dpi.

Step 2

After setting up the document, place in some guides to visualize the safe area, an area where you can be reasonably sure that the contents won’t be cut off.

To make the guidelines appear drag them out from the rulers. I usually draw a safe area setting a 5 mm of edges all around the artwork.

Looking at the image below you can have a clear idea of the area that you can consider as “safe” for your contents.

Step 3

We have to run now the Kelso Script. Download the script and save it in your script folder under presets in the Illustrator main folder.

To run the script go to File > Scripts >calendar_v5d1

The suggested script, in my humble opinion, is really valuable. It allows to formats the text with tab stops, date box grid, and art placeholders. Beyond this specific use that we are going to see this script can help you to create many other calendar sizes.

You can choose from the available languages and size, choosing which months insert, if show the year and some other styling options.

For our tutorialI’ll use a Mini 12-up size. We want to start from January and not to visualize the year because I prefer styling it apart.

You now have your small calendar as shown below.

Name the layer as Calendar.

Step 4

You can now choose the font that you want.

How to choose the right font for a so small calendar? When you look for the right font here you have to consider the huge amount of dates you are going to write and how small they are. The smaller they are more difficult will be reading them. You have to choose a plain character with a good and well balanced space between letters, rows and columns. Avoid the use of lines between dates. The more the lines, the worse the readability.

In our case I’ve chosenan Advent font in Bold3 style to make it evident.

Step 5

You can also change the color. I’ve taken as reference the InstantShift logo that is a mix of reddish maroon and yellow. The maroon correspond to an RGB color 100 0 0.

Step 6

We want now to add the year indication making it more interesting with a gradient.

Start with writing 2011 year with Advent Bold3 font.

Select the Rotate Tool and apply a rotation of 90°.

Duplicate the year, align them vertically and locate the two elements one on the top the other on the bottom left angles as shown below.

Set the bottom 2011 with the same reddish maroon as the months and dates. Color the other with the logo yellow RGB 250 150 0.

Here below what you get.

Step 7

We want now create a line of “2011” which describe a gradient of colors which starts with our maroon and arrives to the yellow. In order to do that, we can use the Blend tool. Depending on the options set, the Blend tool will create a number of instances, between the two objects, applying a gamma of color between those of the two elements.

Go to Object > Blend > Blend Options

Set the Blend as Specified Steps and choose 7 as number of steps. Click Ok.

Go again to Object > Blend > Make

As said, Illustrator creates a serie of 7 instances colored from maroon to yellow.

Step 8

Create a new document in Photoshop.

Again here we have to consider adding the bleed. As we already have set in Illustrator we’re going to use a value of 3mm. By the way, Photoshop doesn’t have an automatic option which sets the bleed. So when creating the new document, instead of making it 85mm high and 55mm width we are making it 85mm + 3mm bleed on the left + 3mm bleed on the right = 91mm and, similarly, 55+3+3 = 61mm.

Set the resolution of the document to 300 pixel/inch, this because we are preparing a document for printing so we have to ensure high quality. We also should set the color mode to CMYK but, at the moment, I prefer to maintain the color as RGB to keep available some filter and options. We will turn the color mode later before preparing the Pdf ending file.

Step 9

Fill in the background color with a pale red and name this level as bleed.

Step 10

Create a new layer and fill it in with white.

Click on Selection Tool and select all the artwork.

Step 11

Click with the right button of the mouse (or Command + Click in Mac systems) and select Transform selection. Go then to the option bar, set the unit as millimeters and change the width value to 55 and height value to 85mm.

Snap the guides to the edges dragging them from the rulers. If your rulers are not visible, press Ctrl + R (CMD + R for Mac)

Step 12

Duplicate this layer and leave the new layer over that. Repeat the step 11 by changing size.Consider 10mm less for each value (5 mm for each side), so 75 x 45 mm. This is your safe area.

To make it evident apply a green border form the layer options and fill the rectangle in with a light green color.

Step 13

Now that we have set up the document we’re ready to work on the background.

I’ve chosen a paper grunge texture with a pleasant grain. The color matches perfect with the Instantshift logo ones. This is an important thing. When you are looking for nice texture to making more creative your works you always have clear in your mind the whole project so that all single elements can be harmonized working well together.

Open the texture and place it in the document. Click CTRL + T to transform the texture and resize it to fit inside the artwork.

Move the texture level under that one which shows the safe area so that you are always aware of the space that you can cover with contents.

Step 14

Let’s start now populating the card space with our calendar.

Open the calendar Illustrator file going to File > Place

I suggest proceeding as said by using Place instead of simply dragging and dropping the file inside. Placing a file is better because Photoshop includes the content as Smart Object. This means that you will be able to apply filters and options to the layer. This is not allowed if you drag the filein.

This is how it looks when placed. Click Return to complete the placing, remembering to stay within the safe area.

Step 15

Open the Layer Style of the calendar layer and set the Outer Glow option as shown below.

This will apply a slight glow to dates and month which contrasts with the rich texture and allows a better readability.

Step 16

Now personalize the card by positioning the logo. Drag and drop the Instantshift (or yours) logo inside the artwork. Otherwise, as already seen with the calendar, go to File > Place to place it as a smart object.

Step 17

Turn the logo layer blending mode as Luminosity and decrease the fill down to 20%. The logo is now on the back as a watermark.

Step 18

Go to the texture layer and decrease the fill percentage down to 80%. This will make the texture lighter than before increasing the calendar readability.

Step 19

We have now to create the front side of our business card size calendar.

The front can be considered as the “advertising” side. For example this is the side where we can give more importance to the logo.

Have you reminded yourself saving the file? If not (bad thing to do!ALWAYS saving during the job. What about if a blackout occurs?) then save now naming it Business Calendar BACK.

Save again naming the file Business Calendar FRONT.

Rasterize the calendar layer so that you are now able to delete all dates and months just leaving the 2011 line.

To delete the dates just use the Rectangular Selection tool, select and delete.

Step 20

We can still use the 2011 line as a decoration to populate our front side of the card. Simply duplicate the layer to fulfill the safe area, align all the layers and distribute them equally. Once more time, bear in mind to maintain all elements inside the safe area!

Step 21

Import the logo again and center the layer to the artwork vertically and horizontally.

Step 22

We want our logo to pop out from the crowd to gain more importance and become the prime element of the side. To do that we can add a glow all around.

Apply to the logo layer an Outer Glow style going to the Layer Style options and setting the values as shown below.

This is what you get.

Step 23

It needs now to prepare both files, Business Calendar BACK and Business Calendar Front, ready to print, so we need now to use Illustrator again.

In Photoshop go to File >Save asand save both files as TIFF format.

Open up the file calendar.ai previously created in Illustrator and hide the calendar layer. Open the document setup (File > Document Setup) and increase the number of artworks to 2.

Import the two TIFF files and place them in the artworks. Take care of correctly centering them.

Go to File > Export to save your file as a print ready file. Select the Press Quality Pdf option and add Crops and Registration Marks by ticking the appropriate check boxes.

Your Pdf file is ready to print and you have completed the job.

Final Image

Here below the final image front/back.

Step 1

Open Illustrator and create a new document. Select the Rectangular Tool, draw a rectangular and fill in with a gradient. Here below you can find the color palette which I’ve used.

Step 2

Select the Type Tool and select an appropriate font. Start to write the number “2″ as first element for our 2011 writing.

Step 3

Go to the Effects menu and select the 3D Extrude&Bevel effect. I’ve left the default color because the clear blue is perfect with our greenish background gradient. Active the preview option so that you can see what you are doing and how your choices affect the number aspect. You can try to experiment by yourself the different options or, if you prefer, you may choose the options here below.

Step 4

By repeating the step 2, write the number “0″. Apply again the 3D effect to get the same result as the number 2. Change a little the options applied so that you create dynamism in the writing.

Step 5

Now we have to write the double “1″ BUT, because we are celebrating the Chinese Year of the Rabbit, we want to give to the number 11 a funny carrot shape.
Select the Pen Tool and start to draw the path which builds up the first of the two 1 shape. Remember at the end of the tracing to adjust the anchor points by giving them roundness.

Step 6

Again apply the 3D effect. This time click on More Option button. The window will show you some additional parameters that you can manage.
Do not apply any Bevel to this shape in order to avoid unpleasant hard angles.

Change the default shading color as Plastic Shading Surface. Customize that color by choosing a warm brown to make a better carrot shadow.

Step 7

Select the object. We are going now to use the Expanding object option.

If the object has appearance attributes applied to it, as in that case which has the 3D effect on, the Object > Expand command is not immediately available. Go to Object > Expand Appearance.

Expanding the appearance of your object or brush work is very helpful because enables you to divide a single object into multiple objects getting paths from your shapes. This means that, for example, if you have a circle shape filled red and its stroke of solid green, using expand you will get two divided objects. This will work even with more complicated object filled with patterns or, as in our number 1, with applied effects. Expanding such complex artwork it will be divided in several distinct paths.

Expanding an object will prevent problem in scaling the artwork and even in printing operations.

After you have expanded the appearance of the complex object the simpler option Expand becomes available. Choose Object > Expand.

Step 8

Now that we have the clean shape of the carrot and all component elements are defined by themselves, we have to make the carrot more rough and real by adding a little of texture.

Select the front plain shape, digit the keyword CTRL + C to copy and CTRL + F to paste in front.

Go then to Effect > Sketch > Graphic Pen and change options. A high stroke length will ensure thin lines whilst a low light/dark balance will limit the darkness exceeding. Maintain Right Diagonal stroke direction.

Step 9

Open the Transparency palette and select from the drop down menu a Multiply blending mode with a low Opacity strength of 10.

The carrot surface now looks rough.

Step 10

Open the Brushes palette and chose a sketch brush. Draw some lines here and there.

Select all of theme and go again to the Transparency palette. Chose again Multiply and decrease opacity to 65.

Step 11

Let’s do the carrot green top. Select again the Pen Tool and draw an irregular shape. Fill it in with a green color. Always adjust the path as you wish using the Direct Selection Tool (the white arrow).

Select the object and go to Effects menu and select the 3D Bevel and Extrude effect. As we have seen for the number “1″, enable more options. Do not apply any Bevel and maintain a medium Extrude depth value.

Change the default shading color as Plastic Shading Surface. Customize that color by choosing a dark green to make a better shadow for the carrot leaves.

Step 12

Let’s make the second number “1″ carrot. Select the just finished carrot and duplicate it in a new layer. To do that just copy the object with CTRL+ C, create a new layer by clicking the New Layer icon in the Layers palette and past there with CTRL + V.

Select this new carrot and move it nearby the first one so that you get a nice 2011 writing.

To make some small changes, and give the image little extra personality, we are going to use the Warp Tool.

Double clicking the Warp Tool button the Warp Tool Options dialog box will open.

Select a medium-high brush size and not too high details value. A high details value will multiply the number of anchor points making your shape complex and heavy and this is what we want to avoid.

Start to move all around the carrot paying attention not to create empty areas between the elements.

Rotate and position the object as necessary.

This is our final result.

Step 1

Create a new document. Go to File > Place, search the folders and place the model in the new document. You can also just drag and drop the image in the new document to get the same result.

Go to the Layer Panel Options and select Template. This will transform that level in a locked one making the image a little faded as if you have covered it with a translucent paper.

By double-clicking the level you will open the Layer Options dialog box. Rename the layer calling it “bunny template”.

Step 2

Press the Create New Layer button from the Layers panel and rename it “Shape”.

Step 3

This is the Bunny creation part. At this stage having a drawing tablet could be useful to make drawing easier. By the way, if you have not a tablet you can do the same just using the mouse.

Select the Pen Tool and start to follow the template shape to construct the digital image. Zoom in and out to do better and use the tool to create the basic shapes. You don’t need to draw perfectly the 100% lines of your sketch here. The sketch is just a guideline and you can modify it anytime.

From the view menu choose Outline so that you can see just the trace of the path.

A good start for your outline is avoiding angled shapes. That’s why illustrator tends to add crispy angle to close or adapt the path. Better is to trace single elements when is not possible to compact the whole shape. In my example I’ve left apart the bunny head, hears, body, tails, creating them separately.

This is about what you should get.

By going again to View > Outline you will see all paths filled. See the example below.

As you can see you have, until here, just created the rough draft of the bunny. It is very important bring back and in front in the right way all single elements.

Send all those elements that are not on the forward on the backward level just right-clicking the mouse, opening the dialog box and choosing Arrange.

The head has to be in front so chose Arrange > Bring to Front.

Other elements, such as pawns, hear, tail, have to be send to back. So chose Arrange > Send to Back.

This is what you should get.

You can take your time to refine some lines by using the Direct Selection Tool to select every single anchor point that you may want to modify. In my example I’ve decided to smooth some anchor points by selecting them and then using the Convert Select Anchor Point to Smooth tool.

Step 4

Go again to View > Outline and add now all missing components. Draw its nose, eyes, eyebrows and a few other lines.

Again, come back to the normal view, move all those elements that have not to be forward by sending them to the backward level. To do that right-click the mouse, open the dialog box and choose Arrange > Send to Back.

To proper create the eyes make two drops shape with the Pen Tool, then select the Ellipse Tool and create some nested ellipses filling them with different colors as in the example.

Select all those line which are not a closed path and give them a round ending point by selecting Round Cap from the Stroke menu. Leave the fill in color empty and the stroke color black for these lines.

Let’s add colors and shadows now.

Step 5

We can start from the interior side of the big hears.

Create two pink colors, one darker than the other. Make them Global by checking the appropriate check box. This could be useful to create different intensity colors from the same tints.

Select the Gradient Tool and apply the two colors as shown for the first hear.

Repeat with the second one by varying a little the gradient angle.

Do the same with the nose.

Step 6

We have to color the whole bunny now. To do that, we are going to use again the gradient tool.

Select the object that you want to fill in with a gradient then select the Gradient Tool. I’ve started again from first hear.

Apply a light gray color. I’ve used RGB 230,231,232. Adjust the gradient by varying the angle as shown.

You have to do the same with the other hear by varying the angle to adapt the light source.

Apply this technique also to the head but by changing the type of gradient in radial. It is also better to add a new gradient point filled with white to give more contrast to the light/shadow.

Repeat again for the body by varying the location of the second point.

Do the same with the eyes and with the back pawn.

By selecting the object that you want to fill in and then selecting the Eyedropper Tool you can copy and paste the filling options to the destination object as I did with the other pawn and the tail.

Step 7

You have now filled in the bunny. We can still add a new shape with a linear gradient on the bigger hears.

This will make it looking better.

Apply to this detail a Hard Light blending and 66% Opacity from the Transparency palette.

Hide the template level once you finished.

This is the final image of the bunny character.

Step 8

We still have to do some minor adjustment that will be useful for our further steps. With the Direct Selection Tool select those anchor points near the rabbit’s neck and modify them so that they match with the bottom of the head.

Step 9

Select all elements of the bunny file and copy everything into the 2011 file, creating a new layer called “Rabbit”.

Step 10

Note that we have not drawn the mouth because we want the green top of the carrot be in front of the bunny head. To get that result select the front pawn, the body and the two details as shown below.

Copy and paste them in a new layer called “Rabbit front body”. Move carrots to suite as you wish with the rabbit.

Step 11

We can still add a simple light flow effect creating a single wave path by using the Pen Tool.

Create it in a new layer called “Light Flow”.

Use a Charcoal brush sized 2. Apply a Color Doge transparency effect with 66% of Opacity.

Duplicate the layer calling it “Light Flow 2″ and move this new layer below to make it visible behind some of the other objects, such as the 0 and the second carrot.

Now just select numbers 2 and 0 and go and click on Object > Expand Appearance. As we have already seen this will avoid problems in font or 3D effects interpretation.

Final Image

This is the very last image. Have a great Rabbit Year!

Makes Design Changes a Breeze

The wireframe allows users to understand which elements they love and hate about a website before it is a fully functioning, coded page. If you didn’t think an eye popping intrusive header would be distracting, wireframes allow you test this theory. They are the middle ground between idea and full conception.

Makes Site Design More “User Friendly”

Planning for your content is extremely important. Wireframes allow businesses to understand their true content needs. If your site has different ways to sort your content, and people are beginning to search for your content differently it may be require additional resources to integrate a new element in to your website that has already been coded. The wireframe allows web designers and coders to look at a barebones version of your site in order to adapt and remedy a problem.

Helps Clients Understand Their Needs

The most common application for wireframes is to help the site owner understand their website needs. The wireframes give a preview to how the site will look and navigate. They ultimately end up sparking conversations that (hopefully) lead to important design changes with your site.

Unfortunately, I could not find a beginner guide to making a wireframe in Fireworks when I was looking to create my own website; so after I learned the essentials, I set out to make a user friendly guide to creating a basic photography website wireframe. There are plenty of reasons people decide to create their own wireframe for their websites. It allows them limitless creativity and gives them a preview of their needs before diving in head first to a web design project. If you are on the fence, about creating a website wireframe check out The 7 Wonders of Wireframes.

However, if you want to base your website around another website, there are limitless templates available for you to use. The templates are the easiest way to create your websites design if you are one of those, “I want it now!” people. They are often already set up to be coded, include easily linked pages and pre-thought out site navigation elements. However, if you are a long-term thinker, the “I’d rather learn” type of person, creating your own wireframe is a great place to start.

If you are just following this lesson, or building your own wireframe by following the steps in the tutorial you will learn the fundamentals of the necessary web elements and page linking within a wireframe. The site I’m building is nothing fancy, but its simplicity keeps the users focus on my photography. Before we start, make sure that you have Adobe Fireworks CS5 and about an hour to spare. Here we go!

Create a New Fireworks Document at 1200×750px.

Select the “Rectangle Tool.”

Drag it across the transparent background, and adjust the background color to your liking (I chose white because it is subtle and clean). Hint: make sure you are in “Iconic” mode in the upper right hand corner before proceeding with the rest of this tutorial.

Set up your grid to help you align all of your elements.

Go to View > Grid > Show Grid

Insert a New Main Page Content Rectangle

This will be a base for you main page content. Add this by simply selecting the Rectangle Tool (U) and dragging another smaller rectangle on to your web page background. This layer should be a different color to help organizational elements pop. You can adjust the layer by setting the color to one that is different than the background image.

Next, select the two elements of your background (Main Page Rectangle and your Background) by holding Shift and clicking on both images. Move your cursor over to the “Layers Box” and group (CTRL or Apple+G) the two items of your background in your layer folder. Name it “Background” for referencing purposes.

Add a Logo/Header

Select the layers toolbox, and select “New Layer” label this folder “Home page” create a subfolder labeled “Title heading.”

This is pretty simple and all you have to do is select the Font you desire, and place it in the top left corner. Be sure to line up your Title with the gridlines. Hint: if you ever need assistance with what your website will look like on a browser, go to File > Preview in Browser > Preview in “…”

Adding Navigation Bar & Menu and Buttons

This is where the tutorial gets a bit more advanced; however, it is still do-able for any beginner. The main purpose of our navigation bar is to link to other pages within our website. With this, Fireworks allows you to link your .png home page to other pages within your wireframe.

First, click the “Rectangle Tool” to drag a horizontal bar across the top of your wireframe, either below or next to your heading/logo. (I chose to place the navigation bar next to my header). Match the color to your main page content rectangle, by selecting the nav bar and using the “Eyedropper Tool”.

Click the “Slice Tool” and create a rectangular box within your navigation bar.

(These will serve as linking elements that will direct the user to a new page). After you create rectangle within the navigation bar, copy it and paste it 3 more times. Since there will only be 4 header pages “Prints”, “About”, “My Blog”, & “Best of” being linked to we will add 4 slice tooled rectangular boxes.

Adding Text to Navigation Buttons

After you have set up your sliced navigation buttons, click the text tool and type “About” (or any text that you may need for your site). Change the font to a web friendly generic font, I chose “Calibri” size 20. Align your text using the grid guidelines. The font should be placed directly in the middle because it looks more professional; I use the “Snap To Grid” option to make sure that all of my text is aligned.

Create A Separator

For aesthetics, create a separator between these 4 menu buttons. Select the “Rectangle Tool” and create a thin rectangle on top of your navigation bar. Once you find a size you like, copy and paste it 2 more times over your navigation bar.

Adding Main Page Content

For this wireframe, I would like the main focal point of the website to be samples of my best photos. I first created a rectangle from the “Slice Tool” that will house my main content image.

I thought it would be nice to have an expose’ each week that includes a bit of information on, where the picture was taken etc… I selected the text tool and created a text heading, and underneath it placed a sub-heading. I decided to keep the size and fonts consistent with the menu nav bar fonts for CSS purposes.

I then added a picture for visual purposes…

Adding A Side Bar

Okay, your home page wireframe is almost done! A side bar is important for any wireframe, it not only is functional but many website viewers expect a sidebar with some sort of information.

My sidebar is going to have a sample of the different types of photos I take “Nature” photos, “Action” photos, and “Still-Life” photos. It is a visually appealing subcategory/ sort method.

First, I create a layer folder called “sidebar”. Add another rectangle using the “Rectangle Tool” and drag it over the main background. Change the color to a darker gray #333333

Adding Sub Category Links

I have 3 main sub categories that are going to be linked in my sidebar. I want them to be linked to each image. Select the Slice Tool and create 3 boxes within the sidebar.

Add Text Headers to the Top of Your Sidebar.

Choose the same text and font you used in the menu nav bar. “Calibri” size 20 and this time I bolded it and made it white.

Now Drag Your Sample Images on to the Wireframe.

Resizing them so that they are aligned with the slice tool rectangles.

Make sure that everything in your “Layers” palette is organized by Folders.

Your website should look something similar to this:

Creating a Secondary Page

Creating a second page is very important. Although we’ve all seen the 88 single page websites, having a multi page site can be good for both SEO and navigation purposes.

First you must create a page. Find the “Pages Icon” on the right hand side. For ease of use, you should duplicate the page (This will ensure that formatting is consistent and that a consistent theme is seen through the website).

Delete the duplicate content including the “Text” and all “Main Page Content”. Add new content that is specific to the sub page. The first page we will focus on is the “About” page. Add text in the existing text box that is relevant to the “About page. (”About Me”, “I.LOVE.PHOTOGRAPHY!”).

Go back to Page 1, find the “About” text box in the navigation bar. Click on it and find the “Properties” box at the bottom of the screen. Link the “About” box to your Page 2 by selecting the “Link” dropdown box and selecting “Page 2.htm.”

Your two pages are now linked!

You should be able to duplicate the process of linking pages and adding visual and text elements to your wireframe until you have filled in all the pages from your home page. The wireframe that we just created will have around 10 different pages all inter-linked. Remember keep the theme consistent! If something looks a bit off make sure that is lined up with the gridlines, the font is exactly the same and that it is not hidden behind other layers. The best websites will follow a “3 click rule,” meaning the user should be able to access the content they are looking for within 3 clicks. Hopefully the user stays around for longer than 3 clicks, but that all depends on your content.

Don’t worry about trying to find minor mistakes with your wireframe, if you are paying for somebody to code your website, they should be able to address this issue for you. The most common coding method is HTML and CSS. Many design services will be able to get you a fully functioning website, coded for under $500.

Creating a wireframe in Fireworks is the easiest way to begin a web design project. It allows you to incorporate “Web Layers” within your documents. This Fireworks wireframe will give you a holistic viewpoint of a website from design elements-up. A wireframe will also help you negotiate abbreviated rates to your website coder. They will appreciate your strategic planning for your site because there is a smoother transition behind idea to conception.

Character Related Tutorials

• Create a “Minion” Character From the Despicable Me Movie
• Draw a Pirate Character
• Create a Fantasy Girlbird Illustration
• The Mad Hatter from Alice in Wonderland

Environment and Space Related Tutorial

• Create Awesome Abstract Nebula Circle Shape
• Create Dramatic Meteor and Burning City Effect in Photoshop
• The creation of “A Life Of Aquatic Sounds”
• Create a Red Giant Star in Photoshop
• Create an Ancient Egyptian Tomb in Photoshop

Page Layout Related Tutorial

• Create a Professional App Store Web Layout
• Sleek Portfolio Layout
• How to Design a Video Game Interface Window
• How to Create Brochure Mockups
• Create A Detailed Portfolio Homepage Design
• How to Draw an MP3 Player Skin
• Design a creative portfolio in Photoshop
• Design a Textured “Coming Soon” Web Page
• Creating a Cartoony Print-Ready Business Card
• White notebook style for web site design
• Create a Fantastic Landing Page
• Create an Elegant Patterned Web Design
• Design a Trendy Yet Professional Website Layout

Objects Related Tutorial

• Create a Spherical 3D Puzzle With Photoshop
• How to Draw a Realistic iPhone 4
• Bamboo Fun tablet
• Draw a Sound Dock System
• How to create a Bugatti Veyron illustration
• How to Create a Delicious Green Apple Illustration
• Learn To Create A Safe Illustration
• Process of making a platinum credit card
• Realistic Wrinkled Paper In Photoshop
• Create a Spiral Telephone Cord From Scratch
• Golden foil gift box from scratch
• TV aquarium. Digital drawing and photo effects
• Create a Stylish Coffee Cup With Smart Objects
• Speedometer Design From Scratch
• Sony Ericsson S500 Cell phone interface
• Create a Desk Lamp Using Photoshop

Logo, Symbol or Icon Related Tutorials

• How To Design A Detailed Mini Cooper Icon
• Radar Icon in Photoshop
• How to Design a Phone Icon in Photoshop
• Heart in Envelope Icon
• How to Create a Beautiful Printer Icon
• Tips to create awesome 48×48 pixels icons
• Create A 3D Push Pin
• Industrial Folder Style Icon

Sketch, Painting, Poster, Graph Related Tutorials

• Create a Shampoo Advertisement
• Design the Pirates of the Caribbean Movie Poster
• Create a Vector Style Magazine Cover
• How To Create a Vintage Style Zombie Movie Poster
• Hand-drawn tricks for hip graphics styles
• Create a Cartoon-Like Fish Illustration
• Create a Flowerpot From Scratch

Photo Manipulation Related Tutorials

• Create a stylish modern cyborg
• Create an Incredible Story Coming Alive Fantasy Photomanipulation
• Army Squirrel Photoshop Manipulation
• How to change simple face into an old one
• Luxury retro car poster with paint splashing effect
• Dry World – Photoshop Manipulation Tutorial
• Undress a Giraffe in Photoshop
• Steampunk golden car
• How to Create a Modern Vintage Concept Design
• Create an Amazing Abstract Heart Surreal
• The creation of The Choice
• “Piece of the Artic” Pie Chart Photo Manipulation
• Strawberry Cell Phone
• Create a Vibrant Conceptual Photo Manipulation in Photoshop
• Add vector flair to model shots
• Orange Porsche. Fruit Skin
• Grunge Stone Woman Photo Manipulation
• Shiny glass yellow tomatoes and splashing effect

Text Effect Related Tutorials

• How to Create an Incredible Typographic Illustration
• Create a realistic folded paper text
• Create a Harry Potter Style Text Effect
• Honey bubbles text effect
• Designed Stylish Embossed Text with Metallic Glow
• Create a Chrome 4×4 Vehicle Emblem
• Create a Grungy Looking, Blood-Stained Text Effect
• Create Elegant, Glassy, 3D Typography
• Create Colorful Ornamental Text
• Abstract FX Text Effect
• Easy Casino Style Sign in Photoshop
• Create Super Glossy 3D Typography
• Create an awesome broken plate typography effect
• Make a 3D Colorful Abstract Text Effect
• Modern 3D Text Effect
• Create a Festive Ornamental Christmas Text Effect
• Explore illustrative typography
• Design a Retro Postcard with 3D Text
• How to Create Candy Cane Typography
• Quick & Easy Candy Cane Text
• Extremely glossy and shiny text effect

Patterns, Digital Effect and Texture Related Tutorials

• New Manga Effect
• Manipulation Secrets 3 – Shading and Lighting
• How to create a Raindrops Bokeh Texture
• Design damask patterns for wallpaper and homewares
• Roses bouquet splash effect
• Create a Stunning Product Shot Using Professional Lighting Effects
• Create Beautiful Abstract Female Art
• How to Create Fractals in Photoshop Easily
• Creating a Surreal Smoking Bird Composition
• How To Create a Tessellating Geometric Poster Design
• Give your art that cosmic look
• Creating Cool Abstract Waves in Skateboard Jam
• How to Make Vibrant Cosmic Light Effects
• Milk monster and chocolate splash

01. Create a “Minion” Character From the Despicable Me Movie

Let’s face it, those minion characters from Despicable Me were pretty darned cute. In today’s tutorial, You will learn how to use Photoshop and Illustrator to create a cute minion character.

Tutorial Link

02. Draw a Pirate Character

Character design might be one of the most fun things that you can do in Photoshop. This tutorial will demonstrate how to draw a pirate character in Photoshop.

Tutorial Link

03. Create a Fantasy Girlbird Illustration

What is more fun than mixing people with animals? The results can often be cute, funny, or even a bit disturbing. In this tutorial you will learn how to create a fantasy bird girl illustration using digital painting and photo manipulation techniques.

Tutorial Link

04. The Mad Hatter from Alice in Wonderland

In this tutorial you going to see ho to create your own mad hatter, a character from movie Alice in Wonderland.

Tutorial Link

05. Create Awesome Abstract Nebula Circle Shape

In this tutorial, you will learn the steps to create Awesome Abstract Nebula Circle Shape in Photoshop. This is an intermediate level tutorial so some steps can be a little tricky for beginners. You will also see that how you can combine the liquify filter with nebula texture and cloud to render some very interesting effect.

Tutorial Link

06. Create Dramatic Meteor and Burning City Effect in Photoshop

In this tutorial, You will see the methods to create a Dramatic Meteor and Burning City Effect in Photoshop.

Tutorial Link

07. The creation of “A Life Of Aquatic Sounds”

In this tutorial you will learn how to create “A Life Of Aquatic Sounds”. It using a variety of blending mode tricks, photo filters and other useful Photoshop techniques to complete this tutorial. At the end of this process there is a beautiful photo manipulation, realized in a short time and a very easily way.

Tutorial Link

08. Create a Red Giant Star in Photoshop

In this tutorial we will explore the cosmos from the perspective of this fictional civilization as it makes its way through the universe and will demonstrate the techniques that you can use in Photoshop to depict your own cosmic scene or adventure.

Tutorial Link

09. Create an Ancient Egyptian Tomb in Photoshop

Creating imaginary scenes from scratch can be a lot of fun. In this tutorial you will learn how to create an ancient Egyptian scene using stock images, textures, and some basic knowledge of perspective.

Tutorial Link

10. Create a Professional App Store Web Layout

This tutorial tells you how to create a professional looking App Store website layout using very simple techniques of photoshop.

Tutorial Link

11. Sleek Portfolio Layout

In this tutorial you will see the process of creating a sleek portfolio layout.

Tutorial Link

12. How to Design a Video Game Interface Window

One of the most important aspects of playing a video game is how information is presented. How the graphics are presented makes a major difference in how the players will perceive the game during play. In this tutorial you will learn how to design a video game interface window. During the process you can see how to manually draw certain aspects, apply layer styles, textures, and even how to incorporate Adobe Illustrator.

Tutorial Link

13. How to Create Brochure Mockups

If you are beginner when it comes to print out things you can forget the headache while preparing document to print and leave behind all that weird-vector-things. With this tutorial you will be able to create a print-ready tri-fold brochure in nothing but Photoshop. The techniques shown here could be applied to any other printing documents as well, like flyers, business cards etc.

Tutorial Link

14. Create A Detailed Portfolio Homepage Design

In this tutorial you will learn how to create a Portfolio homepage design with a unique slide show and welcome message design. Also choosing great resources around the web to make our design more cooler.

Tutorial Link

15. How to Draw an MP3 Player Skin

In this tutorial, you will see how to use a combination of layer styles, textures, and a bit of manual drawing to create a Winamp-style mp3 player skin.

Tutorial Link

16. Design a creative portfolio in Photoshop

In this tutorial you will see the process of creating a clean web layout.

Tutorial Link

17. Design a Textured “Coming Soon” Web Page

This web design tutorial will show you how to make a simple “coming soon” web page that has a nice background texture and a slick web form that you can easily adapt into contact forms, newsletter signup pages, and more. You will witness several web design techniques such as creating textured backgrounds, creating light rays, making illustrative clouds, and more.

Tutorial Link

18. Creating a Cartoony Print-Ready Business Card

In this tutorial, we are going to learn how to create a print-ready business card in Photoshop. Designs made for printing have to be prepared in a special manner. Before sending to the printer, it’s best to make sure that your file is ready so you can avoid all the hassle of redesigning, or better yet, the anguish brought by a printing disaster.

Tutorial Link

19. White notebook style for web site design

Learn how to make a Photoshop white notebook style web template with this web design tutorial

Tutorial Link

20. Create a Fantastic Landing Page

In this tutorial, you will see how to create a Product layout using Photoshop in a step-by-step manner. Techniques will be discussed in this tutorial which include the use of proper spacing, typography, and colors. Keep in mind that these techniques can also benefit you when you’re working on other designs in the future, so keep your mind focused and do not skip a single word!

Tutorial Link

21. Create an Elegant Patterned Web Design

In this Photoshop web design tutorial, we will create a simple and elegant web layout of a portfolio site. We will create and use patterns throughout the design to give it that extra bit of class. We’ll use a variety of techniques, including creating patterned drop shadows, applying highlights with the Brush Tool, creating a basic button for the navigation bar, and more.

Tutorial Link

22. Design a Trendy Yet Professional Website Layout

This tutorial tells you how to create a professional looking trendy website layout using very simple techniques of Photoshop.

Tutorial Link

23. Create a Spherical 3D Puzzle With Photoshop

In this tutorial you will see how to create a nice spherical 3D puzzle using Photoshop CS5 Extended’s 3D tools.

Tutorial Link

24. How to Draw a Realistic iPhone 4

In this tutorial, we will draw a realistic-looking iPhone 4 using Photoshop. We will use various techniques that involve the Pen Tool, Photoshop shape tools, and layer styles to create this ubiquitous Apple mobile device. We will be intent on getting the details right to ensure that our end product looks as real as possible.

Tutorial Link

25. Bamboo Fun tablet

Learn to draw a realistic bamboo fun graphic tablet or photorealistic device drawing in photoshop

Tutorial Link

26. Draw a Sound Dock System

In this tutorial you will see how to draw a Sound Dock System with Photoshop.

Tutorial Link

27. Bugatti Veyron illustration.

This tutorial guides you on how to create a Bugatti Veyron illustration in Photoshop from a scanned hand drawn sketch.

Tutorial Link

28. How to Create a Delicious Green Apple Illustration

In this tutorial, you will see how to draw a shiny green apple. You have a look at various painting techniques throughout this tutorial. It will be fun and you’ll learn something new.

Tutorial Link

29. Learn To Create A Safe Illustration

In this tutorial you will see how the process of creating a Safe Illustration. We’ll be using a number of tools in this tutorial so there’s plenty to be learned.

Tutorial Link

30. Process of making a platinum credit card

his tutorial guides you on the process of making a platinum credit card using Photoshop.

Tutorial Link

31. Realistic Wrinkled Paper In Photoshop

This tutorial walks you through the process of creating a realistic wrinkled paper effect.

Tutorial Link

32. Create a Spiral Telephone Cord From Scratch

Given the right tools, Photoshop can make just about any task easy. This tutorial will demonstrate how to create a still life telephone scene from scratch using the smudge tool.

Tutorial Link

33. Golden foil gift box from scratch

In this tutorial you can learn to draw a realistic golden box or how to make a golden foil with your own hands.

Tutorial Link

34. TV aquarium. Digital drawing and photo effects

In this tutorial you can learn how to make a fantastic and surreal Digital TV aquarium by your own hands in Photoshop.

Tutorial Link

35. Create a Stylish Coffee Cup With Smart Objects

In this tutorial you can see how to create a realistic coffee cup with a customizable label using smart objects in Photoshop.

Tutorial Link

36. Speedometer Design From Scratch

In this detailed tutorial you will walk through the process of creating a speedometer from scratch, you’ll learn such things as text on a path, using the pen tool, working with shape layers and much more.

Tutorial Link

37. Sony Ericsson S500 Cell phone interface

In this tutorial you can learn to draw a realistic cell phone or how to make a cellphone with your own hands.

Tutorial Link

38. Create a Desk Lamp Using Photoshop

Creating mechanical devices from scratch in Photoshop can be a challenging task. In this tutorial, you will get some practice by drawing a Pixar style lamp.

Tutorial Link

39. How To Design A Detailed Mini Cooper Icon

In this tutorial you’re going to learn how to create a large 512×512 car icon, based on a lovely BMW Mini Cooper. We will be using Photoshop (CS4 in this case) to create the icon, using a handful of different techniques.

Tutorial Link

40. Radar Icon in Photoshop

In this tutorial you will see how to create a Mac style radar icon in Photoshop. This could be done easily in Fireworks and in Illustrator, But here you can see how it can be done in photoshop.

Tutorial Link

41. How to Design a Phone Icon in Photoshop

In this detailed Photoshop Tutorial, you will learn how to create a high end professional Phone icon with a limited knowledge in Layers and Layer Styles. The only necessary skills to get through this tutorial are the basic knowledge of how to use the most common tools in Photoshop.

Tutorial Link

42. Heart in Envelope Icon

In this tutorial you will learn some simple tricks to create a cute icon for Valentine’s Day. The icon consist of an envelope with a red heart shape inside. This icon is made from scratch so no need for stock images or other resources. You can resize it to any size without losing the quality of the image because it is a vector icon.

Tutorial Link

43. How to Create a Beautiful Printer Icon

Learn how to create this beautiful printer icon with reflections and shadows all within Photoshop. A detailed PSD is included with this tutorial.

Tutorial Link

44. Tips to create awesome 48×48 pixels icons

In this tutorial you will see how to realize an awesome small icon of a graphic tablet. This will start by studying a real tablet, you will understand which are the fundamental details and shapes to re-create into the small icon, and finally you can learn the Photoshop steps necessary to realize the icon.

Tutorial Link

45. Create A 3D Push Pin

In this Photoshop tutorial you can see how to create a 3D Push Pin using Photoshop Extended’s 3D drawing and rendering capabilities.

Tutorial Link

46. Industrial Folder Style Icon

In this tutorial you will walk through the process of creating a industrial style folder icon.

Tutorial Link

47. Create a Shampoo Advertisement

Here in this tutorial you will use the pen tool, some basic shape transformations, and color blending to create a fresh-looking shampoo bottle within the context of an advertisement.

Tutorial Link

48. Design the Pirates of the Caribbean Movie Poster

Movie posters and films are great sources of inspiration for graphic designers. With the success of Tron Legacy and its awesome light effects, you may have seen several tutorials on how to realize these effects in Photoshop. In this tutorial you will learn how to create a poster of the film series: Pirates of the Caribbean.

Tutorial Link

49. Create a Vector Style Magazine Cover

This is a detailed and step by step tutorial for creating an Vector based cover page design in Photoshop. This tutorial demonstrates effective usage of Photoshop’s vector tools and techniques. PSD file included.

Tutorial Link

50. How To Create a Vintage Style Zombie Movie Poster

This tutorial follow this step by step process of designing your own retro/vintage style horror movie poster.

Tutorial Link

51. Hand-drawn tricks for hip graphics styles

In this tutorial, artist Ollie Munden takes you through the process of creating his three-colour painting, Chasing The Dragon, through a mix of Photoshop and pencil techniques. First off you’ll mock up what you want to create using photography, then create a pencil drawing from that. Taking your drawing, you’ll retrace this by hand with a Brush Pen, then transform it into a slick-looking, three-colour digital artwork.

Tutorial Link

52. Create a Cartoon-Like Fish Illustration

In this tutorial you will see how to create a cartoon-like fish illustration in Photoshop.

Tutorial Link

53. Create a Flowerpot From Scratch

In this tutorial you will learn how to create a flowerpot from scratch using several techniques in Photoshop.

Tutorial Link

54. Create a stylish modern cyborg

In this tutorial, Fabio Sasso shows you some techniques for creating a cyborg from photographic sources in Photoshop, tapping into the movie heritage of the cyborg, but mixing it with the glossy ‘Bleach-Bypass’ look of modern sci-fi TV shows such as V and The Event. You will use some stock photos and lots of adjustment layers, in order to achieve a convincing result.

Tutorial Link

55. Create an Incredible Story Coming Alive Fantasy Photomanipulation

In this fantasy photomanipulation tutorial, you’ll learn how to start with just a few stock images and quickly build up an incredible story-based artwork. You’ll see how to manipulate images, add effects and build an amazing artwork in this Photoshop photomanipulation tutorial.

Tutorial Link

56. Army Squirrel Photoshop Manipulation

In this tutorial you will see how to turn a cute squirrel into a Rambo squirrel. This tutorial can be a bit difficult for beginners but author will try to explain it the best he can. In this tutorial you will use the Warp and Clone Tools so be prepared for a heavy manipulation lesson.

Tutorial Link

57. How to change simple face into an old one

THis is the tutorial about changing original face into an old one.

Tutorial Link

58. Luxury retro car poster with paint splashing effect

In this tutorial you will learn how to create Luxury retro car poster with paint splashing effect in Photoshop.

Tutorial Link

59. Dry World – Photoshop Manipulation Tutorial

This is a very creative tutorial which walks you through the process of creating Dry World.

Tutorial Link

60. Undress a Giraffe in Photoshop

Have you ever wanted to know what a Giraffe looks like without its spots? If so, this tutorial is for you, Here you can see how to undress a giraffe by removing its spots. Then you will see how to turn its spots into an outfit that will be draped over an ironing board.

Tutorial Link

61. Steampunk golden car

Here is a quick tutorial which will instruct you on how to create this stunning steampunk golden car image. Whether you are looking to create professional graphics to advertise your business, or just a fun picture for a theme party invitation, this is a great design which you can create at home, using Photoshop. This step by step guide with screen-shot images makes it easier than ever to use picture-editing software and achieve amazing results.

Tutorial Link

62. How to Create a Modern Vintage Concept Design

In this tutorial you will see how to create a beautiful vintage concept design using stock photos and Photoshop. The tutorial is well explained, you will get a clear idea of what you are doing in each step.

Tutorial Link

63. Create an Amazing Abstract Heart Surreal

In this surreal Photoshop tutorial, you’ll learn the entire workflow from start to finish of creating an incredible surreal abstract artwork. Starting with just a single photograph, you’ll learn how to apply adjustments to bring it into an easily workable color scheme, as well as then using the pen tool to create amazing surreal shapes.

Tutorial Link

64. The creation of The Choice

This tutorial explains professional photo-manipulation techniques to create a surreal and dramatic scene in Photoshop. Starting by building up a vivid background, then focus the work on the characters and the meaning of the composition. This tutorial is not so easy to follow for beginners.

Tutorial Link

65. “Piece of the Artic” Pie Chart Photo Manipulation

In this tutorial, You will see the recreating “Piece of the Artic” Pie Chart Photo Manipulation. This tutorial will utilize Photoshop 3D features, layer masking, and a lot of selections.

Tutorial Link

66. Strawberry Cell Phone

Here in this tutorial you can learn how to create Strawberry Mobile Phones on Coolest Gadgets in Adobe Photoshop.

Tutorial Link

67. Create a Vibrant Conceptual Photo Manipulation in Photoshop

In this tutorial you can learn how to create a unique digital art piece that easily can be used for high-quality printing purposes. There is water, balloons, fish, vegetation, a gloomy passage and a fashion nerd — this cannot be nothing but awesome together!

Tutorial Link

68. Add vector flair to model shots

In this tutorial, Camilo Bejarano shows you how to ramp up this juxtaposition, hand-drawing elements before scanning them in and transforming them into dramatic, colourful designs that interact neatly with the photograph.

Tutorial Link

69. Orange Porsche. Fruit Skin

In this tutorial you can learn how to apply orange texture (fruit skin) to the Porsche car.

Tutorial Link

70. Grunge Stone Woman Photo Manipulation

In this design tutorial, you can learn how to perform a photo manipulation of a beautiful woman breaking free from the confines of her stone prison using Photoshop to blend various images together along with a bit of brushwork, adjustment layers, and layer styles to create a masterful and compelling image.

Tutorial Link

71. Shiny glass yellow tomatoes and splashing effect

In this design tutorial, you can learn how to create realistic glossy glass tomatoes with liquid in them, make reflections and shadows

Tutorial Link

72. How to Create an Incredible Typographic Illustration

Here you will learn how to bring a simple proverb into a complex typographic illustration that achieves a level of realism without actually using any photos.

Tutorial Link

73. Create a realistic folded paper text

In this design tutorial, you can learn how to realize a folded paper text effect from scratch in Photoshop. You will firstly create the background using a couple of patterns, then you will work on the type treatment with the help of the pen tool, layer masks and other useful techniques related to dodge, burn and the transform tool.

Tutorial Link

74. Create a Harry Potter Style Text Effect

This tutorial will show how to use bevel effect and lens blur to create a depth to your artwork.

Tutorial Link

75. Honey bubbles text effect

In this very easy Photoshop tutorial, you can learn how to create warm honey text effect with bubbles texture. You will use simple techniques such as layer style effects and Honeycomb pattern.

Tutorial Link

76. Designed Stylish Embossed Text with Metallic Glow

In this design tutorial, you can learn how to create a nice and beautiful text effect.

Tutorial Link

77. Create a Chrome 4×4 Vehicle Emblem

In this quick tip tutorial you will see how to create a chrome 4×4 vehicle emblem using editable text and layer styles.

Tutorial Link

78. Create a Grungy Looking, Blood-Stained Text Effect

In this tutorial, you will see the process to create Blood Stained Text Effect in Photoshop. Along the way, you will be using some custom brushes, layer blending effects for the text, cloud rendering + blending mode, and image adjustments.

Tutorial Link

79. Create Elegant, Glassy, 3D Typography

In this tutorial you will see how to create elegant, glassy, 3D typography using Photoshop and Illustrator.

Tutorial Link

80. Create Colorful Ornamental Text

Here in this tutorial you will see how to create an ornamental text effect in Photoshop. You’ll see how to wield the pen tool to create shapes, and how to paint as well as burn the shapes to create a 3D illusion.

Tutorial Link

81. Abstract FX Text Effect

Learn how to turn any text into a beautiful text design using layer styles, gradients, and Photoshop brushes. This tutorial is great for novice Photoshop users who want to learn how to easily add style to any text.

Tutorial Link

82. Easy Casino Style Sign in Photoshop

In this tutorial you will see how to create a very nice light effect using basic filters, layer style, blend modes and some stock photos. The whole process won’t take you more than 45 minutes and the level of this tutorial is easy, but it requires some attention to the details.

Tutorial Link

83. Create Super Glossy 3D Typography

This tutorial will walks you the process of creating super glossy 3D typography using Illustrator and Photoshop.

Tutorial Link

84. Create an awesome broken plate typography effect

In this tutorial you will see how to realize funny letters that look like broken plates. You will start in Illustrator modifying the original font, then you will switch to Photoshop in order to play with textures and layer styles.

Tutorial Link

85. Make a 3D Colorful Abstract Text Effect

Here you can learn how to make a 3D colorful abstract text effect simply using Photoshop.

Tutorial Link

86. Modern 3D Text Effect

In this Photoshop tutorial you will learn the step to 3D rendering power of Adobe Illustrator to create a cool little 3D text effect.

Tutorial Link

87. Create a Festive Ornamental Christmas Text Effect

Here, You’ll learn how to create 3D Studio Max 3D text, and then how to import it into Photoshop to create a holiday text effect. You’ll see how to decorate your text with holiday themed items, and how to bring the composition together.

Tutorial Link

88. Explore illustrative typography

In this tutorial, you will seek out recognisable shapes (in this case, a swan) within letters and create images from them, by sketching then taking your ideas through to a finished piece in Illustrator and Photoshop.

Tutorial Link

89. Design a Retro Postcard with 3D Text

In this graphic design tutorial, you will see that how to take a popular retro style of having text with different images within each letter and recreate it. You will use Illustrator and Photoshop in concert to come up with an awesome retro postcard.

Tutorial Link

90. How to Create Candy Cane Typography

In this tutorial you will learn how to create a superb candy cane type design using Illustrator and Photoshop. Apply this effect to your own text and create cool and unique Christmas cards.

Tutorial Link

91. Quick & Easy Candy Cane Text

In this tutorial you will walking through the process of creating some nice snow covered candy cane text.

Tutorial Link

92. Extremely glossy and shiny text effect

In this Photoshop tutorial you will see how to create extremely glossy and shiny text effect with glitter texture useing simple techniques blending and layer style effects.

Tutorial Link

93. New Manga Effect

Here you will see how many things you can do with this filter. You will learn a unique way of making the manga effect.

Tutorial Link

94. Manipulation Secrets 3 – Shading and Lighting

Shadows are a very important aspect of any photo manipulation. Just as it happens with lighting effects, if the shadows are used the right way, you can end up with a stunning image. In this tutorial you will see a few techniques to create realistic shadows and lights with Photoshop.

Tutorial Link

95. How to create a Raindrops Bokeh Texture

In photography, bokeh is the blur or the aesthetic quality of the blur in out-of-focus areas of an image. In this Photoshop tutorial you will learn how to create a raindrop like bokeh texture in very simple steps.

Tutorial Link

96. Design damask patterns for wallpaper and homewares

In this tutorial, Steven details the techniques he used to create his patterns, using the theme of creative ‘career progression’, and shows how to reach the top of this chosen field.

Tutorial Link

97. Roses bouquet splash effect

This is step by step Photoshop tutorial that teaches you how to create blurred, bokeh effect background and beautiful splash effect for Roses bouquet. You will use milk splashes, filters and layer style effects.

Tutorial Link

98. Create a Stunning Product Shot Using Professional Lighting Effects

Here you will learn how to create some truly awesome lighting effects. The techniques themselves aren’t overly complex. It’s essentially a combination of gradients, textures, masking, brushes, and adjustment layers.

Tutorial Link

99. Create Beautiful Abstract Female Art

Sometimes, all it takes to create a stunning piece of art is a stock photo, a bit of creativity, a great idea, and some time. Today, you will see how to create a piece of art called, “Beauty of Gold.”

Tutorial Link

100. How to Create Fractals in Photoshop Easily

This is a easy tutorial on how to create fractal arts in Photoshop quickly.

Tutorial Link

101. Creating a Surreal Smoking Bird Composition

In this Photoshop tutorial, you will see the making of monochromatic scene with the subject being a bird in flight with smoke surrounding its body. you will be using a high contrast stock image that we will manipulate and combine with smoke brushes.

Tutorial Link

102. How To Create a Tessellating Geometric Poster Design

Follow this step by step tutorial to create a trendy geometric poster design with a series of tessellating three dimensional cubes.

Tutorial Link

103. Give your art that cosmic look

In this tutorial you will learn the steps needed to create the cosmic lady opposite, complete with overlay effects, colour treatments and elements that you can easily create in Photoshop.

Tutorial Link

104. Creating Cool Abstract Waves in Skateboard Jam

In this tutorial you will learn a interesting way to make beautiful abstract waves using common tools like Warp and various brush effects.

Tutorial Link

105. How to Make Vibrant Cosmic Light Effects

In this tutorial you will see how to take an awesome vector image created in Illustrator that was imported into Photoshop, and turn it into a fresh and modern design using layer styles, blend modes, and more.

Tutorial Link

106. Milk monster and chocolate splash

In this tutorial you will learn how to create a humor digital art scene with milk and liquid chocolate cartoon character.

Tutorial Link

Step 1

Let’s start by creating a new file (File > New) with a dimension of 15,6×10,6 cm, color method CMYK and 300 ppi resolution.

The final size of what we are going to create till the end will be a two folded card 15×10 cm size. The 0.6 cm is useful as bleedings in the print file preparation.

Select Edit > Preferences > Units & Rulers. Set the rulers units in centimeters.

Enlarge the image and moving the cursor from the left rule toward the center of the layout create a guideline positioned horizontally on 0.3 cm and again on 15.3 cm. Then do the same vertically on 0.3 cm and 10.3 cm.

The graphic elements, except for the background, have to stay inside the area delimited by the guidelines.

Step 2

It’s now time to load the first of our brushes, the set called Beyond the Mist, to create our bunch of trees.Select the Brush Tool and go to open the Brush Presets Picker.

Select Load Brushes and load the brush from the folder where you have previously saved it from the provided link. The new brushes will be added to the list.

Choose the brush number 4 and set the diameter to 1800px

Create a new layer from the Layers Panel and call it “Trees”.

Leave the color as default (black for the foreground color and white as background color), move your cursor until the center of the layout and click to brush. This is what you should get.

Now select the Move Tool and drag the Trees level near the left edge

Step 3

Create another layer and call it “trees 2″

Select again the Brush Tool and, opening the Brush Presets Picker, choose the Beyond the Mist brush number 8. Set the diameter to 700px.

Go to the layout and double click the brush to draw the new trees set on the new layer “trees 2″. To get a stronger effect double click or, as alternative, duplicate the level and merge down (Ctrl+E for Win, Options+E for Mac).

Step 4

Let’s go to give to the card a cold winter look by adding blue color.

Open the Adjustment Panel and create a new Hue/Saturation adjustment level. Check the colorize box firstly, than adjust the hue and saturation value as shown. This is how your layout should looks like now.

Step 5

Now to make the trees looking more interesting let’s add a little more of mist.

Create a new layer and call it “mist”. Go to the Filter menu and select Filter > Render > Clouds

Select Filter > Blur > Gaussian Blur and set the values as shown in the picture below.

At this point you have to apply to the “mist” level a Blending mode Overlay.

Here below how your greetings card should look like.

We already have something of interesting now but everything is still looking a little dull. We have to add details which are able to enrich the weak background. To do that we can use a grainy texture, adding delicate lines and, why not, snowflakes shadows.

Step 6

Download this Stained Concrete Texture from Bittbox

Import it into your layout and resize it a little so that it looks like as shown below.

Rename the layer as “texture”. Drag the layer just before the background one.

Duplicate this texture layer and change the Blending mode to Color Doge.

Open the Adjustment Panel and create a new Hue/Saturation adjustment level. Check the colorize box firstly, than adjust the hue and saturation value as shown.

Step 7

It’s now time to load the brushes called Snowflakes-Brushes.

Select the Brush Tool and go to open the Brush Presets Picker as we already did for the Mist brush.

Select Load brushes and load the brush from the folder where you have previously saved it from the provided link.

Choose the brush called snowflake13. Open the Brush Options Panel and change values in the various options as shown below.

Create a new layer from the Layers Panel and call it “Snowflakes”. Leave the color as default (black foreground color and white background color), move your cursor painting the top part of the layout. Set the Opacity level to 50%.

Change now your brush and choose that called snowflake10. Again open the Brush Options Panel and change values as previously you did. Create a new layer and call it “Snowflakes 2″. Move your cursor painting the top part of the layoutSet the blending of the level as Color Dodge.

This is what you should get.

Step 8

Let’s add a little of light now.

Select the Pen Tool and create a path as shown below.

Now select a brush of size of 19px with 100% hardness. Select White as your foreground color. Select the pen tool again. The path you drew before should still be there. Create a new layer and call it “light 1″. Right click and select “stroke path” tool. Select Brush from drop down menu and turn on “simulate pressure” checkbox.

Change the blending mode of the level in Soft light and you will get stroke like this :

Create some more lights in new level by calling it “light 2″, selecting the pen tool and following the previous step to create the waves. Arrange them as shown in the image and choose a brush size of 5px with 70% hardness. Change the blending mode of the level in Soft light.

It is now time for adding the text!

Step 9

As a matter of fact adding text in Photoshop is not the best thing to do. Indesign manage text field much better than Photoshop because it has been specifically developed as DTP software.

We will make an exception in this case for two reasons. The first is that we are going to add just the title to the card and not a long text. In addition we are going to modify a little bit the basic font just to make it more interesting, blending it better with the general layout.

Set the Jane Austen font, selecting font size 30 and writing in two different level “Season’s” and “Greetings”. I’ve colored the two words with a color picked up from the layout #374b6c.

Double click one of the text layers to open up the Layer Styles window. Add a Drop Shadow effect, reducing the distance to zero, but increasing spread and size to extend the effect beyond the edges of the type. Then set the blend mode to Color Burn.

Right click this layer and select Copy Layer Style, then paste the layer style onto the other text layer.

Step 10

Load the watercolor brush set select the Brush Tool and go to open the Brush Presets Picker again.

Go to Layer > Layer Mask > Hide All and add a Layer Mask to the text level, then use the watercolor brush set to rough up the type. Change brush and try which one looks better to get the right effect, use a low opacity to change tone, and rotate the angle from within the Brush options box to reveal the text as in a texture.

Change brushes and in a new level add some spot to simulate water splotches. This is your image

Apply all the same step to the other text level and this is the final image you get.

Step 1

Let’s get it started to create a new document in Adobe InDesign. Open InDesign and go to File > New > Document. First set the Number of Pages to 1.ChooseCustom from the Page Size dropdown menu and insert manually the greetings card size as width 15 cm and height 20 cm, selecting the Portrait orientation.

Set 5 mm as margins on all the fields (click on the chain icon). This is a security margin which you should respect to be sure that none of the most important elements of your design will be cut off.

Click on the More Options button to show all the options. Another set of options will be shown below. Set the Bleed value to 3 mm to all the fields.

These last options may vary depending of your printer shop requirements. I’ve indicated these values which, in my experience, are the most commons.

Step 2

Now it’s time to import the design element.

To do that you may go to File > Place, browse your file system until you find the folder where you have previously saved the seasons greetings.psd file, select it and click on Open. Now the cursor will include a miniature of the imported image.

Click somewhere inside the layout page to place it into the design. If you remember the first steps in the first part of this tutorial we already set up the PSD file with a width which matcheswith this new document one. So, if you did everything good the only thing you need to do is place it matching the bottom and left borders of the design with the page borders.

As alternative way to do the same you can directly open the folder where the file is and drag and drop the file inside the document.

Step 3

Let’s add the credits now. Select the Jane Austen font, set the font size to 12 and paragraph to centered.

Align the credit text box to the center by selecting the option Align to Page from the drop down menu. Choose a color which matches with the layout palette using the Color Picker Tool and picking up a color, for example, from the tree shapes.

We also have to remember that this side of the card will be folded. In order to have the credits written in the right direction we have to rotate the credit box upside down. Select the Rotate Tool and rotate it to 180°.

InDesign allow us to see a more accurate version of what will print and how. To see that select View > Overprint Preview and you will get an high resolution preview of the job.

How to Export the Document as a Print Ready PDF

We are to the final steps. We want to prepare our document for printing so we need to export a well done PDF document.

Select Adobe PDF presets and High Quality Print. Choose name and folder for the file and click Save to go ahead to the InDesign print settings dialog.

Under General option tab, in the Options area select Visible & Printable Layers from the dropdown menu.

Under Marks and Bleeds, Check the Following marks: Crop Marks, Registration Marks and Color Bars. Then check the Use Document Bleed Settings.

If you are going to print the document by yourself with your printer just check the Crop Marks option and the Bleeds one. These are very important in order to cut the card properly avoiding ugly blank borders.

Leave the other options as they are and click on Export button to end the saving procedure.

You will finally have your ready to print file as below.

Happy Holidays and Marry Christmas!