My Final Project

My Final project

Spring 2024

HTML, CSS, Audacity and Photoshop

https://codesandbox.io/p/sandbox/mmp-final-project-9zls46

Dev site:https://codesandbox.io/p/sandbox/mmp-final-project-9zls46?

https://codesandbox.io/p/sandbox/mmp-final-project-9zls46?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clwfsu52e0006356jzwi8f5jm%2522%252C%2522sizes%2522%253A%255B100%252C0%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clwfsu52d0002356jf3kponjh%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clwfsu52d0003356j38tbyjtg%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clwfsu52d0005356jfayg87oe%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B50%252C50%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clwfsu52d0002356jf3kponjh%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clwfsu52c0001356ja7xpcpxb%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Findex.html%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%255D%252C%2522id%2522%253A%2522clwfsu52d0002356jf3kponjh%2522%252C%2522activeTabId%2522%253A%2522clwfsu52c0001356ja7xpcpxb%2522%257D%252C%2522clwfsu52d0005356jfayg87oe%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clwfsu52d0004356j1ienkub9%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A0%252C%2522path%2522%253A%2522%252F%2522%257D%255D%252C%2522id%2522%253A%2522clwfsu52d0005356jfayg87oe%2522%252C%2522activeTabId%2522%253A%2522clwfsu52d0004356j1ienkub9%2522%257D%252C%2522clwfsu52d0003356j38tbyjtg%2522%253A%257B%2522tabs%2522%253A%255B%255D%252C%2522id%2522%253A%2522clwfsu52d0003356j38tbyjtg%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Afalse%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A15%257D

For my final Project i told a story about a boy overcoming adversity and knowing that when your back is against the wall its not the end of the world. Using HTML, CSS, Photoshop and Audacity

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/

My Website (Updated)

(I had a technical issue where I couldn’t transfer from P5 editor to Code sandbox. I fixed it)

Title: Choose how you spend your day off

Semester/year: Spring 2024

Html / CSS

Program: Code Sandbox

The website says that you got a day off from work and you don’t know how to spend it. You get 2 options to choose and both have different outcomes. I chose these two options because I would personally consider these 2 choices.

Here is the link to the website:

https://6fjpl7.csb.app/index.html

This is the link to Code Sandbox:

https://codesandbox.io/p/sandbox/website-project-updated-6fjpl7

Published
Categorized as Website

World Tour – Final Project

Spring 2024

Software:

CodeSandBox:

Live Site: World Tours

Dev Site: CodeSandBox Link

HTML & CSS

Imgur

Photoshop

Description:

In this project you have very own virtual tour with a mix of fun facts, options for destinations, and images. When visiting each page or country you can experience some of each country most toured sites, with additional information / fun facts along your tour. I have chosen Egypt, Saudi Arabia, and India as tourism locations.

Egypt has been a tourist attraction since the Pyramids were discovered, especially since they are one of the seven wonders of the world. Along with the pyramids, they also have many historical sites, like temples, statues, etc. to visit as well.

India is a growing country today and slowing make their ways to the top of the nation’s ranks. Same as Egypt with Pyramids, India hosts the Taj Mahal, also one of the seven wonders of the world. In addition to great food, unique culture/lifestyle, and many more experiences, India’s history also played a big role in the creation of the advanced world that we live in today.

And finally, Saudi Arabia, some may see it as the most holy Islamic country and others as one of the most oil dominant nations in the world. Along with the religion of Islam being the fastest growing religion in the world, Saudi Arabia has shown why it is a country not to be slept on. With its Islamic heritage, many projects (like NEOM), and now even tour options, a trip to Saudi would be anything but boring.

Even though the website is not a properly organized website, the idea was to maybe give a little bit of that experience from the comfort of your home (or wherever you’re sitting).

Credits:

Main Page:

“View through airplane” by Samridhidev. CC0 1.0 DEED (CC0 1.0 Universal). commons.wikimedia. December 13, 2023. View through airplane

Saudi Photos and Info:

“Saudi Arabia National Flag Illustration” by suretianto. CC-BY-SA-4.0. commons.wikimedia. December 10, 2021. Saudi Arabia Flag

“Al-Haram mosque” by Al Jazeera English. CC BY-SA 2.0 DEED. commons.wikimedia. December 04, 2008. Masjid Al-Haram

Dr. Ayoub, Omar.”Masjid Al-Haram: Its History, Key Structures And Lesser-Known Facts.” Masjid Al-Haram facts – ZamZam September 2,2021.

“المسجد النبوي الشريف والصورة مأخوذة من الدور الرابع عشر فندق أنوار المدينة موفينبيك” by Imam Khairul Annas. CC BY-SA 4.0 DEED. commons.wikimedia. September 19, 2014. Masjid Al-Nabawi

Enjoy Travel. “Interesting Facts About The Prophet’s Mosque In Medina” Masjid Al-Nabawi facts – Enjoy Travel April 28, 2018

“Al Ula old town, Saudi Arabia 2011” by Pteropus Conspicillatus. CC BY-SA 3.0 DEED. commons.wikimedia. April 14,2011 AlUla Old Town

Wikipedia. “Old Town, Al-Ula” AlUla Old Town facts – Wikipedia. CC BY-SA 4.0. May 6, 2024

“Saudi Arabia Administrative Divisions – EN” by TUBS. CC BY-SA 4.0 DEED. commons.wikimedia. November 10,2023. Saudi Arabia Map

“Saudi Arabia and Kuwait – 18 photographs of the oil industry, 1960s” by n/a. Public Domain. commons.wikimedia. 1960s. Oil Industry 1960

“Supplicating Pilgrim at Masjid Al Haram. Mecca, Saudi Arabia” by Ali Mansuri. CC BY-SA 2.5 DEED. commons.wikimedia. Feburary 13, 2003. Praying Man

Egypt Photos and Info:

“Flag of Egypt” by Cloudcounter. CC0 1.0 DEED CC0 1.0 Universal. commons.wikimedia. April 7,2024. Egypt Flag

“The Great pyramids of Giza” by Ahmed Emad H. CC BY-SA 4.0 DEED. commons.wikimedia. January 1, 2020. Pyramids of Giza

Houson, Emily. “5 Fun facts about the Pyramids of Giza” Pyramids of Giza facts – Go Ahead Tours September 01,2020.

“Facade of the Egyptian Museum, Tahrir Square, Cairo, Egypt” by Diego Delso. CC BY-SA 4.0 DEED. commons.wikimedia. September 25,2011. Egyptian Museum in Cairo

Britannica. “Egyptian Museum” Egyptian Museum in Cairo facts – Britannica

“Edfu Temple” by Marc Ryckaert. CC BY-SA 4.0 DEED. commons.wikimedia. November 17,2018. Edfu Temple

Poynter Carolyne. “20 Enigmatic Facts About Temple Of Edfu” Edfu Temple facts May 19,2024

“Official Egypt governorates english” by d-maps. CC BY 4.0 DEED. commons.wikimedia. October 18,2014. Egypt Map

“Kushari” by SirJman. CC BY 3.0 DEED. commons.wikimedia. June 17,2008. Kushari

“Sarcophagus of Ankhnesneferibre” by Hans Hillewaert. CC BY-SA 4.0 DEED. commons.wikimedia. November 21,2007. Old Hieroglyphics

India Photos and Info:

“Flag of India” by We moved to 8.12. CC BY-SA 4.0 DEED commons.wikimedia. July 14, 2021. India Flag

“Taj Mahal Sunset” by Muhammad Mahdi Karim. CC0 1.0 DEED CC0 1.0 Universal. commons.wikimedia. 2012. Taj Mahal

Vedantu. “Taj Mahal Facts for Kids” Taj Mahal Facts – Vedantu May 20, 2024

“Diwan-i-Khas, Agra Fort” by Jakub Hałun. CC BY-SA 4.0 DEED. commons.wikimedia. December 04,2019. Agra Fort

Agra.nic.in “Agra Fort” Agra Fort facts – Agra.nic.in May 6,2024

“Golden Temple nighttime” by Marsmux. CC BY-SA 4.0 DEED. commons.wikimedia. March 23,2018. Sri Harmandir Sahib

Holidify “11 Interesting Facts About the Amritsar Golden Temple” Sri Harmandir Sahib facts – Holidify

“India new 20 INR, MG series, 2019, observe” by Reserve Bank of India. GODL. commons.wikimedia. April 26,2019. New Indian 20 INR

“Map of India” by Cacahuate (talk), Ravikiran Rao, Nichalp (base outline). CC BY-SA 2.5 DEED. commons.wikimedia. August 25, 2009. Map of India

“Spicy Anda Curry” by Onlybestrecipes – Site CC BY-SA 4.0 DEED. commons.wikimedia. April 28,2021. Spicy Anda Curry

CUNY TV

CUNY TV Interviews

Spring 2024

HTML, CSS, Audacity

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

Dev Site: https://codesandbox.io/p/sandbox/cuny-tv-interviews-xwc73q?file=%2Findex.html%3A5%2C19

My final project are interviews from two different professionals at CUNY TV, that I embedded into a website. I chose to interview these people because I think it is interesting to learn how people got into the professional career they have. Being a student we receive all this information but sometimes lack the knowledge of how to get and perform the job. Which can feel overwhelming. I was lucky enough to be an intern at CUNY TV and got a lot of hands on experience, but still feel unsure on how to land a job. I hope these interviews give some inspiration to students seeking a career in videography, directing, producing or any aspects of the TV industry. I recorded the audio myself and edited it using audacity. I created the website using HTML and CSS on Code Sandbox. Enjoy!

Credits:

Audio recorded by Michael Schnick

Background Music:

Creative Commons — Attribution 3.0 Unported — CC BY 3.0
Music promoted by Copyright Free Music – Background Music For Videos 👉

/ @podcastbackgroundmusic

Graphic Designer

Final Project

Spring 2024

HTML, CSS and Photoshop

Here is the live site: https://qfqfgn.csb.app/index.html

Dev site: https://codesandbox.io/p/sandbox/final-project-image-template-forked-qfqfgn

My final project is focus on my latest work as a graphic designer. Here I show two of my images with specific and different topics for each one. For those two images I work in Photoshop using blending, different types of images, text, curves, color arrangement and more tools on Photoshop.

My first image called ” The Last Coke” is based on a man who is looking for the last soda can in the world. This image has a cinematic look, a cold and deep color and contrast with color. The sunset and clouds which make the image feel more real as well are part of this image.

The second image is a Youtube Banner that I created for a client. This banner is for her personal company which is a hair salon. For this I used some text and logos of some platforms so people can contact and see her work.

All images for the first project belong to his respective owner “Nour Art”. Here is a link to all images used: https://drive.google.com/drive/folders/1vSyT9P8xN20P3TOtagx6IuCYrhMTXa3U ( uploaded in May 13 2024 )

My Final Project

My Final Project; The Diamonds

Spring 2024

CSS/HTML, Audacity

I attempted to make a dramatic radio show like something that would have been broadcast in the 1940s. I enjoy working with audio and have a fascination with radio in particular. I tried to make the background colors and the fonts a little glim and drab due to the subject matter of the radio show. The most challenging issue I faced when making the project was getting the audio to play on my page. I was getting frustrated as I couldn’t figure out why it wasn’t working but I was able to consult our lessons about HTML and also find some advice online and I was able to get things working as they should!

https://hvt4d7.csb.app/. Link to live page.

https://codesandbox.io/p/sandbox/final-project-audio-template-forked-hvt4d7. Link to CodeSandbox

Works Cited

“sh_shop_door_bell_openclose.wav” by shall555 — https://freesound.org/s/72197/ — License: Attribution 4.0. shall555

“Crowd – City Sidewalk- SAMPLE.wav” by OGsoundFX — https://freesound.org/s/423007/ — License: Attribution 4.0. OGsoundFX

“auto int real Maxima bumpy car driving2 +slow down and park shut off door open close.flac” by kyles — https://freesound.org/s/453403/ — License: Creative Commons 0.
kyles

“closing two car doors.wav” by phenoxyethanol — https://freesound.org/s/349048/ — License: Attribution 4.0. phenoxyethanol

“Italian Restaurant Atmosphere” by magnesium1 — https://freesound.org/s/235404/ — License: Creative Commons 0. magnesium1

“Sirens.wav” by tlabrant1 — https://freesound.org/s/658724/ — License: Creative Commons 0 tlabrant1

“VEHICLE-SMALL_CAR_BURNOUT_Version 2.wav” by Scott_Snailham — https://freesound.org/s/486335/ — License: Attribution NonCommercial 4.0 Scott_Snailham

“CarStartSkidCrash.wav” by musicmasta1 — https://freesound.org/s/131385/ — License: Creative Commons 0 musicmasta1

“lonely music loop.wav” by ZHRØ — https://freesound.org/s/676989/ — License: Creative Commons 0 ZHRØ

“Ambient Crickets in City.wav” by columbia23 — https://freesound.org/s/396762/ — License: Creative Commons 0. columbia23

“Dramatic Scroller” by FoolBoyMedia — https://freesound.org/s/270366/ — License: Attribution NonCommercial 4.0 FoolBoyMedia

“helicopterPassage_28sec.wav” by lorenzosu — https://freesound.org/s/49481/ — License: Attribution NonCommercial 3.0 lorenzosu

“Diamonds” by Kim Alaniz — https://flic.kr/p/aXvGh4. — License: Attribution NoDerivs 2.0 Generic.