To begin with, I designed a logo for a fictional game. The specification stated that the game was to be called UFO: Invasion of Earth, and had to include the colour RGB (170, 255, 0). It also needed to be 320 pixels wide and 240 high, at a resolution of 300 DPI or higher.
I created the image in Photoshop using a number of techniques. A number of images showing the development of the logo are shown below.
I also designed a poster for the fictional game. Below, eight steps of progression I took are shown and explained, and the first version of the poster is shown.
I used several images from the internet in the creation of the poster. Links to the websites from which I downloaded the images are given below.
The size of the brush is one of the main properties that can be changed by the designer. By increasing the size of the brush, the area that it covers when used increases. When the brush tool is selected, the size of the brush tip can be changed by pressing the [
and ]
keys on the keyboard.
The hardness of the brush is another aspect of the tool which has a great effect. By increasing the hardness of the brush, the edge of the area of colour that the tool creates will be more defined and less blurred. A lower hardness is more useful when shading objects and creating soft blends of colour. Like the brush size can be adjusted with the keyboard, the {
and }
keys can be used to change brush hardness, which is usually performed by holding Shift
and pressing the [
and ]
keys.
The opacity and blending mode of the brush can also be changed. The opacity of the brush refers to the intensity of the colour when the tool is used. The blending mode changes how the colour added to the image reacts with the content already on the layer. For example, using the brush tool with the foreground colour set to white, the opacity to around 20% and the blending mode to Overlay yields a tool similar in effect to the dodge tool. Brush packs can also be downloaded online which can add more brush tip shapes to Photoshop.
The eraser works in much the same way as the brush tool, except that it takes pixels away rather than adding them. As a result of this, the blending mode option is not available as it is for the brush tool as such a setting is irrelevant when subtracting pixels from an image.
As well as the brush mode, which allows the changing of brush tip size, hardness and opacity, the eraser tool offers pencil and block modes. These modes use circular and square brush tips respectively, but do not use anti-aliasing to make the result smoother. This may be seen as a disadvantage in many cases, but is useful when designing in pixel-art styles.
Creating and modifying selections is one of the most common tasks in Photoshop, and there are a number of tools to make this as easy as possible. The marquee tools allow the user to draw anti-aliased selections in various shapes, such as rectangles and ellipses. The lasso tools allow one to create freehand and polygon-shaped selections, which can often be used as a quick alternative to creating a path with the pen tool and converting the result to a selection. The magic wand allows the user to create complex selections by clicking in areas of similar colours around an object. The tool will detect boundaries between strongly contrasting areas of colour, and place the edge of the selection at this point.
Once a selection has been made, there are a number of tools available in the Select menu that allow one to perform operations such as feathering (blurring) the selection, expanding or contracting the selection, and saving the selection for later use. One can also use the usual selection tools in addition, subtraction or intersection modes to build on the current selection.
Once a selection has been made, it serves many purposes. If one is being used, the brush tool, for instance, will only be effective inside the selected area. The same goes for similar tools like the eraser.
In order to gauge the success of the images I created, I asked members of my class to fill out a small form about the poster and logo. I took their feedback and recommendations into consideration and changed both.
While I was developing the images, I used the Photoshop Document file format, which uses a .psd
file name extension. I did so that all of the layers, typography, layer styles and blending modes I was using would be preserved when the file was saved. Using this format means that the project can be saved and picked up again at a later date without the loss of any information.
Because the PSD format saves all of the data in the image, and does so losslessly, the files generated are very large. This is not ideal for transmission over the web or even saving when storage space is limited. The PSD format can also only be read by a limited number of programs. PSDs cannot be embedded in Word documents or in webpages, and Photoshop is generally considered a requirement is one wishes to view a PSD. The majority of people viewing the file would also not need the layers, layer styles, etc. to be editable, and would be better suited with a single, flattened image in a more compatible format.
For these reasons, I chose to use the PNG format for the final logo. This format is lossless, like a Photoshop Document, meaning that no quality is lost when the file is saved and reopened. PNGs also support alpha transparency, meaning that I can save the image as it is with a transparent background. This makes the image much easier to use in practice, such as when it came to importing the image back into Photoshop to create the poster.
Also for the reasons mentioned before, I chose to use the JPEG format for the poster. As most of the image was comprised of photographic or photo-realistic imagery, the JPEG format was more suited. Using advanced compression techniques, the JPEG format is able to save many images in a much smaller amount of digital space. PNGs are better suited to digital graphics created solely on the computer, that don't use photographic images and which must be saved losslessly. For photos and similar-style images, the JPEG format is better suited.
In order to compress the images as much as possible, I used the "Save for Web" feature in Photoshop, which can be used to save images in a number of formats commonly used on websites and in mobile applications. I then compressed them a little more using the optipng
and jpegoptim
Linux utilities for PNG and JPEG files respectively. Optimisation of image files usually involves the removal of excess information and metadata, and sometimes resampling and recompression.
When saving the files in the "Save for Web" dialogue, I was fairly conservative with compression. As the PNG format is lossless, the compression options are not hugely extensive, but there is a quality slider one can adjust when saving JPEGs. The slider is able to represent any number between zero and one hundred, and I used a setting of around eighty-five to ninety when saving the poster and progression images. This retains the vast majority of the quality, while still providing a good amount of compression. The difference in file size between an image saved with a quality setting of one hundred and one saved at ninety is a lot more than that between images saved at eighty and ninety, but the loss of quality is very similar. The settings I used are settings which I have found to be a good balance between quality and compression.
For the logo, I used a resolution of 300 PPI (pixels per inch), despite the fact that the logo would much more likely be included in digital content (which would only warrant a resolution of, typically, 72) than in print. By using a higher resolution, however, I ensured that the image will appear at a more appropriate size when the file is imported into other applications such as Microsoft Word. As content created in Word is generally intended for print, the image will be placed on the document at a size which will keep the image high-quality even when printed, which requires a much higher amount of pixels per square centimetre/inch than a digital screen.
In order to keep the images lossless, I used a colour depth of 24 bits per pixel. This was true for both the poster in JPEG format and the logo in PNG format. This colour depth is often referred to as "16-million colours", and can represent up to 2563, or 16,777,216, colours. This is also referred to as true colour, as very few projects call for more colours to be available.
For some of the progression images for the logo, I used the PNG-8 format rather than the usual PNG-24. This format uses only 8 bits per pixel, but includes an index of colours defined at the beginning of the file. An 8-bit PNG file can have any of the usual 24-bit true colours, but a file can only use up to 256 of them. For some of the earlier progress images, fewer than 256 colours were required to perfectly reconstruct the image, and for others very little quality was lost. Despite the minimal loss in quality when using PNG-8 over PNG-24, some of the files were as little as half the size.