Design Production for Digital//Self Evaluation.

My final submitted piece for the Design Production for Digital module- my self- evaluation and written analysis of my development, strengths and weaknesses throughout Studio Brief One and Two throughout the module.

Design Production for Digital//Silent Movie//To query: DONE.

 In response to a previous blog post: http://s-wilson1013-dp.blogspot.com/2012/01/design-production-for-digitalsilent_09.html

 Had a quick chat with Fred today, and happy to find out that using all white, black and one colour in our motion graphics designs wasn't 100% necessary, and that mine were fine as they are- horray!

Design Production for Digital//Silent Movie//To query.

Brief moment of slight concern- re-reading the brief, as bought to my attention by fellow GDer and friend, Baljeet, the colour palette for the sequences states that the final outcomes should be in white + black + one other colour- though pretty sure that one colour plus either or was also given the go ahead by tutors before breaking up for the Christmas break? Hopefully I will be able to find out asap tomorrow so I can make any necessary alterations and design developments as soon as possible so I can focus my attentions on other elements within the module and Uni work in general.

Design Production for Digital//Silent Movie//Final Outcomes.

My final series of 5 second motion graphic designs for the 'Silent Movie' Design Production for Digital project. Overall, I am reasonably pleased with the outcome, given my (extreme) lack of knowledge of the software (my only experience being in the tutorial workshops), though I really look forward to the next workshops in the module so I can return to this project to produce far more polished, interesting and varied designs. As well as the technical aspect, I feel that my storyboarding could have been more creative- again, I will return to this, hopefully with some more elaborate and visually engaging concepts.

AIM: To spend at least half an hour a week until module hand in on each of the motion graphics outcomes, with additional concepts, storyboards, and examples of the application of what I have learnt in workshop sessions.

 

SEQUENCE 1- I think perhaps my favourite of all the sequences in the series, although simple, I think it is the most visually communicative of the word "stretch" (inspired by elasticated catapults/elastic bands) and is key framed, and sequenced well temporally and spacially. 

SEQUENCE 2- Not an idea I originally designed in a storyboard, but due to time constraints, and the sudden rush of inspiration, I went ahead to create it, and, consequently, am quite pleased with the results- but I know it could do with a great deal more consideration. Inspired by elastic bands, once more- but the bobbing motion at the end reminded me of a yo-yo- string, perhaps this is an idea I could play upon at a later date?

SEQUENCE 3- Although originally this was my favourite concept, I feel that now this could be the sequence that needs the most work at a later date- for a little more visual interest. However, I do like the idea of stretching the ascenders and descenders of the type still- I was worried when picking the word "stretch" it would result in unattractive ultra-condensed or manipulated characters that would be illegible, but to me, this was a great compromise, whilst still ensuring that my designs were visually communicating my chosen word.



SEQUENCE 4- Again, not initially planned as an outcome in storyboard format, but manipulate and tweaked from an existing design. Quite like how this turned out- my inspiration was floating balloons being released from a box/bag (see secondary source video inspiration on my Design Context blog)- the timing and rotation of the characters in quite effective after the initial "burst" motion at the beginning- perhaps could do with a more graduated ending- pace seems a little fast? Definitely something to consider when re-designing.

SEQUENCE 5- Perhaps the most true to my original storyboard (though, in my original storyboard this was due to be sequence 4), just a slight alteration of the scale of the first key frame type and position- from my work at the start of the motion design making, I think a definite improvement in regards to temporal and spacial awareness is evident- though perhaps a little predictable in concept, this sequence shows my clearest understanding and execution of the After Effects software.

Design Production for Digital//Silent Movie//Sequence V Experimentation.

My final design sequence- #5... clearly getting a little more decisive and fast-paced than with my previous sequence designs. Originally, I had been inspired during the storyboard stage to create a motion piece with the concept of a feather floating down onto the floor from the height- but as you can see from further developments, the storyboard concept varied greatly in the final development. Again, with more time throughout the module, I will go back to storyboard my sequences more accurately, and, once again, build upon the concepts for a stronger, and more creative visual outcome.

INITIAL DEVELOPMENT #1- Based upon the exact storyboard and timings of my original sequence #5, however, when produced in After Effects, I came to realise that it wasn't a very effective visual communicator- looking far more like "spin" than "float" at this current stage. Perhaps, at a later date, with the development of the skills working with depth of field and camera effects the result would be a lot more appropriate in it's visual outcome to my original concept design.

INITIAL DEVELOPMENT #2-Again, a little disheartened by the result of my first experiment, I went on to try something completely different- and got bored half way through... Here a concept where the letterforms drop from a height into water to float and bob on the surface- looked a little too messy and unorganised, and felt it lost strength in it's visual communication.

 

FINAL DEVELOPMENT- My final design- after a little work, I am quite pleased with this outcome. Although very simple, I think that the timings are considered and work well, as well as successfully meeting the original plans of my storyboard (albeit that it was originally for sequence #4...). Inspired by balloons getting "picked" up on the wind- with an increasingly rapid diagonal descent off the top from off the frame.

Design Production for Digital//Silent Movie//Sequence IV Experimentation.

The series of design experimentation and initial idea development in After Effects for Sequence #4 of my five motion graphics outcomes. In my initial storyboard designs, I was inspired by balloons getting carried away on a brisk wind (therefore, increasing in pace as the wind were to "pick up").



INITIAL DEVELOPMENT #1- Still a little unsure what I did wrong in this initial experiment (due to lack of access to workshop tutors to ask and/or software knowledge)- but despite fitting my mask to original composition size, it clearly got cut short, therefore masking areas of the type that should have been seen- and manipulating the visual outcome within the frame.



INITIAL DEVELOPMENT #2- Not timed/sequenced correctly- cutting too short, and leaving the descender of the 'f' still exposed on the frame at the end of the sequence.



INITIAL DEVELOPMENT #3- A little tired with this idea, I went on to try something quite different in order to try and get some inspiration back. My thinking behind this design was balloons floating to the top of a ceiling, and rolling on the top surface (as I had previously considered in early storyboard sessions)- however, it was too static with the grouped characters until mid-point in the frame, and looked too messy at the top. Time for something different.



INITIAL DEVELOPMENT #4- Tried to amend the static issue about with rotating axis points of the characters from the very first key frame as they gradually moved to the top- but again, looked a little too messy and distracting- the 'o' in particular too hectic- deterring away from the "float" visual communication to much more of a "wobble".



FINAL IDEA DEVELOPMENT- Again, tried something completely new again, and was very happy with the results. This time, I took inspiration from balloons being released from a box/bag (see my Design Context blog, where I have posted video source inspiration from YouTube)- with a fast-paced burst at the beginning, and then the characters on their own individual vertical incline of the frame afterwards. Think this works well, and is a good form of visual communication, of course, a lot more could, and will, be done to it throughout the rest of the Design Production for Digital module.
 

Design Production for Digital//Silent Movie//Sequence III Experimentation.

Ideas development for sequence #3. During the storyboard process, this has been my favourite design outcome. Very simple, but clear, direct and not compromising the legibility or readability of the characters whilst still maintaining the visual communication of the word "stretch". However, in the software process of this design, I have found it is probably one of my least favourites. Despite still liking the concept of treating the ascenders and descenders as stretched elastic bands, it still looks a little plain- will definitely be returning to this sequence at a later date in the Design Production for Digital module to see what more can be done with interpreting this concept.

INITIAL DEVELOPMENT #1- Following my storyboard strictly, this was the first design I went on to make in After Effects- with a few schoolboy errors. Here, the ascenders finish too short in the 5-second time frame, and both the ascenders and descenders have uneven/unmeasured finishing anchor points- which results in messy vertical ascent and descent of the characters.

FINAL DEVELOPMENT- Straightened and elongated, the final design- simple, but, hopefully, effective. Will return to this at a later date in the module to see how far I can push the concept with additional software knowledge.

Design Production for Digital//Silent Movie//Sequence II Experimentation.

My second design development sequence series from the Design Production for Digital 'Silent Movie' brief- in which I, once again, have chosen to visually communicate my word 'stretch'. Having developed my first sequence series (see previous Design Practice posts) in the way that I have, coming to this second sequence- I found that they were rather similar, therefore, as posted below, are the design developments and changes I have had to make as I've gone along- each documented and annotated with reflection of how I will improve these sequences once I returned to them with my improved software knowledge throughout the module.

IDEA DEVELOPMENT #1- As discussed above, now far too similar to my first design sequence- seems like a half-finished, half- hearted version. Although I would have liked to develop more sequences on hand-rendered story boards, at this late stage, I wanted to stay with the software and develop the sequence design as organically and promptly as I could.

IDEA DEVELOPMENT #2- Again, a little too similar to my first sequence... tried to make it more unique by adding a couple of elastic bungee- like bounces into the stretch, but, again, I wanted something a little more unique for the sequence series.

IDEA DEVELOPMENT #3- Decided to draw inspiration from my third sequence (I designed this one afterwards... not in numerical order!)- using the ascenders as my stretch motion. Quite liked this design, good bounce which reminded me of the retracting string of a yo-yo, potentially utilise this at a later stage? Again, however, schoolboy error- type didn't rise vertically enough before the end of the sequence- easily amended and styalised.

FINAL DEVELOPMENT- Quite happy with this final outcome- something a little different- again, reminding me of yo-yo strings after the initial stretch of the ascenders. Once again, I look forward to developing this further at a later stage in the module.

Design Production for Digital//Silent Movie//Sequence I Experimentation.

My first sequence development in the series of (a minimum of) five designs in the 'Silent Movie' Design Production for Digital brief. In this sequence, I used my word "stretch", and was inspired by elastic bands and catapults to create the visual communication of the word itself. The video samples below document my development through creating this sequence outcome.

INITIAL DEVELOPMENT #1- Doesn't scale up large enough, not very high impact with the type starting in the centre at 100% (scale) in the first key frame and also in the last- a bit slow and boring.

INITIAL DEVELOPMENT #2- The vanishing point 0% scale works well in this sequence, but the zoom-in scaling of the type in the central key frame doesn't hold for quite long enough- therefore isn't as high-impact as pulling upon a catapult/elastic would be- not very realistic sense of the tension and force that is created.

INITIAL DEVELOPMENT #3- Little change from development #2 in this sequence- but an increased temporal pace as the scale of the type increases- still not enough duration whilst held in this key frame (which appears to be a solid black layer), however.

INITIAL DEVELOPMENT #4- Tried working with opacity to give a sense of the tension in fabric/elastic that would be created by the pulling stretch motion, however, not as effective as I would have hoped. The 45% opacity black (at it's lowest, when in the central zoomed-in key frame) against the yellow isn't a very appealing colour- grey/green- again, detracts from the visual communication of the word itself.

FINAL DEVELOPMENT- The finished sequence, in 100% opacity R 35 R 31 B 32 throughout, with an increased temporal pace as the scale of the typeface increases, as well as an increased duration of the central zoomed-in key frame, which works well to create a sense of tension before the "elastic" is released and "shoots off" into the vanishing point (0% scale). Quite happy with the outcome of this design, again, really simple, but in this case, I think that works quite well- plus, very true to my storyboard which I'm pleased with. 

As my After Effects knowledge develops, I will return to this design to see any way it can be enhanced or worked upon before the Design Production for Digital module hand in at the end of February.

Design Production for Digital//Silent Movie//Adobe Workshop I.

Despite attending the Adobe After Effects first workshop when it was initally given and drafting up a post of screenshots and content from the session, going back over my blog today, I have been unable to find the original source. Therefore, for the record, and a personal reminder before I immerse myself in designing tomorrow, I decided to recap the session to record what I learnt from my first interaction with the software programme.

Opening up the Adobe After Effects software, you are greeted with a welcome page with composition/page layout options, tips of the day, etc. In this case, we cross out of the page to go directly onto the opening format screen display.

To create a new composition:

Composition > New Composition

From this point, we can go on to specify screen dimensions/colour of our background, frame rate setting/resolution, etc.

Choosing a black background with the PAL D1/DV Widescreen Square Pixel resolution, this is the screen that appears- colours and other settings can be chosen accordingly

(as shown in the screenshot above).

To create a solid shape:

Layer > New... > Solid

Select appropriate width and height of the solid shape (can be manually entered by double clicking and highlighting a box for the numbers, or an arrow drag across function can also be used), and choose your colour by double clicking inside the box, or using the colour picker accordingly.

The solid can then me manipulated in height or width, or moved around the screen accordingly.

The duration of time that solid is seen on the screen in the motion graphic design, and the total elapsed time of the complete motion graphic animation can be determined by sliding the red timeline bar in the work space or the current time indicator bar across by manually sliding along to the specific time requirements.

Multiple solid shapes can be adding by repeating the initial solid layer toolbar drop down menu- size and colour are determined and manipulated in the same way.

To adjust the quality of the images/solid layers shown on screen- select the resolution/down sample factor pop up (next to the RGB colour model symbol). Working on a lower resolution will ensure that large files are more manageable to work with, and the software runs more fluidly (such as when you can select 'Overview Print' option- to opt in or out in Adobe InDesign print production software).

To select transform options for the solid layers, click on the drop down menu arrow(s) in the 

project workspace area. 

If you, again, select the arrow drop down option from the transform menu, more options become available- here, we have selected the 'P' position option, which will allow us to control the path in which the solid layer objects are moved in the motion graphic path.

 

Move around the solid layer objects in accordance to the timeline, and mark significant key frames by clicking the timer button to the left of 'position' in the project workspace- the same is applied for other options such as scale, opacity, etc.

Selecting the tilda key on bottom-left corner of the keyboard '~' allows you to look at the workspace, key frames and solid layers more closely in a large-scale view.

Clicking on anchor points with the pen tools makes curved lines straight- and also, by dragging the anchor points, you can make Bezier curves, as you would in the Adobe Illustrator software.

By dragging the cursor over all of the key frames and selecting Alt, all of the key frames can be moved simultaneously over time in the motion graphics sequence. 

To render your sequence:

Composition > Add to render queue

Output Module > H.264 (most suited for vimeo/blog uploads) 

And select where you want your file to be saved- in my case on my desktop (as can be seen in the screenshot below). Files will be saved as a Quick Time Player file.

Design Production for Digital//Silent Movie//Final Storyboards.

(At last!) The finalised storyboards for my motion graphics 'Silent Movie' designs. As ever, with luck, managed to run out of my blue pen just as the shops were closing- so re-drew the two 'float' storyboards and unfortunately have had to go without applying the colour at this time (in the final designs the MS Trebuchet Italic typeface will be in white R255 G255 B255, with a blue R150 G208 B238 background). Here, I have structured the key frames temporally in the sequence to consider the pace of the design- the majority of which (as seen below) being evenly paced for graduated movement- due to the reasonably gradual nature of both of my words in motion ('stretch' and 'float').

SEQUENCE #1

 SEQUENCE #2

SEQUENCE #3

SEQUENCE #4

SEQUENCE #5

Design Production for Digital//Silent Movie//Gickr Experimentations.

Made some quick Gifs on the Gif- making and sharing website 'Gickr' of my final five storyboards for the Silent Movie project. Not great in terms of quality (late night/dark room= high flash= evidence of my shoddy colouring skills) but portray the motion design, sequential and temporal thinking quite simply before taking these in for development and finalisation in the Adobe After Effects software.