TITLE: Cave Beetles
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: Cave Beetles is the final assignment for Creative Coding. It uses object oriented programming to make a simple game. The basic framework of the coding was provided for me but I made my own adjustments. Most obviously I put in assets I chose. I did not make the base assets, I took them from the game Spelunky 2, although I did myself code how the character animation works, using the same method as the sprite sheet animation. I coded how it moves from level to level and the increasing number of beetles to collect.

TITLE: Marionette Sage
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: Here I made an ‘eternal motion’ loop. What I did is I took a picture of myself and in photoshop separated each joint into its own image, using clone stamping to fill in to make the ends little nubs so that when moving independently the images don’t seem to detach themselves unnaturally. I used several canvases and canvases within canvases to make the arm and leg joints be connected while moving. To add character, I added the sticks on top as if it was a marionette.

TITLE: Dragon Heist Sprite Sheet Animation
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: For this, I created a sprite sheet of myself performing 5 actions. To do this I created 16 still frames each, set to loop seamlessly, and coded a program such that it would play each frame right after one another to loop. I also made it so that it would switch between each action as the mouse is moved toward the right. To add a bit of fun to it, I made it have a little storyline of stealing from a dragon, running away, only to find out that the bag of loot is empty. The background images were blatantly stolen from various places online.

TITLE: Curious Bunny
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: This project is a collage, combining multiple photos with changing properties. Based on the mouse movement, the hue, saturation, and opacity change. The bunny I drew myself using Adobe Illustrator. Each frame only shows if the mouse is in that part of the screen, a skill which became useful in the next assignment.

TITLE: Girlfriend/Boyfriend
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: Girlfriend/Boyfriend is a kinetic typography project where the image is made entirely of text which moves based on the mouse’s position. The image created is intended to be a simplified illustration of myself. As with many of my projects, I explored how I could visually represent my relationship with my trans-ness. Most of the words are lifted from Will Wood’s song “I/Me/Myself.” Looking back, I wish I had written my own text for this, since I was trying to work from a very personal place.

TITLE: Mandala
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: Here I created a mandala using code. I used irregular shapes to create visually interesting patterns. The mint green shapes were the trickiest to get to work properly, with figuring out the math to have the layer to rotate with the mouse, as well as getting it to close in around the center based on the mouse position.

TITLE: Ashiok
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 310 Creative Coding
PROFESSOR: Santiago Echeverry
SEMESTER / TERM: SP 23
INSTITUTION: University of Tampa
DESCRIPTION: For the first assignment in Creative Coding, I created a digital illustration based off of the character Ashiok from the card game Magic: the Gathering. I traced an image by coding shapes recreate it, taking some liberties with some details. The code is set to move the image up and down on its own with the mouse being used to control the wispy smoke. What I took away from this project was learning how to think about user interactivity in the context of code.

TITLE: Isaac Canvas
MEDIA: HTML5 Coding
SOFTWARE: Adobe Dreamweaver
CLASS: FMX 210 Digital Media
PROFESSOR: Blanka Roundtree
SEMESTER / TERM: FA 21
INSTITUTION: University of Tampa
DESCRIPTION: This project was the first time I worked with Dreamweaver, or coding anything for that matter. As per the assignment, the final product was a still image created through code. The image is based on the character Isaac from the video game series Binding of Isaac. To create it, I layered various shapes, some of which use Bézier curves and/or sine waves. The symbol on the forehead is meant to be the “Evil Eye” symbol, a symbol with variations found across multiple cultures.