Docstoc

pantera

Document Sample
pantera Powered By Docstoc
					Minor assignment 4

Lecture:    Working with images
 Task:      Use GIMP (or Photoshop, or any image processing application of your
choice) to design a graphic for your web site. This might be e.g. a logo, a banner, a
page background image, or a body image. Document in detail the steps you followed
to create your image.

For this assignment I will be showing the banner that I designed for my website using
Photoshop CS6 along with the steps I followed below:

Step 1:


                                                                        The first step that I carried in
                                                                        order to create the banner
                                                                        was by going to the
                                                                        Photoshop application. Then
                                                                        going over to the ‘file’ menu
                                                                        and then clicking on the ‘new’
                                                                        option.

                                                                        The image on the left shows
                                                                        the window that appears after
                                                                        clicking the ‘new’ option.

                                                                        In this window I input the
                                                                        width to be ‘1000’ pixels and
                                                                        height of about ‘300’ pixels so
                                                                        that the background be nice
                                                                        and long like a banner. I then
                                                                        pressed the ‘ok’ button.
                                                                        	
  




       The above screenshot shows the blank white background that appears after I
       pressed the ‘ok’ button in the previous window. Also under the layers palette, a
       small white rectangle icon with the word ‘background’ has emerged to indicate
       that I am working on the background layer.




	
                                            1	
  
Step 2:


                                                                            In this second step what I did
                                                                            was fill the empty white
                                                                            background with the black
                                                                            color. This I performed by
                                                                            going over to the ‘edit’ menu
                                                                            and clicking on the ‘fill’ option.
                                                                            Then once in the ‘fill’ window
                                                                            I choose black as a color
                                                                            under the ‘contents’ section.




                                                                            The screenshot on the left
                                                                            shows that the background
                                                                            layer has now turned to black
                                                                            color after pressing the ‘ok’
                                                                            button in the fill window.




       After the background was black, I then grabbed a ‘horizontal type tool’ from toolbar in the
       left and wrote a text ‘DOUBLE TROUBLE’ in a big font size and in white. When I started
       typing the words, I also noticed that on the right side, under the layer palette, a new layer
       with icon ‘T’ had emerged to indicate me that I was now working on the text layer.

       When I was finished with the writing I then quickly grabbed a move tool to centre align
       those texts against the black background.




	
                                               2	
  
Step 3:




       In this third step I needed to make a duplicate of this text layer. Thus, I went to the
       duplicate layer option under the layer menu and gave a name for this duplicate layer
       as ‘double trouble text copy’.




       After giving the name and clicking the ‘ok’ button in the ‘duplicate layer’ option
       window, I noticed that the duplicate text layer was created above the original text
       layer under the ‘layers’ palette on the right.




	
                                              3	
  
Step 4:

                                                                      Step 4 involved working with
                                                                      the ‘filter’ to begin creating a
                                                                      ‘wind’ effect on the text
                                                                      ‘DOUBLE TROUBLE’.

                                                                      This would be by selecting the
                                                                      original text layer and then
                                                                      going to filter>stylize>wind.




                                                                   After selecting the ‘wind’ option, a
                                                                   dialogue box appeared asking
                                                                   me whether to ‘rasterize’ this
                                                                   layer or not. I clicked on ok
                                                                   button to rasterize it so that I
                                                                   could begin with the wind effect.




       So after agreeing to rasterize the layer, a ‘wind’ effect window appeared.

       Next, under the method section I choose ‘wind’ as an option and under the
       direction section I selected ‘from the right’. I then hit the ok button.




	
                                              4	
  
Step 5:




       After agreeing with the choices, an effect was beginning to appear. However, the
       scale of the effect was quite small. So to increase this effect I hit the command + f
       key twice to repeat the effect twice and it was done.




       After increasing its effect, it was time to do the same thing but this time emulating
       the wind effect from left to right. So again I went to filter>stylize>wind and on the
       direction section selected ‘from the left’ option. I then repeated the process of
       increasing the effect of the wind like I had done earlier.




	
                                               5	
  
Step 6:




       Up until now the effect were only from side to side. Now it was time to apply on both,
       upside and underside of the text.

       So in order to begin doing that I rotated the image 90 degrees clock wise by going to
       the image>image rotation>90 degrees cw. I then went to the filter and applied the
       wind effect first ‘from the left’. Once the effect was applied I increased its strength as
       mentioned in previous step.




                                                 The image on the left is a close
                                                 up screenshot of the image after
                                                 applying the wind effect again
                                                 using the same process like
                                                 before but this time the direction
                                                 would be ‘from the right’.




	
                                               6	
  
Step 7:




       After finishing step 6, I rotated the image back to the original form by going to
       image>image rotation>90 degrees ccw.




Step 8:




       Next I wanted to apply color to this layer. So I went to the layer that I was working
       on and right clicked on it.

       After that I went to blending options>layer style. Once I was inside the layer style
       window I then ticked on the ‘color overlay’ from the various blending options that
       was available. From there on I picked my color and applied by clicking ok.

       Lastly I merged all the layers by selecting all the layers using the command select
       function and merging it using the shortcut key: ‘command + e’.




	
                                               7	
  
Final Image:




       Hence,	
  this	
  is	
  my	
  final	
  image	
  for	
  the	
  banner.	
  Once	
  it	
  was	
  finished	
  I	
  saved	
  this	
  
       image	
  as	
  a	
  jpeg	
  format	
  ready	
  to	
  be	
  used	
  in	
  my	
  website.	
  




	
                                                                     8	
  

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:3
posted:8/22/2012
language:English
pages:8