anievesdesign
Info
anievesdesign@gmail.com
December 18th, 2024
p5.js, Chat GPT
For Chris Swift’s Graphic Design Software II, we were taught how to create posters using p5.js. For our final project, we were tasked with creating a poster series using one of the design programs we learned (Figma, p5.js, or InDesign). I chose p5.js as there was seemingly an endless amount of possibilities for functionality. Inspired by the same sketch that led to Parabolic, I wanted to make something based on the star that is drawn using only straight lines. This process relied on Chat GPT’s ability to understand what I am trying to do and my own ability to understand basic code and how to communicate with the A.I. to achieve my desired result. After creating the star in p5.js, I imagined the ways in which a designer could utilize the graphic in something like a poster. I decided to turn this project into a simple poster generator, where users can move elements around and download what they have created onto their computer. I turned the star into a three-dimensional object that can be moved and rotated 360 degrees. I also made the RGB values of the star dependent on the x and y coordinates of the user’s mouse. I then added editable header and body text “boxes” which can also be moved around. Finally, I made 3 rectangular frames in which the content can be captured, and added the export function. When the user clicks ‘e’, whatever is within the three rectangles will be automatically exported as three separate JPEGs onto the user’s computer. This p5.js project can be accessed with this link here.