Professor Ann Chen
Carlo Gabriel
Final Project WCS – Interactive Website
Monday, May 20th, 2019
Project Description
Trashley’s Journey is an interactive website that features a fictional character of a trash bag called Trashley. Just like her any other trash bag fellows, Trashley is there to help human carry their stuff before she ends up floating around the harbor of New York City. Throughout her journey exploring the depth of the sea, Trashley encounters many other sea creatures she has never met before in the above-ground world including Prince Louis who just comes back from a 60-year-long trip in Europe. Performing other characters such as Baggy the rookie, Trashley’s Journey will take kids of 6-10 years old on a journey to learn about marine creatures, plastic waste and more. Trashley’s Journey hopes to inspire the younger generation to help reduce future plastic waste while educating children on the impact of human activities on marine lives.
Purpose
The purpose of this interactive website is mainly to help kids of 6-10 years old understand the current situation of sea world as well as learning about sea creatures. To provide a fun learning experience, the website incorporates a scroll-up/down feature to navigate through the depth of the sea (website). As they explore each section of the website, they can learn different facts pertaining to sea creatures, plastic waste, and solution to reducing plastic waste in the sea. The goal of this interactive website is to raise their awareness about sea pollution and hopefully drive them to take actions to save our sea.
Roles
At the beginning of the project, we all helped each other build basic idea. As we solidified our idea and planned out the project, I started to focus more on the graphics part of the website. I helped the team create characters and draw them using Adobe Illustrator to meet our desired looks of each character. I also made some changes based on the feedback from my classmates and professor. Below are the roles of each member.
Story Boarding – Sebastian Lau
Research – Katherine Li
Graphic – Carlo G
Website Coding – Hope Myers
Process
-
- Brainstorming
- First, we brainstormed to come up with ideas. After we had a few ideas, we started to filter out the ones that we thought were not feasible and doable to do given the time and our technical skills.
- Story Boarding and Research
- After we derived the idea, we started to create a rough storyboard to kind of have a starting point and what to expect from each of us. After that, we began to break down which parts need to be done first and which parts can be done later. Meticulous research was also done at this point to support our preliminary facts. We also researched as to the species of marine creatures that are often found in NYC harbor for our next process, character building.
- Character Building
- After creating a rough storyboarding, we began to create the characters for the website. We brainstormed their personality and appearances. This part is really crucial for me as character building determined my work in drawing their reactions for the story. The characters were assigned based on the research done in the previous section.
- Graphic
- I began to draw all the characters. What I did first was to make a sketch of each character. After that, I started drawing the first look of the characters and adding some details. After that, my team and I presented our work to receive feedback then make some adjustments based on the feedback. Below are the characters that I drew after multiple feedback from my teammates, classmates, and professor.
- I began to draw all the characters. What I did first was to make a sketch of each character. After that, I started drawing the first look of the characters and adding some details. After that, my team and I presented our work to receive feedback then make some adjustments based on the feedback. Below are the characters that I drew after multiple feedback from my teammates, classmates, and professor.
- Website Development
- As for website development, we actually already had the rough version of the website ready right after the storyboarding process. We developed the website throughout the process.
- Final product
- Finally, we managed to present our final product after about 7 weeks of work.
- Brainstorming
Below is the link to our website demo:
Challenges
Throughout this project, each of us encountered different challenges. As for me, my challenges came in a form of understanding the features of Adobe Illustrator as I was not quite familiar with that. After watching a few tutorials, I kinda got myself familiar with its features. One feature that I really like is the layering feature. This feature helps me put every drawing in layers. I used this feature a lot when I colored my drawings. So I made the outlines of the drawings first and group all them together and put them all in a different layer from the color ones. That way, I can color the drawings without having to worry that my color would go beyond my outlines.
What I’ve learned
From this project, I learned a few new things. First off, I learned about WCS’s existence and works in preserving marine creatures as well as tackling sea pollutions. Their works and projects have helped me understand marine creatures and the way they behave in a polluted environment. One example is of how turtles often mistake plastic bags for jellyfish. I also learned many new facts about plastic waste in our sea such as a large number of microbeads in the sea that is damaging the existence of marine creatures.
Second off, I got to work with amazing teammates from different classes. I learned how to bring together different ideas and tailor them into one polished idea. I also learned to pick up good communication with my teammates and WCS, to make sure that every work is aligned with what WCS expects from us and to make every group member be on the same page.