GPT Pixel Art is an interactive web application designed to facilitate the communication between users and OpenAI's language model, chatGPT, in the realm of pixel art creation. Users can create pixel art designs, convert them into a code format, and feed this code into chatGPT. In return, the user can take the output from chatGPT and visualize it back in the web application.

The hosted version of the application can be found here.

The goal of this project is to explore how chatGPT, a language model, interacts and generates pixel art. It is a part of a broader investigation into the capabilities of AI and machine learning when applied to art and creativity.

Creating Pixel Art:

1. Access the app via the link above, or clone the repo and run it locally.
2. In the "Art" section on the left, you will see a 16x16 grid where you can draw your pixel art.
3. Select a color using the color picker above the grid.
4. Click on the cells (pixels) in the grid to fill them with the selected color.
5. To change the color, pick a new one from the color picker and continue drawing.

Interacting with chatGPT:

1. After you've created your pixel art, press the "Convert to Code" button. This will transform your art into a code snippet.
2. Copy the generated code snippet from the "Code" section on the right. You can now paste this code snippet into the chatGPT model for interaction.
3. Example:

This is pixel art that I drew. Please describe what it is.
[["rgb(255, 255, 255)","rgb(0, 0, 0)"],[[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,1,0,0,1,0,0,1,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,1,1,1,0,0,1,0,0,0,0,0],[0,0,0,0,1,1,0,0,0,1,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]]]

Visualizing chatGPT's Art:

1. Ask chatGPT for pixel art given the format of the system. Example:

This is an example of the code generated by this app: [["rgb(255, 255, 255)"],[[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0],[0,0,0,0,0,0,0,0,0,0]]]
Please create a smiley face in this 10x10 grid using this format

1. Paste the code you copied from chatGPT into the text area in the "Code" section on the right.
2. Press the "Draw from Code" button. This will render the pixel art corresponding to the code in the "Art" section.

Enjoy this new way of creating and interacting with pixel art through chatGPT!

Feel free to fork this project, create issues, or submit pull requests. Any contributions, no matter how small, are greatly welcomed!