Digital Graphics in videogames History of digital graphics:
Computer game graphics have improved a lot in the last 20 years in many different ways. This is due to the technology improvement in the past years which has seen a vast improvement in graphics used in games. Examples of this is how players now are able to play games in high definition and play online with friends on the same game, this could not be done 20 years ago. In this article I will cover many topics like art styles in games and the graphics used etc. This will aid my gaming development as I will learn some necessary information that I may need to use in my own game. The work on the art styles and graphics will help me create my sprites for my game and the game cover.
Artistic styles used in games: graphics that are essentially computer generated images, models and textures that are designed to be as realistic as possible.
- Photorealism:
- Cel-shading: graphics that are not meant to look realistic its a unique style that gives the effect that someone has drawn the graphics on by hand.
Examples of videogame graphics:
There are many computer game graphics that are in use. Examples of different computer game graphics are 2D games where pixel art can be used to design the 2D sprites(eg Mario) , some games are in 3D which means that the sprites have to be isometric shapes this is so the sprites have equal measurements on both sides so the 3D can be made (eg assassins creed) . There are other types of graphics like 2.5D this is where 2D sprites are put on a 3D background or a 3D sprite on a 2D background (eg sonic or donkey kong). Other style of graphics used in videogames are first person shooters (call of duty) , third-person view (splinter cell) and a side-scrolling style (eg mario). All of these examples work in games and have been used a lot.
- Abstraction: This style often employs a lot of lines and geometric shapes that don’t resemble any real-life objects. The abstraction style is best suited for and found in most retro games.
- Exaggeration: This style is normally adapted from anime/ manga, the style is over the top and not realistic. This gives the game a certain fun factor.
Examples of concept art:
Examples of print media art in game design: Box cover-
Here is a good example of concept art for character design as it shows the steps a designer has to go through to design a well developed character. As you can see the designer focuses on each part of the armour that the character wears and looks at batman with no armour and with armour to show the contrast between the two, so they can decide which one looks better and most suits what they are trying to do.
This is a very important factor of game design as if the box cover is eye-catching with bright colours and bold text with gripping pictures and description this will make more people pick up your game. Whereas if it was dull and boring people may miss your game. This is why many game producers put a lot of effort into the box cover as it could draw people to look at your game and potentially buy and play your game. A good example of a great box cover can be seen below.
Manual-
The manual is important as it helps the player by showing them the instructions of the game which also shows what button does what, this helps as the player can learn how to play before they start which gives them a head start. The manual also gives an outline of the storyline so the player can understand the story. so the manual is very helpful for players and is very important to have.
PosterGame packaging-
Here is an example of concept art for the environment used in a game. This is important as the designer will get to see what the idea looks like on paper and then decide whether that design will suit the game or not. There is also a lot of detail put into to this concept art as the designer has to make it feel as real as possible so they can see whether it will suit the game world.
Video game packaging refers to the physical storage of the contents of a PC or console game, both for safekeeping and shop display. In the past, a number of materials and packaging designs were used, mostly paperboard or plastic. Aside from the actual game, many items may be included inside, such as an instruction booklet, teasers of upcoming games, subscription offers to magazines, other advertisements, or any hardware that may be needed for any extra features of the game.
The poster for the game has the same purpose as the box cover, this is to catch the player’s eye and make them look at the poster. The way game producers do this is by making the poster stand out with bold text, big pictures, bright colours and gripping text. This is important as this makes people read the poster and could lead them to buy and play the game.
Explaining pixel:
Picture element- In digital im-
aging, a pixel, pel, or picture element is a physical point in a raster image, or the smallest addressable element in an all points addressable display device; so it is the smallest controllable element of a picture represented on the screen.
Image resolution- Image resolu-
tion is the detail an image holds. The term applies to raster digital images, film images, and other types of images. Higher resolution means more image detail. Image resolution can be measured in various ways.
Intensity- Intensity images measure the amount of light impinging on a photosensitive device. The input to the photosensitive device, typically a camera, is the incoming light, which enters the camera’s lens and hits the image plane. In a digital camera, the physical image plane is an array which contains a rectangular grid of photosensors, each sensitive to light intensity.
Character design:
This is a major part of game design as the characters in the game will be one of the most important things in your game, as they are the mascots for your game so if they are well detailed and stand out and have a great backstory your game will be really successful but if they are dull that means they will be unsuccessful. There are different stages of character design: - The role the character will have on the game eg. is he or she the main charcter or a character that helps out. - Decide the gender of your character. - Think of a backstory the character has eg. whether the character is out for revenge or if they had a bad childhood. - Think of the personality of the character and think of the strengths or weaknesses of the character. - Think of the traits of the charcter eg is he strong? Is she pretty? - Finally use the traits and personality
of the character and use it to piece together the appearance of your character. Eg. If he is strong and confident he will have a fairly strong appearence whereas if he is weak and shy he will have a very timid appearance. Also different games need different types of characters like 2d games need pixel sprites as their characters, this means that the character will have an exaggerated look and not realistic and would probably use bright colours to make it look more fun. An example of this is Mario or Mega man, as you can see below.
On the other hand if the game required is a 3D game the character has to be a 3D isometric character. This design can be used for any 3d genre game so depending on the genre the character will suit the type of game, such as an action game the character will look heroic and strong but if it was a horror game the character will look creepy and evil etc.
Using photoshop:
Raster image- In computer graph-
ics, a raster graphics image is a dot matrix data structure representing a generally rectangular grid of pixels, or points of color, viewable via a monitor, paper, or other display medium. Raster images are stored in image files with varying formats, such as bmp, gif and jpg
Vector image- Vector graphics is the use of geometrical primitives such as points, lines, curves, and shapes or polygons—all of which are based on mathematical expressions—to represent images in computer graphics. This would be useful to design a logo for your game etc. File extension- a string of charac-
ters attached to a filename, usually preceded by a full stop and indicating the format of the file. Examples of this is bmp, png, gif and tiff etc.
Compression:
Lossy- lossy compression reduces a file by permanently eliminating certain information, especially redundant information. When the file is uncompressed, only a part of the original information is still there (alt hough the user may not notice it). Lossy compression is generally used for video and sound, where a certain amount of information loss will not be detected by most users. The JPEG image file, commonly used for photographs and other complex still images on the Web, is an image that has lossy compression. Using JPEG compression, the creator can decide how much loss to introduce and make a trade-off between file size and image quality. Lossless- With lossless compres-
sion, every single bit of data that was originally in the file remains after the file is uncompressed. All of the information is completely restored. This is generally the technique of choice for text or spreadsheet files, where losing words or financial data could pose a problem. The Graphics Interchange File (GIF) is an image format used on the Web that provides lossless compression.
Image capture:
How has things become easier with image capture- Image cap-
ture has become a lot easier in recent years due to new machines that can get the job done quickly and efficently, such as digital cameras that can take pictures anywhere and anytime.
The other advantage of having digital cameras is that they are easy to carry round and they take high quality images quickly. A scanner has made image capture a lot easier in recent years aswell because in the past people had to design a cahracter than create it again on the computer, nowadays we can design a character on paper and then use the scanner to get it onto the computer quicker and faster than it would have been to make the character all over again. Finally tablets have made image capture a lot easier as you can take pictures and then use apps to add colour and effect to the images, this is extremely helpful as you can take a picture of your game character and then use apps on your tablet to add colours and effects such as shading. So image capture has improved a vast amount.
Image resolution- The Graphic
Resolution can optimise the file size and also optimise the quality of the image although both will not be optimised at the same time, for example, optimising the graphic quality will make the file size much larger which may not be that beneficial for you but the users will benefit from the higher visual quality. Whereas if you decide to reduce the graphic the file size will be smaller but the image quality will be worse, ultimately this is up to the users preference.
Image dimensions- Image dimen-
sions relate to the length and width of the digital image, by controlling the dimensions of the graphic you can then make the image smaller or bigger depending on the purpose or location of the image. When changing the dimensions of the graphic the volume of pixels stays the same, the only difference is the larger the image the more space the pixels have to cover.
Compression- Image compression
Optimizing: target image output- If you want
to get the best image possible, you should be aiming for the best image output. Depending on your screen quality the best image output will vary. But if you have a HD computer screen the best possible setting is 1080P.
Image bit depth-Bit Depth as pre-
viously stated is the volume of colour per pixel, reducing the bit depth will obviously reduce the image file size although the image quality is likely to suffer, generally deciding this involves making a decision between having good quality graphics with a slower load time or poorer quality graphics that enable the website to perform quicker.
is minimizing the size in bytes of a graphics file without degrading the quality of the image to an unacceptable level. The reduction in file size allows more images to be stored in a given amount of disk or memory space. It also reduces the time required for images to be sent over the Internet or downloaded from Web pages.
Storage of image assets: File size- Image file formats the normal way to store and organize digital graphics. They are made of either vector data, pixels, or a mixture of the two. The image file size is shown by the number of bytes. The greater the number of rows and columns, the greater the image resolution, and the larger the file size. This is why I will try and keep my file size as low as possible without ruining the images completely.
File-naming conventions- The
three most common image file formats and the most important for printing, scanning and Internet use, are TIFF, JPG and GIF. Each one has a different purpose so I will decide which file format suits the image I am trying to make.
Asset management- Digital asset management is made out of management tasks and decisions surrounding the annotation, cataloguing, storage and distribution of assets. Digital asset management systems have in it computer software and hardware systems that help in the process of digital asset management. In conclusion I have learnt a lot of new things by designing this article such as optimizing and how it helps the user in image design. I have also learnt about compression and how lossy and lossless compression is different from each other and what they both do. Now I am going to take this information and use it in the creative part of this unit, such as the character design and cover/poster for my game. My game will be a 2D side scroller which means I will need to design pixel sprites for my game and create everything out of piskels, so I will use the methods that I talked about to design a good character with a good backstory and characteristics etc. My game is also based in the wild west as a cowboy so my assets will have to suit that of a cowboy setting. I will also take from this how to edit images and what format type does what so when I am creating the cover for my game I will be able to do so with no real problem. Below is the potential title screen for my game (rayguns and revolvers).