 Hello and welcome to this presentation. My name is Bernardi and in this video we'll learn how to take advantage of the indexed image format. First, what is a bitmap image? A bitmap image uses a two-dimensional array of color values where each element in the array is known as a pixel. For example, here we have a bitmap image of four pixels by four pixels. The total size is calculated as follows, height times width times color depth, which is the number of bits used to code one pixel. In this example, assuming a color depth of 24 bits or 3 bytes, the total size is 4 times 4 times 3, which is 48 bytes. Now, what is an indexed image? An indexed image consists of a color palette and a pixel array. The color palette lists up to 256 different colors specified either in 16-bit, 24-bit or 32-bit. The pixel array consists of one byte for each pixel. This byte is indexed into the color palette pointing out the color for the pixel. For example, here we have the pixel array with four different indexes, 0, 1, 2, 3, pointing out to four different colors, RGB1, RGB2, RGB3, RGB4. The index 0 points to the color RGB1, the index 1 points to RGB2, the index 2 points to RGB3, and index 3 points to RGB4. The total size of an indexed image is the size of the palette plus height times width. Now, assuming a color depth of 24 bits or 3 bytes, the total size is 3 times 4 plus 4 times 4, which is 28 bytes. Here we coded a 48-byte bitmap image into a 28-byte indexed image. The advantage of using indexed image format is the reduced amount of flash needed for storage compared to the bitmap images. And this helps to place the images into the internal flash, which are fast to display. The usage of indexed images is very useful in expensive operations such as texture mapper. In some cases, you can save the cost of external flash memory if you can use indexed image format for all the images and place them into the internal flash memory. Particularly, indexed images is suited for icons and logos because the number of different colors is low. The ChromeArt accelerator controller embedded in some STM32s families supports the indexed image format by hardware. Finally, TADGFX Designer makes it easy to generate indexed image format. Now we'll see together how to use TADGFX Designer to take advantage of the indexed image format. I will start by opening TADGFX Designer and then give a name to my application on the indexed image video. I will start from the application template for STM32 F769 discovery board and then use a blank UR. Click on Create. I will place a white box for my background. Expand it to cover my canvas. And then place an image to the canvas. And then select an image. I have this 200 by 200 image. I'll center the image here. And then if I go to the Image tab here and select the image, I see that the image is 565 or 16 bit format. I will generate the code and then hit Run target. Once the generation is done, I browse to TADGFX files. And then I go to build and then then folder. And here I open up the application.map file. This is the map file of the application. I do search image 1. And here I see the image size is hex format 13880 meaning it's 80 kilobytes. So 200 by 200 by 16 bit. So this gives us 80 kilobytes. Now I go back to TADGFX designer. Change the format to indexed format L8. And then generate the code again. Run target again. Once the generation is done, I go back to the map file. I update the changes here and see here for image 1. The size is 9C80 hexadecimal format meaning now the size of the image is 40 kilobytes. Using indexed image format reduced the size of the image from 80 kilobytes to 40 kilobytes. Thank you for joining me in today's presentation and we hope that you enjoyed learning how to take advantage of indexed image format.