狠狠撸

狠狠撸Share a Scribd company logo

WEB14103: Using Grid for Text

?
?
DOUP Limited
DOUP Limited

The document discusses different grid techniques for positioning text on images in Photoshop, including the rule of thirds, custom grids, and the golden spiral. It explains each technique and provides examples of applying text to portraits using each grid. For the rule of thirds, text is centered on the lower left crossover point. A custom grid follows the contours and lines in one portrait's background. The golden spiral overlay shows where the focus should be placed; text added in that position drew attention naturally.

1 of 10
Using Grids for Text WEB14103: Fundamentals of Web Design Project Theme 2 (Design) TOM SHARMAN WEB MEDIA RAVENSBOURNE
Introduction Using Portraits already taken as part of “WEB14103” unit, I will add text to some edited images using a number of grids such as the ‘rule of thirds’, a unique grid to the contour and lines of the image and also a ‘The Golden Spiral’ grid, popular in photography. Example of ‘Rule of Thirds’ grid.
Use of Thirds Grids in Adobe Photoshop CC The rule of thirds is a way of splitting up an image based on mathematical calculations. It breaks the image up into 9 equal parts on both the width and height. The text is centered on the lower left crossover point of the grid lines.
Experimentation with Rule of Thirds I have implemented the use of rule of thirds and using guidelines on Adobe Photoshop. This has sectioned the image into 9 equal parts. An example for this image is 29.5cm wide so each section is 9.83cm wide, this is also done for the vertical axis. I have added the text to the crossover between the crossover of the bottom square with the surrounding ones, this is popular in photography to draw a viewer into the content, similar to the spiral grid. I feel however this does not work with this time in particular as it conflicts with the character within the image and looks out of place.
Use of Custom Grid System in Adobe Photoshop CC I have used a custom grid system to follow contours and lines within the individual image to place text. This has been applied to the image and I have used the buildings in the background as a reference point for the lines.
Experimentation with Custom Grid System I also experimented with making up my own grid system based of the image itself and the features such as lines following the contours of the image. As you can see in the image to the right, there are natural lines, particularly in the background of the image such as street lamps and buildings etc. I added the text in using Adobe Photoshop CC, using the font “Bebas”. I feel using this grid system works well for my particular image and is a success.
Diagram of The Golden Spiral The diagram shows the golden spiral. This is a system used often by Photographers. It shows where the ideal position of the focus of the image should be. This is because naturally, a viewers eyes are drawn to this position of an image.
Experimentation with The Golden Spiral I have used the Golden spiral grid to place text onto the image used previously. An overlay of the diagram was placed above the image to show grid lines to reference from, then the text added in this position. My overall impressions of this method when adding text is that it is very good and certainly does work to focus your attention naturally to this part of the image, despite the image not following this common photography convention.
Use of Golden Spiral to place Text on an Image An overlay was used showing the golden spiral over the image to give reference as to the position of the text in relation to the image.
WEB14103: Using Grid for Text

More Related Content

WEB14103: Using Grid for Text

  • 1. Using Grids for Text WEB14103: Fundamentals of Web Design Project Theme 2 (Design) TOM SHARMAN WEB MEDIA RAVENSBOURNE
  • 2. Introduction Using Portraits already taken as part of “WEB14103” unit, I will add text to some edited images using a number of grids such as the ‘rule of thirds’, a unique grid to the contour and lines of the image and also a ‘The Golden Spiral’ grid, popular in photography. Example of ‘Rule of Thirds’ grid.
  • 3. Use of Thirds Grids in Adobe Photoshop CC The rule of thirds is a way of splitting up an image based on mathematical calculations. It breaks the image up into 9 equal parts on both the width and height. The text is centered on the lower left crossover point of the grid lines.
  • 4. Experimentation with Rule of Thirds I have implemented the use of rule of thirds and using guidelines on Adobe Photoshop. This has sectioned the image into 9 equal parts. An example for this image is 29.5cm wide so each section is 9.83cm wide, this is also done for the vertical axis. I have added the text to the crossover between the crossover of the bottom square with the surrounding ones, this is popular in photography to draw a viewer into the content, similar to the spiral grid. I feel however this does not work with this time in particular as it conflicts with the character within the image and looks out of place.
  • 5. Use of Custom Grid System in Adobe Photoshop CC I have used a custom grid system to follow contours and lines within the individual image to place text. This has been applied to the image and I have used the buildings in the background as a reference point for the lines.
  • 6. Experimentation with Custom Grid System I also experimented with making up my own grid system based of the image itself and the features such as lines following the contours of the image. As you can see in the image to the right, there are natural lines, particularly in the background of the image such as street lamps and buildings etc. I added the text in using Adobe Photoshop CC, using the font “Bebas”. I feel using this grid system works well for my particular image and is a success.
  • 7. Diagram of The Golden Spiral The diagram shows the golden spiral. This is a system used often by Photographers. It shows where the ideal position of the focus of the image should be. This is because naturally, a viewers eyes are drawn to this position of an image.
  • 8. Experimentation with The Golden Spiral I have used the Golden spiral grid to place text onto the image used previously. An overlay of the diagram was placed above the image to show grid lines to reference from, then the text added in this position. My overall impressions of this method when adding text is that it is very good and certainly does work to focus your attention naturally to this part of the image, despite the image not following this common photography convention.
  • 9. Use of Golden Spiral to place Text on an Image An overlay was used showing the golden spiral over the image to give reference as to the position of the text in relation to the image.