Final Project

Animal Blues Band

Spring 2024

HTML, CSS, Adobe Photoshop, Adobe Illustrator

Live Site: https://l4ypct.csb.app/

Dev Site: https://codesandbox.io/p/sandbox/final-project-image-template-forked-l4ypct?file=%2Findex.html%3A14%2C41


My final project was a comic book about a band of animals called the Animal Blues Band. My creation process involved using Photoshop and Illustrator to bring the animal characters to life. Each animal in the band is based on a real-life musician, and part of the fun is seeing if readers can guess which musician inspired each character. The Cat plays the role of the guitarist, the Dog is the bassist, and the Bear is the drummer. These funny animal musicians bring their unique personalities and musical talents to the story, creating a vibrant and engaging comic.

The project was not just about showcasing my technical skills that I’ve learned over this past semester but also about infusing humor and personality into each frame. The comic aims to evoke joy and laughter, as the whimsical scenarios and the quirky characteristics of the Animal Blues Band unfold. My hope is that readers will find the antics of these musical animals amusing and endearing, drawing parallels to their favorite musicians and enjoying the playful narrative.

Ultimately, the goal of the Animal Blues Band comic is to provide an entertaining escape, a lighthearted experience that resonates with music lovers and comic enthusiasts alike. By blending the worlds of music and storytelling through the lens of animated animals, the project aspires to leave readers with a smile on their face and a new appreciation for the creative possibilities of combining different artistic mediums, those being HTML, CSS, Photoshop, and Illustrator!

Credits:

“A light show”
Elijah Ekdahl. CC BY CC0 Flickr. December 16, 2019
https://unsplash.com/photos/empty-stage-with-lights-8XxF2kYHIgo

“Tilt Shift Photo of Acoustic Drum Set”
Elijah Ekdahl. CC BY CC0 Pexels. April 7th, 20181
https://www.pexels.com/photo/tilt-shift-photo-of-acoustic-drum-set-995301/

“Person Playing Guitar”
Jan Kopřiva. CC BY CC0 Pexels.
March 4th, 2020 https://www.pexels.com/photo/tilt-shift-photo-of-acoustic-drum-set-995301/

“Person Using Black Fender Stratocaster”
Yabee Eusebio. CC BY CC0 Pexels.
December 2nd, 2018 https://www.pexels.com/photo/person-using-black-fender-stratocaster-1656066/

“Bass guitar on tripod against musical score on stage”
Caleb Oquendo. CC BY CC0 Pexels.
April 23rd, 2021 https://www.pexels.com/photo/bass-guitar-on-tripod-against-musical-score-on-stage-7626333/

“Music Rock Guitar Instrument”
Markus Spiske. CC BY CC0 Pexels.
May 3rd, 2016 https://www.pexels.com/photo/music-rock-guitar-instrument-92069/

“A Drum Set in a Studio”
RDNE Stock project. CC BY CC0 Pexels.
June 3rd, 2021 https://www.pexels.com/photo/a-drum-set-in-a-studio-8197227/

“Baby Bear on the Woods”
Janko Ferlic. CC BY CC0 Pexels.
January 27th, 2020 https://www.pexels.com/photo/baby-bear-on-the-woods-3634930/

“Brown Bear on Brown Wood”
Janko Ferlic. CC BY CC0 Pexels.
May 11th, 2018 https://www.pexels.com/photo/brown-bear-on-brown-wood-1083502/

“A Pregnant Woman Exercising with Her Dog”
Antoni Shkraba. CC BY CC0 Pexels.
April 15th, 2021 https://www.pexels.com/photo/a-pregnant-woman-exercising-with-her-dog-7524680/

Close-Up Shot of a Corgi Dog Sitting
Antoni Shkraba. CC BY CC0 Pexels.
April 15th, 2021 https://www.pexels.com/photo/close-up-shot-of-a-corgi-dog-sitting-7524671/

Cute Gray Kitten standing on a Wooden Flooring
Marko Blazevic. CC BY CC0 Pexels.
 January 3rd, 2018 https://www.pexels.com/photo/cute-gray-kitten-standing-on-a-wooden-flooring-774731/

Gray Cat Sitting on Concrete Floor”
Enrique. CC BY CC0 Pexels.
 June 4th, 2022 https://www.pexels.com/photo/gray-cat-sitting-on-concrete-floor-12381417/

Creative Brief

Daniel Martinez

Animal Blues Band

Summarize your story: The story for my comic book is about a band of animals that go through the process of performing a concert. SImilar to how my first project was about a picture of a punk band with a cat and a dog, this will be a comic that expands on this. There will be a cat, a dog, and a bear within the band, each playing a guitar, bass, and drums, respectively.

Media: I will be embedding around 4 images of each animal for each of the 4 pages of the comic.

General Style/Emotion: The general style/emotion I want to convey is happiness but also a level of cuteness since at the end of the day, it is a band full of animals.

Software: I will mainly use Adobe Photoshop and Adobe Illustrator, since I plan to edit the pictures of the animals in a way where they have the instruments. Photoshop will be for the editing of the pictures, and illustrator will be for the general layout and organization of the comic book pages.  I will also be using Code Sandbox to host the comic book.

Mad Libs

Title: Mad Libs

Spring 2024

Languages used: HTML, CSS, and Javascript

Link to the project.

Link to the code.

I created a Mad Libs website that takes a user input, that being name, location, color, food, and an animal. My experience with this website was pretty fun, since I am a CS major and haven’t done simple websites like this in a long time. It was honestly pretty funny how I looked up some syntax stuff on W3 at one point when I got a tiny error, but the AI assistant in codesandbox did help a bit. The only annoying part of the project may have actually been the AI assistant, since it kept on reformatting my code if it was too long, thus making it look weird. Despite that, I had a lot of fun with this project.

My Website

Choose Your Own Adventure

Spring 2024

HTML, CSS

My website is a choose your own adventure story for someone starting up a band. The user can choose what instrument they want to play, and then what genre of music. The user can choose between four basic instruments, like Guitars, Drums, Bass, and Vocals, followed by the choice between Metal or Punk music as their desired genre. There is no failing in this adventure, only pursuing the music that best suits you.

Live site here: https://h54djv.csb.app/index.html

Link to project: https://codesandbox.io/p/sandbox/css-basics-spring-2024-h54djv?file=%2Fpages%2Fbassist.html

My Animation: Scared

Title: Scared

Semester/Year: Spring 2024

Software: Adobe After Effects

I chose to animate the emotion Scared. I started with a circle that represents someone’s body when they are scared. It shakes and trembles and moves all around in fear. I used another two circles to represent eyes. Our eyes say a lot when we are scared, they dilate or grow and reflect how scared we are. I also used a rectangle to show a mouth. This mouth changes from rectangle to circle because we often gasp or scream in fear. Our mouths also tremble or quiver in fear. I chose the colors red and orange and black because they represent halloween in a sense, and that’s when people are often times drawn to more scary stuff. The pacing is pretty even, but you’ll see the animation get quicker as the circle gets more scared. The hardest part was managing all the animations when they’re all open. Like you mentioned in the video, the tab is so small and gets crowded easily. It’s funny if you catch what the circle was scared of in the end (hint: it’s midterms).

My Storyboard

Here’s my storyboard draft for my animation, the emotion i’m animating is “Scared”

Audio Portrait Final

Title: I Hate School

Spring 2024

Software: Audacity

I decided to make a sound that goes over why I hate school. My focus was to use a recording I made on my guitar that’s layered with random sounds like people or crowds talking. The idea is that during school, I’m usually listening to music to drown out the noise of people talking because everyone honestly talks way too loud in the halls. I use automation, fade in’s, fade outs, reverb, delays, and I even did a method where I panned on snippet to the left ear without reverb, and other with reverb to the right ear and mismatched their timing a bit to give a cool effect. Overall, it was really fun!

Credits for audio used in:


I hate school in the background:
I hate schoolby MisteriousSoul is licensed under CCO 1.0
https://freesound.org/people/MisteriousSoul/sounds/51352/

Background ambience in the background:
Classroom Ambience – High School Classby okieactor is licensed under CCO 1.0
https://freesound.org/people/okieactor/sounds/417041/

Laser audio:
sci-fi-laser-blaster-shot-1by flyingsaucer invasion licensed under CCO 1.0
https://freesound.org/people/flyingsaucerinvasion/sounds/615807/

Car Starting:
Car starting up and pulling awayby amthomasis licensed under CCO 1.0
https://freesound.org/people/amthomas101/sounds/175836/

Group audio:
AMB_LargeGroupTalking_03_Reverb_LargeSpaceby NapieFreeSoundis licensed under CCO 1.0
https://freesound.org/people/NapierFreesound/sounds/710856/

My Self Portrait

Rock Band with Cat and Dog

Spring 2024

Photoshop

For my self portrait, I wanted to use a rock show setting, since rock is my favorite music genre, but I wanted to also show cats and dogs since they are very cute and funny. I used posterize and a gradient map to get the cool retro look on the photo. I also use various masking settings like feather as well as level adjustments on the animals to make them fit more in with the vibe.

Image Credits:

“Black Dog in Hat and with Toy Watermelon Guitar” by Yana Kangal. CC0. Pexels. Uploaded June 23, 2023. https://www.pexels.com/photo/black-dog-in-hat-and-with-toy-watermelon-guitar-17453825/

“Band Playing Punk Music” by vitalina. CC0. Pexels. Uploaded February 25, 2020. https://www.pexels.com/photo/band-playing-punk-music-3807093/

“cat guitar” by friskytuna. CC BY 2.0 DEED. Flickr. Uploaded February 9, 2009. https://www.pexels.com/photo/band-playing-punk-music-3807093/

Weird Blue Shape Alien

Spring 2024

Illustrator

I used illustrator to make a weird looking Blue Alien using shapes, pens, and gradients. I used the circles to make the hair, and rectangles to make the eyes. I used the pen to make the weird moustache as well as the moute. I then used gradient as well as shape builder to make a crescent moon object on the top left. To make everything cooler, I made the background, letters, and crescent a gradient fill between orange and purple!