Wednesday, 1 June 2016

Week 12 - Finals for hand in

Storyboards -

Full story boards of the animatic - the motion-graphic kept to these relatively well with only slight frames added in or changed with some of the transitions much stronger.



Animatic - 

The motion-graphic came a long way from this initial animatic with the first script and no backing music etc. The progress is very impressive and it is nice to see where the motion-graphic started at and progressed to.

Full Quality Animatic from Kristen Mabey on Vimeo.

Final Motion-graphic video -

This motion-graphic I am happy with, it is an informative video that targets young people who live or cook by themselves to really focus on their own wastage, as they are loosing money from their pocket. I believe that it illustrates a narrative and with a great webpage it would really reach out to people that their small actions can make large impacts.

The video provides a solution to ending food waste and how we really can make a difference with small actions.

Food Wastage - Final Motion Graphic from Kristen Mabey on Vimeo.

Webpage conceptual wireframe - 

This would have developed much more under better circumstances.

Final quickly mocked up Webpage - 

The webpage had great potential with much more refinement. Due to unforeseen circumstances I have attempted to make the best webpage in the smallest time-frame. The webpage does work, with the playing video and links which take you to other positions on the page. 

The webpage does inform people in a light way what they can do to prevent food wastage, with further information and links to other places where they can helps this cause. 

We decided that Food Wastage Path was an organisation that is passionate about reducing food wastage and raising awareness to all young-New Zealanders. 







Final rationale -

Food Wastage Path is an organisation that targets young people to motivate them into stopping their food waste footprint through small actions that have large impacts. 

The motion graphic is an informative video that targets young people who live or cook by themselves to really focus on their own wastage, and what they are throwing away. People are loosing money from their own pockets by wasting food and the video informs the audience what they can do to prevent further food waste. 
Throughout the process I have taken into concideration the design principals using a colour scheme to help enforce visual hieracy, the use of size and scale between shots, with use of negative spacing and vignette to enforce where the focus should be. The zooming and transitions between storyboard scenes is another technique used to ensure the motion graphic is sucessful, gathering inspiration from online motion graphics and infographics were a key point to this. My motion graphic flows nicely and the spreads as a whole relate together well. 
It is clear and informative with its information.

The webpage had great potential but unfortunately due to unforeseen circumstances I have attempted to make the best webpage in the timeframe that I could, using the colour scheme from the video to ensure that the two relate well.
The webpage provides a backup to the motion graphic, it has the solutions to ending food waste and acknowledges how we really can make a difference with small actions. With further information to other sites and sources.
The webpage is a working page, the video tells the problem and solution and then the information in the webpage backs it up, with links taking you to outside webpages. Ideally the webpage would be much more interactive and interesting, with refined information, infographics and small illustrations, if our group situation was better. 

I have enjoyed this assignment, and although the group was an unfortunate situation I have learnt some great skills in after-effects and brackets, expanding my knowledge greatly.

I am happy with the motion graphic, it it successful in telling its narrative, reaching the target audience through the use of the illustration and text. 

Week 12 - Assessing Final Motion-Graphic

Looking at final motion-graphic frames -






















Self Critique on Motion-Graphic:

This colour scheme and the layouts work very well. Everything is legible and clear, the text is softened quite a lot giving the white more of a pale blue colour. The illustrations look clear and simple and I am feeling as though the progression from the introduction through to where the graphic gets very text heavy is a good transition with the colours showing the topic has gotten very serious.

By laying out like this I feel as though I can see which spreads have slight problems with the spacing of the type, and I can see where I will refine this slightly to ensure the motion-graphic is very successful for hand in tomorrow.

Target Audience -

This motion-graphic does work well for the audience intended being youth-young adults, leaving home and realising their impact and what they have wasted. The facts are clear for this age bracket with very light illustrations with changes and developments to keep interest.
I have asked many other people around my age (20) to look at this illustration and see how they feel about it and if they are interested and going to take action on this topic.
I got some good feedback from this criteria and feel as though the motion-graphic is successful in this way.

Viewing Website on a larger screen of a different computer - 

Although this website isn't the most successful or best it still looks nice on a computer screen with the colour scheme working nicely with the video. The links and what is written on the page continue to as a narrative to what the video was discussing. 




The illustration on the left of the webpage is distracting and I feel as though I need to remove it. 

Lecture Ten - Week 12 - Webpage development for hand in.

Webpage:


I have drafted a webpage up for hand in tomorrow. It is a very brief webpage, but it had links which work and I have the motion graphic in it. The webpage is very simple, but I have used the coding knowledge I have learnt throughout this website to have a play with what I can do.

I am quite happy with how far I have come with this webpage development, and the layout is quite similar to the wireframe I initially made in week 3 as a mockup idea. Although this website would be much more refined if the circumstances were different I am quite happy with how it looks for now.








Tuesday, 31 May 2016

Lecture Ten - Week 12 - Website Development / Final Motion Graphic Critique

Webpage - 


I have started developing from the HTML lecture in class a webpage mock-up to put the motion-graphic into as I haven't heard anything from Timmy as to the website he was working on. With the new colour scheme, I am working off the wireframes originally mocked up for presentation back in Week 3 -



Although the webpage I am creating will not be technically as great as it could have been if I was more aware of the situation I would be in, this webpage is something that once I have finalised my motion-graphic and am really happy as to where that is, for hand in. I will try and refine the webpage.

Here is the progress - I have created this from scratch, and on early weeks did watch all the lynda tutorials which have really helped for this.






Final Motion-Graphic Critique from Mon - 

- Look at your audio levels, they are a bit low and need to be punched up a bit. 
- Look at those opacity levels on type and see if you can soften them up a bit - The colours aren't working as harmoniously as they possibly could. 

- Keep the overall composition in mind also - focus should be in the centre - this is where you need to direct peoples eyes if you're working with a lot of negative space - anything below the centre line tends to fall off the screen

REFLECTION:

If the website was progressed and developed from the early stages, our webpage would be a stronger illustration of the ideas and have a lot more functionality fitting the illustration style much better and really reflecting the webpage the animatic expresses.

Going back and looking at brief - 

Web combined with Motion-Graphic create a narrative.

Narrative to engage, inform and a call to action for your audience.

Things to consider with the Motion-graphic

- I have considered much of the brief, and there are only the small design critiques that need working on.

Things to consider with the Webpage 

- The webpage is apart of the narrative, proposing the solution to the problem
- The main page of the website be more dedicated to the scenario and what you can do to help.
- How text, image and interactive nature can enhance the story

Submission - via stream

-Website with the embedded video - packaged in ZIP File named - (e.g. BaileyJo_BondiMatt.zip)
-Submit your story-boards PDF
-Wireframes PDF
-Workbook
-Peer Review Form
-Animatic uploaded to workbook?

Research into text - Looking at type in motion-graphics


What layouts do they use, how are the types coloured ?

The type in this is creative how this moves into the animation -



This type with the change of the whole screen when type appears.
- Something I should have used more of in my motion graphic is the stretch, although there isn't really parts where this would be needed so much.



This motion-graphics parts and animations look so interesting and work so well, I have gone for a strong narrative theme that more tells a story than the abstract feeling like this. The animatics are illustrated really well though.

Lecture Ten - Week 12 - Homework - Final development Motion Graphic

Final Video for a final critique - 


I have emailed this video to get a final critique, the type is smaller now but does feel less in your face and blocked.
Hopefully the feedback will be much better and the motion graphic is looking successful for final hand in.

Final Critique from Kristen Mabey on Vimeo.

From here I am going to develop a webpage to show I have learnt coding skills throughout this paper.

Sunday, 29 May 2016

Lecture Ten - Week 12

Tutorial 

Further Critique Motion Graphic - 

Curning and leading on text - all lettering tighter
Opacity on type - soften white 80% and blue
Use a lighter blue
Type could left aligned and same text size.
Rubbish pile on the light background - doesn't work that great.
Lighter background?
Try lighter yellow coins
Tidy spacing on stop - Make it smaller?
Hang on logo
One frame shorter so there is no black at end
Take off names

This is looking way better and definitely progressed well since last week, finally starting to look resolved!


From here I will refine the final critiques and work on positioning the motion graphic into a webpage.

Lecture 9 - Week 11 - Taken on all critiques

I have taken on all critiques and really developed the motion graphic.
From here I am hoping critiques tomorrow go well and that I get some positive feedback about where the motion graphic is.

Here is the updated video -

The colour scheme is much cleaner and the whole video links together well. The transitions also are more legible and simplistic.


Going into final critique from Kristen Mabey on Vimeo.

Thursday, 26 May 2016

Lecture Nine - Week 11 - Development

Colour scheme - 


The colour scheme I found in research I have applied to the motion graphic -
I have used the 12 for the motion graphic, and Timmy could use the three of the 5 for the webpage.



This colour scheme looks much better, Timmy and I are meeting tomorrow to go over our work and the webpage and video together for a final critique on Monday, I am really hoping that the teachers are going to like our new colour scheme. Overall it does work well throughout the video.



Lecture Nine - Week 11 - Back to research

Self-Critique -


After class today I am really needing to desperately change the motion-graphic, I need to be positive and believe that this can become the awesome graphic it can be. The pace is good and the ideas are clear with the script, so I just need to work on everything else, and the best place to go from here is back to the research.

Timmy is working on the webpage, which also needs much more development to get towards where the final piece should be. We are meeting on Saturday to discuss and pull the progressions together.

Research from critique and points that we MUST take on to get a well resolved final - 


http://www.premiumbeat.com/blog/7-must-know-guidelines-for-motion-title-design/
- Has some important points about making a motion graphic