-
Description: The project is an interactive comic website that tells the story of three astronauts who were killed by a shape-shifting dog sent by an evil mastermind. The overall concept and theme of the project is a sci-fi mystery with elements of suspense. The use of a shape-shifting dog as the antagonist adds an extra layer of intrigue and unpredictability to the story. The project's interactivity, which includes sounds, dialogue, and animation, further enhances the immersive experience. We were striving to create an engaging and captivating experience for the user. The use of plot twists and unexpected events is intended to keep the user interested and invested in the story.
-
Process: We first created a storyboard that outlines the story's key plot points, characters, and themes. We then also focused on the script and dialogue. We then created and sourced artwork and design assets for the website, including character designs, backgrounds, and visual effects. We both used an AI generator along with Photoshop and Illustrator to create these assets. To add interactivity to the comic, we used programming languages such as HTML, CSS, and JavaScript to implement various features such as sound effects, and animations. The roles of the team members are as follows: Mira created the storyboard and the dialogue between the characters and brainstormed some of the storytelling aspects of the story along with Majid. Majid also worked on the story and generated the image backgrounds using AI and the voices of the characters. Tarek edited the images using Photoshop and generated the characters to fit the story and created the illustrations for the text bubbles.
Role:
I worked on building the website and coding the various interactive elements using libraries such as JQuery. The interaction involve hovering and animation effects, smooth scrolling effects, sound effects and sound blending and the general flow of the images. I also implemented css designs such as an animated header and starfield background to further enhance the story and the user-experience. -
Reflection/Evaluation: Throughout the creation of this interactive comic website, we found that we had to edit and change the storyline a couple of times to fit aspects of comic storytelling. We also faced hardships when trying to find appropriate images that fit our story but thanks to photoshop we were able to make it work. The process of addding the interactive elements was an exploratory journey for me as I had to explore more functionalities and libraries such as JQuery. I ran into bugs a couple of times and spent countless hours debuggging but I moslty resolved my bugs or improvised a design.