Visual Communication is the communication through a visual aid and is

described as the conveyance of ideas and information in forms that can be read or

looked upon. Visual communication relies on vision, and is primarily presented or

expressed with two dimensional images, it includes: signs,

typography, drawing, graphic design, illustration, Industrial Design, Advertising,

Animation colour and electronic resources

Abhilash, P R

CMFRI Digital Repository

Training Manual on Theeranaipunya - Equipping Fisherwomen Youth for Future 163  An Introduction to Visual Communication Tools Abhilash .P.R Senior Technician (Exhibition Assistant), SEETTD, CMFRI Email:abhilashcmfri@gmail.com    “Vision is the art of seeing the invisible”    -Jonathon Swift  Visual Communication is the communication through a visual aid and is described as the conveyance of ideas and information in forms that can be read or looked upon. Visual communication relies on vision, and is primarily presented or expressed with two dimensional  images, it includes:  signs,  typography, drawing, graphic design, illustration, Industrial Design,  Advertising,  Animation  colour and electronic resources.   Visual communication takes place through pictures, graphs and charts, as well as through signs, signals and symbols. It may be used either independently or as an adjunct to the other methods of communication.  Visual aids   Visual aids can play a large role in how the audience understands and takes in information that is presented and to bring in variety. There are many different types of visual aids like Objects, Models, Graphs, Maps, Tables, Drawing or Diagrams and Photographs. Photographs are good tools to make or emphasize a point or to explain a topic. Visual aids make presentation interesting by bringing in variety. Multimedia is used everywhere and in every field for every purpose. In the area of education also, the multimedia has a great importance. In schools students learn computers, at the advanced level this knowledge is in the form of professional courses like animation, designing etc. visual image can in many instances be understood by anyone. Some knowledge in these areas will help you to break up the routine when you are bored and stay creative to keep your mind active.  How to take a good photo   Photography begins when you ‘see’ a potential shot. Whether that’s physically looking at a view in front of you or visualizing an image, this is the point when you should start asking yourself questions. What has drawn you to this image? Why do you want 30 Abhilash .P.R    164 The less you explain the better the design  to capture it? And what is it that you hope to achieve? Thinking the image through before you even reach for your camera will help you decide which lens and focal length you need, the aperture and shutter speed to use and where you need to be to take the shot. It’s all about imagining the picture you want and then working back to determine what you have to do to realize that shot.  What is the need of Photo editing software in Photography?  In Photography photo editing techniques are used to bring out the best in your photos. You can do cropping and straightening a photo, improving its lighting and colour, removing unwanted content, adding special effects, sharpening, and saving. We can make photos special by adding creative effects. Convert a color photo into a customized black and white. Experiment with color tints for an old-fashioned look.   Adobe Photoshop is a raster graphics editor developed and published by Adobe Systems.  Photoshop was created in 1988 by Thomas and John Knoll. Since then, it has become the de facto industry standard in raster graphics editing software. Photoshop has vast support for graphic file formats but also uses its own PSD  and PSB  file formats which support all the aforementioned features.   Introducing the basics of graphics through Photoshop  Learning Photoshop is a good way to learn imaging concepts. Concepts you learn from working with Photoshop apply to other imaging tools as well (including Photoshop Elements, which has a very similar user interface and features) Photoshop is unlike other common software interfaces which emulate virtual typewriters or graphing paper. Photoshop creates an artist's virtual studio/darkroom. When you open the program you see a toolbox on the left with tools you will use to manipulate your images, and on the right, a white square which is your "canvas" or work area. The gray area surrounding the canvas is not part of your image, but only defines its edges.                                                                                    An Introduction to Visual Communication  Training Manual on Theeranaipunya - Equipping Fisherwomen Youth for Future 165  Opening a file/Creating a new file  First, you can open the image from the Photoshop file menu. It will be opened in the format it was saved in, so in order to work with it in Photoshop. Another method for getting an image into Photoshop is to copy and paste it into a new file in the application. This is especially useful for saving and altering web graphics or screenshots. Once the image is copied to the clipboard, go to Photoshop and select new from the file menu. A new file dialog will appear asking you to name the file, choose the size, resolution, colour mode, and background. The image size (in pixels) will automatically reflect the size of the image copied to the clipboard. Choose CMYK if this graphic is to be used in print, or RGB for the web. For background, choose transparent (this can always be changed later).  Using the paint brush tool Select the tool by clicking on the item in your toolbar, as shown below.    Next pick the brush’s size, called the diameter at the top of the screen. Now use the mouse and paint something creative.  Using the text tool to add text  You can add some text to our image by clicking on our Text toolbar item here. After selecting the text tool you can click anywhere on your image and type the word style. Toolbars at the top of the screen have word editing tools like font, size and colour. Abhilash .P.R    166 The less you explain the better the design    Using the move tool  After you finish typing in text, click on the move tool. You can see the move tool circled in the below shot of the toolbar. Use that arrow to click and move your image around.    Notice that the image does not move, it just moves the text. That’s because at the moment it’s the text layer that is selected.  Image menu  Most basic Photoshop tasks involve the Images menu and the most commonly used items on the Images menu are,   Image Mode   The first item on the image menu is Mode. This is what you use to change the color mode and appearance on the entire image. We discussed RGB, the web mode, and CMYK, the print mode earlier. We have some other choices here, including gray scale and duotone. Some modes' availability depends on the pre-existing color mode.   Adjusting Images   You can see that the adjust option on the images menu give you a lot of different tools for adjusting your image. The most basic types of adjustments you can make                                                                                 An Introduction to Visual Communication  Training Manual on Theeranaipunya - Equipping Fisherwomen Youth for Future 167  with Photoshop involve colors and brightness. The most simple is the contrast/brightness adjustment. When you select contrast/brightness, you are confronted with a dialog box with a slider for both brightness and contrast. Moving the sliders to the left makes the picture murkier or darker, and moving the sliders to the right brightens and increases the contrast between the dark and light colors in the image. You can play around with both sliders until you get a suitable mix; the change is previewed in the image. This tool is helpful for brightening pictures that were taken in low light. The other adjustments you can make with the options on the adjustments menu are a little more complex, and the best way to learn about them is just to experiment. Because Photoshop allows to preview the adjustments.  Flattening your image and some background on layers Now if you go to above menu, press Layer > Flatten image. All of your layers become merged. No matter how many layers you had, they all become one layer, one image. Use the “arrow” move tool again. Now the whole image moves. Even after the layer is unlocked the image is still in this flattened state and you can’t edit the text or modify the image.  Resizing your image Go to Image > Size and change it. Let’s take a look at this:    Resizing the canvas  You can do the same thing with the background canvas you are working on. You can enlarge or shrink your workspace. To do this you would go to Image > Canvas Size. Hit this and you will get a similar dialogue box to the image size box. You can see it below. It will not affect your image but if you make the canvas too small some of your image may be hidden. Play around with the size and make your canvas bigger. Abhilash .P.R    168 The less you explain the better the design    Crop function  The Crop function in the image menu is pretty straight forward. Make a selection; got to Image and select crop, and then everything outside you selection disappears. The image size reflects the change.  Layer Management   Layers pane   The layers pane is one of the panes that its best keep visible at all times. If you don't see it when you open Photoshop, go to window>show layers and it will be restored.     The Layers Pane   A note on working with jpeg file copied from other applications: If you've pasted in a jpg image. You'll notice that there is only one layer. If you open a jpeg image. This layer will be called "background" and will have a lock icon demonstrating that it is locked. In order to unlock it, double click on the layer name in the payer pane and change the name. The layer is now unlocked. Depending on how you plan to alter this image, it may be a good idea to leave this layer alone, and do your work on other layers.   Adding New Layers   The layers appear in the layers pane as they are organized in the document. To demonstrate this, we'll add a new layer and type a little on it. Go to Layer>and select new layer. Type a name for the layer in the dialog box that appears and hit enter. It should now appear in the layers pane (but since it is currently empty, there will be no sign of it in the image. Select the text tool from the tool bar and click &drag                                                                                 An Introduction to Visual Communication  Training Manual on Theeranaipunya - Equipping Fisherwomen Youth for Future 169  somewhere on the image (making sure the new layer is still highlighted in blue).   Selecting Layers   Select the Type tool and type a little. You can see that the type appears on top of the image now; we'll use these two layers to learn how to use the layers pane.   Arranging Layers   Also, you can manually arrange the layers. Click and drag your text layer underneath the original image layer. You'll see that the text no longer appears. That is because it is now located behind the opaque image layer.   Combining ("Merging") layers:   Sometimes you'll want to combine the contents of two layers onto one layer. Select the layer you want to be on top of the new merged layer, make sure the other layer you'd like to merger is directly beneath it, and select Merge Down from the Layer menu. The two layers are now one. If you want to merge down an entire file of layers, select "Flatten image" from the layers menu, then all layers will be squashed into one. When you merge or flatten layers that contain text layers, you will be asked whether you'd like to rasterize that text (that is, convert it to an image and lose the ability to edit it). (Copy any layers and hide them before you rasterize and merge. It saves you the work of completely recreating layers if you decide to change text.)   Ctrl-c1ick for selecting a layer   To easily select the entire contents of a layer, press ctr! and click on the preview box for that layer in the layers pane.   Working With Text in Photoshop   The tools Photoshop provides for manipulating text are probably its most straight forward features. You just select the I T text tool, click, and drag, and you are ready to type. Use the options bar to change the style of highlighted text.   Text styles in the options bar    When you engage the type tool, what you type automatically becomes its own layer and is given what is typed as a layer name. This is a very helpful feature when dealing with multiple text layers. Double click the T to easily edit the text. If you want to merge a text layer with an image layer, the text layer must be rasterized, or converted to an image first. Once this is done, you can no longer edit the text. Unless you are using text in an illustration or altering letters, this may not even be necessary.   Abhilash .P.R    170 The less you explain the better the design  Colours and Graphics   The foreground color, which will be applied by tools like the paintbrush, is represented by the top square at in the middle of the toolbar.   Foreground  Background colours  To change this colour, double click the square. This reveals the color picker, where you can pick a colour with several different methods including RGB values, hexadecimal codes, and by simply selection. If you are making an image for the web, it is best to check the "only web colors" box to ensure that no dithering (reductions in color quality) will take place. Once you have picked your color, click ok, and you are ready to go.   Stroke &Fill   The most basic ways to apply colors to an image are to use Fill and Stroke, both available on the edit menu. Make a selection, and choose fill from the edit menu. A dialog will appear asking you to make some decisions about colors and transparency. Make your selections, and press ok to fill the selection with the chosen color. Stroke operates in much the same manner, though you are given the chance to determine the weight of the lines you create.   Save for Web   When you're working on a .psd, you're likely going to want to eventually to have your file saved as a gif or jpg. In the file menu, you can select "Save for Web," located under save, to do so. When you select it, a new window will open allowing you to make choices about how you want to save and optimize your image. You can select transparency options, matte colours, and file types to apply. This way, you don't need to flatten your .psd just to get a jpg or gif Image.   Playing with filters   To really get a feel for what Photoshop can do, PLAY WITH FILTERS! Just make a  selection and try something                                                                                 An Introduction to Visual Communication  Training Manual on Theeranaipunya - Equipping Fisherwomen Youth for Future 171  from the filters menu. Because you have multiple levels of undo and step backward, you can try some really elaborate combinations of effects.   Short cut keys used in Adobe Photoshop  Selecting Layer Shortcuts Draw Marquee from Center Alt-Marquee Create new layer Ctrl-Shift-N Add to a Selection Shift Delete Layer Delete key (while in the Move tool) Subtract from a Selection Alt View contents of layer mask Alt-Click layer mask icon Intersection with a Selection Shift-Alt Clone layer as you move it Alt-Drag Make Copy of Selection w/Move tool Alt-Drag Selection Find/Select layer containing object Right-Click on the object w/Move tool Make Copy of Selection when not in Move tool Ctrl-Alt-Drag Selection Change layer opacity Number pad keys (w/Move tool selected) Move Selection (in 1-pixel Increments) Arrow Keys Move layer below/above current layer Ctrl-[ or Ctrl-] Restore Last Selection Ctrl-Shift-D Type Shortcuts Viewing Select all text on layer Double-Click on T thumbnail in Layers panel Fit on Screen Double-click on Hand tool or Ctrl-0 Increase/Decrease size of selected text by 2 pts Ctrl-Shift->/< 100% View Level (Actual Pixels) Double-Click on Zoom Tool or Ctrl-Alt-0 Increase/Decrease kerning/tracking Alt-Right/Left Arrow Zoom in Ctrl-Space-Click or Ctrl-Plus(+) Align text left/center/right Ctrl-Shift-L/C/R Zoom out Alt-Space-Click or Ctrl-Minus(–) Painting Abhilash .P.R    172 The less you explain the better the design  Hide all tools and panels Tab Fill selection with background color Ctrl-Backspace Hide all panels except Toolbox and Options bar Shift-Tab To get Move tool While in any painting/editing tool-hold Ctrl Rotate through full screen modes F Change paint opacity (with Airbrush OFF) Number keys Scroll image left or right in window Ctrl-Shift-Page Up/Down Change paint opacity (with Airbrush ON) Shift-Number keys Jump/Zoom to part of Image Ctrl-drag in Navigator panel Decrease/Increase Hardness of Brush Shift-[ or Shift-]  Tools V Move P Pen tools M Marquee tools T Type tools E Eraser tools D Default colors K 3D Tools H Hand R Rotate View Z Zoom N 3D Camera Tools L Lasso tools G Gradient, Paint Bucket X Switch Foreground and Background colors O Dodge, Burn, Sponge Q Quick Mask Mode W Quick Selection, Magic Wand A Path Selection, Direct Selection C Crop and Slice Tools J Spot Healing Brush, Healing Brush, Patch, Red Eye S Clone Stamp, Pattern Stamp Y History Brush, Art History Brush B Brush, Pencil, Color Replacement, Mixer Brush U Rectangle, Rounded Rectangle, Ellipse, Polygon, Line, Custom Shape  Fostering design thinking through mentoring young women is particularly exciting, it helps them to be fresh and active in their mind.   

An Introduction to Visual Communication Tools

http://eprints.cmfri.org.in/10808/1/Theeranaipunya_Abhilash.pdf

An Introduction to Visual Communication Tools

Abstract

Similar works

Full text

Available Versions

CMFRI Digital Repository