Emily and Dylan's Workbook @emilyanddylanvcd-blog - Tumblr Blog

Rationale

Our small action big impact was to stop using single use plastic straws, we decided to target young females around the 19+ age. We felt like they are the biggest consumers of plastic straws on nights out and when going out for a meal.

We felt that a minimalist website and stop motion style animation would appeal the best to our target audience. We worked well together as a team, we delegated tasks well. Next time we would want to make the website responsive so that when you change browsers it adjusts. We would also work on linking the animation and website aesthetically.

FINAL ANIMATION

Here is our completed motion graphic. We used After Effects to make a composition of all our images, editing the frame length and rate. We then overlapped and trimmed our voiceover to fit, adding text and additional elements and transitions. Having never made a stopmotion animation before we are really happy with how this turned out. If we were to do this again, we would plan how the animation and website fit together aesthetically so it is more clear that our animation goes with our website.

I have been trying to just my code so that when the screen size is enlarged or used on bigger or smaller screens the text and imagery will move with the screen and stay with the same layout. unfortunately I was unsuccessful it getting the website code to be responsive. it opens at the right size on laptops but when I open the code on a Big Mac book screen it stretches out and the images and text in the movement and alternatives section moves out of place.

#week12.1 #coding

When adding text over our stopmotion in After Effects, we wanted to go for the same sans serif style we are using in our website so it can flow. Originally going for a yellow, we got some feedback saying we needed to use a colour that we are also using on our website, so we went for the same soft red that features on our website. For the scenes where the text is over some of our animation elements, the legibility was slightly off, so we added a drop shadow to the text so it pops and gives more depth and makes it easier to read.

#week 10.1 #stopmotion

Here is a small sample from our stopmotion animation once all the photos have been compiled. We compiled the images in After Effects and chose to run the animation at 20 frames per second to get the choppy stopmotion effect. One problem we found once the animation was complete was the shadows move and light flickers between frames. It isn’t significant enough to break the entire animation but still noticeable. We hope once we add sound and subtitles it will distract from some of the flicker.

#Week 9.1 #stopmotion

One weekend and 500 photos later we had all the photos for our stopmotion animation taken. We found there were some parts that were off-time with the voiceover so we had to go back and duplicate some of our filler photos to add more time between voiceover lines. We are using After Effects to put together and edit our animation.

#Week 9.1 #stopmotion

I tried adding the smooth scroll on using java script, but was unsuccessful. I could not get the links to connect and scroll down from the menu bar. I tried several times using different tutorials off the internet and youtube, but was still unsuccessful.

I then moved on to try a click to link each section, instead of the smooth scroll, this still did not work. I could not add a click down to each section. I have left the menu options in at the top of the website so that you can see where you would click if the smooth scroll or click option was applied.

#week 11.2 #week 12.1 #coding

This week and over the weekend we started to code our website to present to class, this is what we have of our website so far. as we develop our website further we plan to make the headings clickable so that they will drop down to each section of information. the website is still very much a work in progress.

#week 10.2 #week 11.1 #coding

These are the plans for our website, mapping out how we want to lay out the pages and what sort of information we want to put on each page. also using the colours and fonts that we want to use.

#week 10.1 #planning

Animating our story board.

https://vimeo.com/271388083

This is the link to our storyboard which we animated using after effects, we did this so we could see how long our animation was going to be and could get an idea of how our sound effects and voice over would sound with the visuals.

#week 9.2 #storyboard

Over the weekend, we completely changed out design style for our animation and website to suit our target audience. Today’s critique was the first time showing our new re-designed storyboard, website style and script. We received a better response from our classmates about our new style and that it fits our target audience better. As well as changing our design style we also changed our animation so that it would flow better with the stop motion technique we plan to use.

#week 9.1 #critique

After our critique and deciding to re-evaluated our design style, we decided that we were going to create a more minimalist website to suit our target audience of young women the basic b*#@*s of our generation. These are a few examples of websites that we found which we liked the style of, they all have a simple easy to navigate layout. With neutral colours and using photographs to work with and complement the text on the site.

#week 9.1 #Critique

After our critique and having reevaluated our design approach and target audience, we decided an animated motion graphic wouldn’t work, so chose instead to try stop-motion animation. As we are going for a flat, minimalist design for our website, we had to think about how this would translate seamlessly into the design. Our best idea was to use coloured paper cut-outs (similar to the stop-motion design of South Park), laying the different shapes and elements, moving them individually. I tried to find an example of a motion graphic that uses this method but couldn’t find a lot (hopefully not because it takes a lot of time and effort), but I have linked the best example I could find. The animation is a good example of physical cut-out elements being moved around independently to others, creating the jittery, imperfect movements of stop-motion animation.

#week 8.2 #animation planning

Having refocused the design of our website, opting for a cleaner, minimalistic approach, we began thinking about a typeface that would compliment this style. We decided a bold sans serif typeface would suit our design and mood best, so chose a couple typefaces that we liked. We paired the typefaces with some soft, neutral, pastel colour schemes that will be similar to the colour schemes we’ll be using on our website.

#week 8.2 #website planning

This week in class we had small group critiques, with our first storyboard, script and our initial design style (moodboard) for our website and animation. the lecturers felt like our target audience and design style did not match and work together in an effective way. We had to decide if we were going to change our target audience or our design style and as it was still early on in the design process we decided to explore the styles that our target audience of young women are attracted to. we decided to take a more minimal and simplistic approach to our website and animation as it fits better with our target audience.

#week 8.2 #critique

Research: The effects of plastic straws

Here is a summary of some articles on plastic straws, how harmful they are, and some initiatives being set to reduce plastic waste.

It is estimated that New Zealand throws away 541 million straws a year, and Wellington bars and restaurants alone give out approximately 800 straws per week. Plastic straws are one of the five most-found disposable items on NZ beaches, and as plastic straws are made from materials like polypropylene and polystyrene, they can 200 years to degrade. Wellington City Council has proposed to do its part by bulk buying biodegradable paper straws to help bars and restaurants make the transition away from plastic straws, but some restaurants, such as Nandos, have already removed plastic straws from all their NZ restaurants.

https://www.stuff.co.nz/business/101706914/wellington-hospitality-group-to-stop-using-plastic-straws

TheLastPlasticStraw.org is one of the largest programs for single-use straw waste awareness. The American-based organisation estimates that the US makes up just 5% of the world’s population but contributes 30% of the world’s waste. The average American will use 1.6 straws a day, and annually, 5,000 straws are collected in beach clean-ups, one of the 10 most-collected coastal waste items. Plastic straws take hundreds of years to biodegrade, but only photo-degrade into smaller and smaller pieces and are ingested by marine and land animals.

https://thelastplasticstraw.org/

It is estimated the UK alone throws away 8.5 billion straws a year, and the Department for Environment, Food and Rural Affairs has proposed a ban of plastic straws across Britain. With bans on microbeads in-place and having made strides towards banning plastic bags and plastic-free aisles in supermarkets, plastic straws are the next target for the UK in their plan to be free of plastic waste by 2040.

http://metro.co.uk/2018/02/23/plastic-straws-banned-revealed-use-8500000000-year-7335952/

Worldwide, plastic straws are the sixth most common type of litter, according to Litterati, an app that identifies and maps trash, and among the top 10 marine debris items according to environmental advocacy group Ocean Conservancy. Made from fossil fuels, a precious and finite resource. Single-use straws are made from several different different types of plastic and their small size means they are hard to recycle, so once discarded, just contribute to the 8 million tons of plastic being dumped into the ocean every year, and at this rate, there will be more plastic than fish in our oceans by 2050.

https://edition.cnn.com/2018/01/14/world/plastic-straws-ban-campaigns/index.html

McDonald’s restaurants alone throw away 60 million plastic straws daily worldwide. In March 2018, McDonald's announced it is dropping plastic straws from its UK restaurants, phasing them out from May as a trial that could be rolled out worldwide.

https://actions.sumofus.org/a/mcdonalds-is-polluting-our-oceans

#week 7.2 #research

This is our first very very very very rough plan of our website layout. We plan on having everything on one page, with links to reveal/hide sections of information that will sit below the title of our website and an artwork banner. These sections of information will be: 1.) Facts about plastic straw waste and the effects of this waste globally and on marine wildlife and ecosystems, 2.) Local problems and how New Zealand and Wellington are affected/contribute to the plastic straw dilemma, 2. or 3.) Initiatives that are being set-up to combat this plastic straw epidemic (government support, how businesses are helping) and 4.) What can the reader do/where to find plastic straw alternatives. Each section will feature a small design that is relevant to the information it pairs with. Below these links will be our motion graphic/animation/infographic. We plan to use hideable text above the animation so readers don’t have to scroll through text to find it, but also so the animation (that features just the highlights of what the text unpacks and is just a summary of the information) doesn’t seem to be more important. Below this at the very bottom of the page will be a link to the website ‘The Last Plastic Straw’ (you can find that here: https://thelastplasticstraw.org/), which is an organisation formed to educate and bring awareness to the harm of single-use straws. This link will provide the reader somewhere to go if they are looking for more information.

The design of our website will be the same as our animation; a simple, flat, cartoonish style with bold colours and text (both of which we have yet to choose). This is so the animation fits seamlessly on our website, and our designs can run in both the motion graphic and as images on the website.

#week 8.1 #website planning

Trending Blogs

Recently Viewed Blogs

Emily and Dylan's Workbook