# How to create a low resolution video with data received from UART?

**URL:** <https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376>\
**Category:** Electronics (Arduino, etc.)\
**Created:** [August 16, 2022, 7:38am UTC](https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376 "2022-08-16T07:38:05Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![onelectron](https://avatars.discourse-cdn.com/v4/letter/o/7993a0/32.png) [@onelectron](https://discourse.processing.org/u/onelectron)\
**Post date:** [August 16, 2022, 7:38am UTC](https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376/1 "2022-08-16T07:38:06Z")

</div>

Hello,  
I am planning to send data through the COM port to Processing to construct a low-resolution image based on the collected data. As it is being sent over UART, I assume that the refresh rate will be very low. My idea is to create different segments of 5x5 pixels. So if I have only 25 data points, the image will be 25 pixel based (each data point will be considered as an individual pixel). And I will only increase the number of data points by 25.

First, I thought of using the rect(a, b, c, d) function for each pixel and the fill(a) function to use the UART data as color. I wanted to use the 5x5 section to create two different loops. One will be called to draw the 5x5 pixel image and then, based on how many 5x5 segements I have, I’ll call the other function to add the other 5x5 blocks to different sides of the first block. My primary goal is to add at least four of those blocks.

And even just thinking about this process made me realize that it can be very slow. Is there any way I can make the process quicker?

Thanks

---

<div class="post-metadata">

**Author:** ![JSGauthier](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jsgauthier/32/9910_2.png) [@JSGauthier](https://discourse.processing.org/u/JSGauthier)\
**Post date:** [August 17, 2022, 2:02am UTC](https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376/2 "2022-08-17T02:02:01Z")

</div>

Your idea seems sound. I would suggest that any implementation you choose to work out will help you define how “fast” or “slow” the code is. You can then see about ways of improving it.

It seems to me UART can run quite quickly, (Common values for baud rate are 9600, 1200, 2400, 4800 , 19200, 38400, 57600, and 115200 bps) it just depends how many calculations you wish to send per loop cycle from your arduino or from processing’s draw loop.

Share some of your code and members will jump in to help.

[https://www.circuitbasics.com/how-to-set-up-uart-communication-for-arduino/](https://www.circuitbasics.com/how-to-set-up-uart-communication-for-arduino/)

🙂

---

<div class="post-metadata">

**Author:** ![onelectron](https://avatars.discourse-cdn.com/v4/letter/o/7993a0/32.png) [@onelectron](https://discourse.processing.org/u/onelectron)\
**Post date:** [August 17, 2022, 8:24am UTC](https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376/3 "2022-08-17T08:24:35Z")

</div>

Thanks. I have already completed the UART communication code. It seems to work. but still have not completed the design. If there is a speed-related issue, then I can use this example to see if there is any improvement.

By the way, is there some way I can select a thermal camera type color palette other than using RGB to fill the squires? I have seen fill() as the primary way to select color for an object.

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [August 17, 2022, 11:59am UTC](https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376/4 "2022-08-17T11:59:37Z")

</div>

Hello @onelectron,

Check out the resources (tutorials, references, examples, etc.) here:

> **[Welcome to Processing!](https://processing.org/)**
>
> Processing is a flexible software sketchbook and a language for learning how to code. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology…

The tutorial on _Color_ and _Images and Pixels_ and the the _Color_ and _Image_ sections in the references is a good place to look.

`:)`

---

<div class="post-metadata">

**Author:** ![JSGauthier](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jsgauthier/32/9910_2.png) [@JSGauthier](https://discourse.processing.org/u/JSGauthier)\
**Post date:** [August 17, 2022, 12:55pm UTC](https://discourse.processing.org/t/how-to-create-a-low-resolution-video-with-data-received-from-uart/38376/5 "2022-08-17T12:55:37Z")

</div>

There are several ways to to select and designate colours.

> **[Reference](https://processing.org/reference/colorMode_.html)**
>
> Changes the way Processing interprets color data. By default, the parameters for fill(), stroke(), background(), and color() are defined by values between 0 and 255 using t…

You can also create your own palette by using the colour selector found in the top /tools menu.