My Colourful Tattoo

Daniel McAdam, Thomas Graham, Natalie Le Huenen, Vivian Fu, and Erika Davis

Our project was designed to be a fun experiment of our capabilities. We thought it would be a fun idea to create a personalized image from the data that we had collected. The end result is a colourful image that is made up of multiple blocks of colour. The blocks of colour were determined by the data we had inputted in Processing. It works by beginning in the initial ‘input mode’. The user would type in their string, which is displayed on the screen. By pressing the Enter key after that, the sketch shifts to the ‘Draw Squares’ mode. In this mode, it cycles through each character in the input string and turns it into a hexadecimal value that it stores in an array. It then cycles through that array, pulling values for the each of the red, green and blue arguments of the fill() method. Before passing these arguments, it converts them into integers using the unhex() method. It uses the row and column indices of a 2D loop to set the position for a new square, coloured individually using the results of the fill() method. This accumulates into a grid to create a square. If the input is not enough to create a square, it pulls the previous row of colours down to extend it to the required size. After this, it waits for user input to either save the resulting image (‘S’) or return to ‘Input Mode’ (‘R’).

The image location was preferably near the hand as we thought it was a cool, futuristic idea. By having it on our hands, the square resembled a QR code. Because of the similarities, we thought it could be a new design for colourful and unique QR codes as each square was tailored to each individual.

Our code as well as our data set are referenced in GitHub:
https://github.com/thomasgraham97/Atelier-Color-Barcode

 

Process Images:

colourfultattoo_page_2_image_0001

colourfultattoo_page_3_image_0001

colourfultattoo_page_3_image_0002

colourfultattoo_page_4_image_0001

colourfultattoo_page_4_image_0002

colourfultattoo_page_5_image_0001

colourfultattoo_page_5_image_0002

colourfultattoo_page_6_image_0001

colourfultattoo_page_7_image_0001

Pressing ENTER activates the image-processing code:

colourfultattoo_page_7_image_0002

 

Final Images:

colourfultattoo_page_8_image_0001

colourfultattoo_page_8_image_0002

colourfultattoo_page_8_image_0003

colourfultattoo_page_9_image_0001

colourfultattoo_page_9_image_0002

This entry was posted in Experiment 2. Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

You must be logged in to post a comment.

Use of this service is governed by the IT Acceptable Use and Web Technologies policies.
Privacy Notice: It is possible for your name, e-mail address, and/or student/staff/faculty UserID to be publicly revealed if you choose to use OCAD University Blogs.