302 CHAPTER 9: Android Graphic Design: Making Your UI Designs Visual
Imaging Concepts, Formats, and Techniques
The first thing that we need to do is to get a “knowledge foundation” regarding the concepts,
formats, and terms which we are going to use during the rest of this book, regarding working with
digital images. This area is most commonly called graphic design, although I am going to approach
it from a more professional “digital imaging” and “image compositing” standpoint.
The concepts, formats, techniques, and terminology that I cover in this chapter will also apply to
animation and digital video new media assets, as both of these are based on digital imagery in one
way or another, so we will be able to build on the knowledge base created in this chapter in future
chapters, which I am trying to do in each and every chapter in this book, so your knowledge of
Android increases exponentially, and in a logical fashion.
First, we will cover the pixel, the foundational element of the digital image, and then the concept of
resolution, or the size of the digital image, and then the concept of aspect ratio, or the shape of the
digital image. Once we are done with the second dimension (2D) aspects, we will go into the third
dimension (3D) and look at how the colors of each pixel are created using red, green, and blue (RGB)
layers of color or color “plates” and then at how transparency is defined within an image using a
fourth “alpha” layer which contains transparency values.
After that, we’ll get into more advanced digital imaging concepts like compositing and pixel
blending, and take a look at how all this knowledge is used when using digital image formats and
codecs to compress image assets.
The Foundation of Digital Images: The “Pixel”
Digital Images are made up of two-dimensional, or 2D, arrays (grids) containing “pixels.” The
industry term pixel is a conjugation of two words: pictures (commonly called pix) and elements
(shortened to be just els).
The number of pixels in any digital image asset should be expressed using a term called resolution,
which is the number of pixels in both the width (denoted using a W or an X for the x-axis) and the
height (denoted using an H or a Y for the y-axis) image dimensions. The resolution of an image
asset is usually expressed using two (X and Y) numbers with an “x” in the middle, such as 800x480,
or using the word “by,” such as 800 by 480 pixels.
To find the total number of pixels that are in a 2D image, simply multiply the width pixels by the
height pixels. For instance, an HDTV resolution 1920 by 1080 image will contain 2,073,600 pixels,
over 2 million pixels, also referred to as two megapixels. The more pixels which are in an image, the
higher its resolution.
Just like with digital cameras, which range from 3 megapixel smartphone cameras to 75 megapixel
DSLRs, the more megapixels that are in the digital image grid or array, the higher quality level the
image will have. This is why 4K UHDTV screens, which have a resolution of 4096 by 2160, are
becoming quite popular.
Android supports everything from low-resolution 320 by 240 pixel display screens on Android
smartwatches, such as the Neptune Pine or entry-level flip-phones and small screen phones, to
medium-resolution 854 by 480 pixel display screens on mini-tablets and smartphones, to
high-resolution 1280 by 720 pixel display screens on HD smartphones and medium size tablets,