Motion in Context

This is a simple example of parallax. The purpose of this piece was to take a snapshot and give it life. The parallax helps change the image from stereo to dynamic. The animation on the sky and lights are meant to support the main parallax effect. This is so it looks more like a camera moving through a scene and less like a camera moving past flat cut outs.

This is an example of the parallax effect used on a product that utilizes the theme. It utilizes three of the voice vocabulary to help enforce the idea of opposing ideas coming together at a crossroads. Even though both heritage and metropolis have their own identities they can expand beyond those definitions to become harmonious with each other. The heritage scene brings in Riga’s history and skill with steel, railways, and train building. The metropolis scene is meant to call on the fact that Riga isn’t a crumbling relic from the past. It is a bustling modern metropolis. Then the harmony scene is meant to show how even with all the conflicting ideas, they have come to create a peaceful harmony.


Purpose of motion style:

The purpose of both pieces is to create movement and depth. It makes the images more interesting which snags the viewers’ interest. The movement is important because of the theme. A person can only reach a crossroads if they move along the path.

 

Use of motion style in real world application:

This style can be used for images that will be displayed on screens in waiting areas. The movement will help make them come across less as screensavers. The movement can also be applied to web design. An image like Riga Lamps can be incorporated into the design and as the cursor moves to different sections, the camera can move through the space.

 

Rationale:

Connecting, Synthesizing, and Transforming

Parallax is used to provide depth and give the images life. Bimber and Heinich (2017) explain that depth cues are given when perspective changes which tricks the eye into believing it is real space. This was achieved in Riga Lamps by using different visual cues (i.e. separating the layers at different distances and camera movement) and animations (i.e. the sky and lights) to make it feel like a live scene. Riga Harmony though explores what other senses can be fooled to believe it is a real space. The second motion graphic uses diegetic and non-diegetic sound. The non-diegetic sound is the background music which plays on the idea of harmony. The diegetic sounds are tied to the images though. Beauchamp (2017) uses the quote, “we don’t see everything we hear, but we need to hear most of what we see”. This quote is given to explain how hard effects help tie the viewer’s perception to the scene. By hearing pigeons and showing a viewer the image of pigeons with subtle animation, it helps trick the eye to perceive the scene as more alive. By combing the visual tricks of parallax and the audio cues of the sound effects, it creates a more realistic perception of space.

 

Problem Solving

The main design problem was trying to use the parallax in such a way that it could strengthen the brand. Yes, cool motion graphics can be made with this technique but how does it further the theme. To address this, I visualized what kind of motion is associated with a crossroads. Most of the ideas involved following the path. So, when moving the camera, I kept it in line with the natural path in the images. For example, in Riga Harmony during the metropolis scene, rather than traveling right to left, the camera goes left to right. The path in the image travels from the lower left to the upper right. In the train scene, the camera follows the narrow gravel path between the two trains. In Riga Lamps the camera travels out of the city square following the line between the statue and the lamp.

 

Innovative Thinking

Most motion graphics that seem to use the parallax effect do it as a way to showcase the photography like the WWF Parallax Sequence produced by Ad-Hoc Films and Glynn (n.d.). Riga Harmony uses the effect to tie the imagery to the theme and to support the message. It is more than just a collection of riveting pictures; it is a vehicle for the theme.

 

Audio Identity

The audio identity consists of the sound effects and the background music. The sound effects are meant to play on the viewers’ perceptions and make the space more believable. These hard effects are meant to make the images more concrete. The background music was added to bring in the concept of harmony. Since parallax movement isn’t meant to create rapid movements, the music had to have a medium-slow tempo so that it didn’t outpace the imagery. Always Moving Forward utilizes traditional instruments that would not be uncommon in music found in the area.

 

References

Ad-Hoc Films, & Glynn, D. (n.d.). WWF Parallax Sequence. Retrieved from https://makeproductions.co.uk/portfolio/wwf-parallax-sequence/?doing_wp_cron=1531703982.1003189086914062500000

Beauchamp, R. (2017). Designing Sound for Animation, 2nd Addition. Place of publication not identified: CRC Press.

Bimber, O. & Hainich, R. R. (2017). Displays: Fundamentals & applications. Boca Raton, FL: Taylor & Francis, CRC Press.

Blazer, L. (2015, November 19). Animated Storytelling: Simple Steps For Creating Animation and Motion Graphics. Retrieved from https://ce.safaribooksonline.com/book/animation-and-3d/9780134133812.

Czarnecki, L. (2018, November 26). 7 Essential Typographic Layout Systems. Retrieved from http://type365.com/blog/2017/02/21/7-typographic-layout-systems/#radial

Davidson Belluso. (2019, January 22). Animate Still Images With Parallax – Davidson Belluso | Phoenix Advertising Agency. Retrieved from https://davidsonbelluso.com/animate-parallax/

Giant Ant, & Philpott, C. (2019, May 06). Men’s Health How a Bean Becomes a Fart. Retrieved from https://vimeo.com/103721959

Krause, J. (2016, February 10.). Color for Design and Art. Lecture. Retrieved from https://www.lynda.com/Illustrator-tutorials/Valuing-value-over-all/418257/471600-4.html?autoplay=true

Liu, K., & Lin, O. (2015). TEDxTianhe Opening. Retrieved from https://vimeo.com/108440882

S., Moyers. (n.d.). What is Parallax Scrolling and Benefits of Parallax Web Design. Retrieved from https://www.spinxdigital.com/blog/5-reasons-for-parallax-scrolling-web-design/

Pannafino, J. (2018, November 15). 12 Basic Principles of Animation in Motion Design. Retrieved from https://www.howdesign.com/web-design-resources-technology/12-basic-principles-animation-motion-design/

Sharma, N., & Varki, S. (2018). Active White Space (AWS) in Logo Designs: Effects on Logo Evaluations and Brand Communication. Journal of Advertising, 47(3), 270–281. https://doi-org.oclc.fullsail.edu/10.1080/00913367.2018.1463880

Unidad22. (2019, January 16). The Benefits Of Parallax Scrolling | Web Design. Retrieved from https://unidad22.com/benefits-of-parallax-scrolling/

Wisslar, V. (2012, July 24). Illuminated Pixels. Retrieved from https://ce.safaribooksonline.com/book/illustration-and-graphics/9781435456358.

 

Advertisement