{"id":75,"date":"2023-09-17T00:47:18","date_gmt":"2023-09-17T00:47:18","guid":{"rendered":"https:\/\/fmx298.santiago.bz\/kbustos\/?page_id=75"},"modified":"2023-12-02T08:13:46","modified_gmt":"2023-12-02T08:13:46","slug":"motion-capture","status":"publish","type":"page","link":"https:\/\/fmx298.santiago.bz\/kbustos\/motion-capture\/","title":{"rendered":"Coding"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls poster=\"https:\/\/fmx298.santiago.bz\/kbustos\/wp-content\/uploads\/sites\/180\/2023\/12\/Screenshot-2023-12-01-235313.png\" src=\"https:\/\/www.dropbox.com\/scl\/fi\/hb8dfpjlqhe8iymyjq0sa\/Sprite-Sheet-Made-with-Clipchamp.mp4?rlkey=3x1cnr5qo9hnp4u4r1k4wjqmj&amp;raw=1\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">TITLE: Sprite Sheet Fusions<br>MEDIA: Coding<br>SOFTWARE: Dreamweaver, Ibispaint<br>HARDWARE: Windows 11<br>CLASS: FMX 310 Creative Coding<br>PROFESSOR: Santiago Echeverry<br>SEMESTER \/ TERM: FA 23<br>INSTITUTION: University of Tampa<br>DESCRIPTION: I first referenced the run cycle of a cat as well as the way Pikachu ran. I then created two run cycel outlines. Then I worked on animating a few different characters with those outlines. Once the animations were colored and completed, I created a sprite sheet with them. I uploaded the sprite sheet into Dreamweaver. I then used the code to divide it into equally sized pieces and quickly run through the pieces based on where you placed your mouse. This made it appear as if the different sprites were running and the sprite would change based on how low or high you move the mouse.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls poster=\"https:\/\/fmx298.santiago.bz\/kbustos\/wp-content\/uploads\/sites\/180\/2023\/12\/Screenshot-2023-12-01-235223.png\" src=\"https:\/\/www.dropbox.com\/scl\/fi\/zm2hqdq1hv8ei1i11m4la\/KTRecording-Made-with-Clipchamp.mp4?rlkey=1fyvcygk26wx8cwg4mb89q6l6&amp;raw=1\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">TITLE: Stop Poaching<br>MEDIA: Coding <br>SOFTWARE: Dreamweaver, Photoshop<br>HARDWARE: Windows 11<br>CLASS: FMX 310 Creative Coding<br>PROFESSOR: Santiago Echeverry <br>SEMESTER \/ TERM: FA 23<br>INSTITUTION: University of Tampa<br>LINK: <a href=\"https:\/\/fmx310.santiago.bz\/FMX310\/fa23\/BUSTOS\/05%20KINETIC\/KTProject_12.html\">https:\/\/fmx310.santiago.bz\/FMX310\/fa23\/BUSTOS\/05%20KINETIC\/KTProject_12.html<\/a><br>DESCRIPTION:  I wanted to make a piece about the horrors of poaching. I found images of an elephant, removed the face, and made it a silhouette in Photoshop. I grabbed the code for the image and put it into Dreamweaver. I then repeated this for the baby elephant and the blood. I filled the blood with text and coded it to slide down the page. I then added a block of text to be inside the elephant that moved when you moved your mouse horizontally. Finally, I made it so text would appear when you hover over the baby elephant.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls poster=\"https:\/\/fmx298.santiago.bz\/kbustos\/wp-content\/uploads\/sites\/180\/2023\/12\/Screenshot-2023-12-01-235152.png\" src=\"https:\/\/www.dropbox.com\/scl\/fi\/igzpg09t736qjz589n850\/MandalRecording-Made-with-Clipchamp.mp4?rlkey=jm46d6eos5wsjg7yirlhjlypm&amp;raw=1\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">TITLE: Vector Mandala<br>MEDIA: Coding <br>SOFTWARE: Dreamweaver<br>HARDWARE: Windows 11<br>CLASS: FMX 310 Creative Coding<br>PROFESSOR: Santiago Echeverry <br>SEMESTER \/ TERM: FA 23<br>INSTITUTION: University of Tampa<br>DESCRIPTION: I found an image of a mandala I referenced. I then created multiple petals by tracing parts of the mandala. I placed them all on a different canvas. Then I drew the canvas and reaped it serval times. I also added interactive elements that moved when you moved the mouse around to each petal. Then I added in a background that also changed gradients based on where you placed the mouse to finish the piece.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls poster=\"https:\/\/fmx298.santiago.bz\/kbustos\/wp-content\/uploads\/sites\/180\/2023\/12\/Screenshot-2023-12-01-234955.png\" src=\"https:\/\/www.dropbox.com\/scl\/fi\/5kgbsygeeysv61yrryu9s\/InteractiveImgrecording.mp4?rlkey=s8bpqzt0sqcbquxd1a9jtq6z9&amp;raw=1\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">TITLE: Interactive Image<br>MEDIA: Coding <br>SOFTWARE: Dreamweaver, Photoshop<br>HARDWARE: Windows 11<br>CLASS: FMX 310 Creative Coding<br>PROFESSOR: Santiago Echeverry <br>SEMESTER \/ TERM: FA 23<br>INSTITUTION: University of Tampa<br>DESCRIPTION: I found several images I had taken and removed their backgrounds in photoshop. I placed them all together on a background image. I then used coding to apply filter to them that changed their appearence when I moved the mouse. Then I adjusted that code so some effects only worked when you hovered over cetain parts of the image with your mouse.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls poster=\"https:\/\/fmx298.santiago.bz\/kbustos\/wp-content\/uploads\/sites\/180\/2023\/12\/Screenshot-2023-12-01-234912.png\" src=\"https:\/\/www.dropbox.com\/scl\/fi\/wgcxxix7fkkaopfsfo2yz\/socksrecording.mp4?rlkey=ct1x0v3a641gv6x0497acodgm&amp;raw=1\"><\/video><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">TITLE: Socks<br>MEDIA: Coding <br>SOFTWARE: Dreamweaver<br>HARDWARE: Windows 11<br>CLASS: FMX 310 Creative Coding<br>PROFESSOR: Santiago Echeverry <br>SEMESTER \/ TERM: FA 23<br>INSTITUTION: University of Tampa<br>LINK<a href=\"https:\/\/fmx310.santiago.bz\/FMX310\/fa23\/BUSTOS\/01%20ILLUSTRATION\/KelseyBustos_Socks_28.html\">: https:\/\/fmx310.santiago.bz\/FMX310\/fa23\/BUSTOS\/01%20ILLUSTRATION\/KelseyBustos_Socks_28.html<\/a><br>DESCRIPTION: I first created the shapes useing coding to make lines curve from one point to anouther. I then added in the color, using code the make gradients to make it seem like they where shadows. Then I adjsuted to code so the colors of the ice changed based on the mouse postion. Finally I added in the code to repeate serval white dots to create snow and for a few ellipses to spin around eachother to create a snowflake.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>TITLE: Sprite Sheet FusionsMEDIA: CodingSOFTWARE: Dreamweaver, IbispaintHARDWARE: Windows 11CLASS: FMX 310 Creative CodingPROFESSOR: Santiago EcheverrySEMESTER \/ TERM: FA 23INSTITUTION: University&hellip; <a class=\"read-more\" href=\"https:\/\/fmx298.santiago.bz\/kbustos\/motion-capture\/\">Read more <span class=\"screen-reader-text\">Coding<\/span><\/a><\/p>\n","protected":false},"author":176,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-75","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/pages\/75","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/users\/176"}],"replies":[{"embeddable":true,"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/comments?post=75"}],"version-history":[{"count":10,"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/pages\/75\/revisions"}],"predecessor-version":[{"id":555,"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/pages\/75\/revisions\/555"}],"wp:attachment":[{"href":"https:\/\/fmx298.santiago.bz\/kbustos\/wp-json\/wp\/v2\/media?parent=75"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}