10th, Jan – Week 1
Exercise 1
Applications for motions within a brand:
- Logo graphics/icons
https://dribbble.com/shots/10223861-Circles-Logo-Animation
The reason I like this example is that the artist included a storyboard with thumbnails so that we could see how and why the motion graphic was developed.
- Games design
https://www.pinterest.ie/pin/706713366498636426/
Even though this motion is short and simple, the colour palette is very bright and fun to see.
- Typographic design
https://www.invisionapp.com/inside-design/kinetic-typography-examples/
- Broadcast graphics ex: World Cup (2022) Qatar icon.
https://bmcmotors.com.ec/mundial-catar-2022/
I like how capital letters and Arabic-style letters are combined in the font. It blends in with the nation.
____________________________________________________________________
Exercise 2
Choose one of the two videos provided in class and make a list of 3 elements/graphics that you can see have motion applied.
Poki:
When you scroll down on the website, the ball is moving around and giving instructions and make your eyes follow the places they want you to focus. Viewing it while you are experiencing the website it is fun. It seems to suit with the type of product they are offering.
There is a white part that highlights all the benefits that you can get from them.
It’s colourful and have a variety of mood/games.
Scout Motion:
Despite the fact that the entire video was moving quite quickly. I understood that the business’s focus on “time” and “money”. The drawings of a hand with a watch which appears briefly before disappearing completely, in my opinion, it is quite attractive.
Colour Palette uses: Blue and Green – Technology, Trust, Competence, Growth, Freshness, Quality.
_____________________________________________________________________________
Exercise 3
Using 2 websites, mention 3 elements that have motion applied.
Toni & Guy website.
The background effect with various pictures in movement for each title. Those pictures looks like they are cuts in several pieces when you scroll you mouse up or down.
When you scroll to each titles, three pictures come up on the screen from the left hand side. When you put the mouse on top of those pictures, the sub title pop up in a bigger size to make more readable and a little hand shape pointer appear to show that it is ready to click on the page.
https://ie.boohoo.com
For this website, I found only one motion.
On the first page, I came across with this big picture with a message “40% off everything” highlighting.
I like the colours they chose. Because it’s not aggressive and it fits nicely with the whole webpage.
I think it could add more motion graphics around the page to make it more fun for the users to experience it.
For example, few videos of models wearing their clothes, or a video mixing their logo with the model moving at the background.
________________________________________________________________________________________
17th, Jan – Week 2
Today we started learning basics tools using After Effects.
When I was doing the tutorial proved from the program itself, I think it was useful and makes me think that it’s not that complicated. Although it is very easy to get lost if you don’t organise the files and name them properly.
I really like how it starts already and I’m looking forward for learning more about it.
Position
2D position layer – (x, y)
3D position layer – (x, y, z)
Position of (0, 0) and (0, 0, 0) is the upper-left of the Composition panel.
X – horizontal axis.
Y – vertical axis.
Z – depth in 3D – d the axis perpendicular to x and y.
Scale
2D layer can create the illusion of zooming in and out on the layer.
Exercise 1
Analysis of two website similar brand values or themes to my own brand.
https://www.irisvanherpen.com
Iris Van Herpen’s website is attractive and well-kept. There is a brief film introducing the new collection when you open the first page. Everything is professional and sophisticated, which I want to incorporate that to my website.
https://www.irisvanherpen.com/boutique/symbiosis-belt
https://gfycat.com/gifs/search/iris+van+herpen
https://www.jomalone.eu/pt/en/
I appreciate the colour scheme and how all the categories are neatly and clearly separated on the Jo Malone website.
https://eu.louisvuitton.com/eng-e1/homepage
Louis Vuitton has a more vibrant website than Iris Van Herpen, which has a different vibe. I can sense the excitement and brand vibe from the video.
Overall, I want to combine both emotions into one.
____________________________________________________________________
Exercise 2
Two logos with motion applied.
Assess each, considering:
Brand values
Colours
Shapes
Style of Motion
Message communicated
https://www.orangetheatrecompany.com
OTC brings to the stage theatre that is both entertaining and thought-provoking. Considering that I want to make a graphic emotion that entertain the user.
Brand values: Fun, consistency
Colours: Yellow and black
Shapes: Geometric
Style of Motion: Fun
Message communicated: Enjoyable, Fun
https://dribbble.com/shots/1736621-Bloom-Logo-Animation
Brand values: Integrity
Colours: Black and white
Shapes: Geometric
Style of Motion: Fun
Message communicated: Enjoyable, Fun
https://www.pinterest.ie/pin/464011567856639886/
Brand values: Fun, be you, confident
Colours: Black, blue and pink, Gradient
Shapes: 2D
Style of Motion: Fun
Message communicated: Enjoyable, Confidential
____________________________________________________________________
Exercise 3
Brainstorm
Isolate shapes – square, pointed shapes
Visual – illustration and photographs
Themes that transferable to motion – Minimalist but functional
Tone of voice – collide
Text Copy – square text
How could I apply motion graphics to it to enhance your brand communication?
- Use animation to move a subject(logo) around a scene.
- On the screen, the letters “r” and “j” appear to be about to clash. Once the logo was constructed in the centre of the screen, it rotated to give the impression that you were in the center of a stage. Use the color scheme to depict the stage. I don’t want the background to have a motion effect since I want to highlight the movement of the logo.
- Create background effects such as flowing patterns.
- Add flickering and wiggling movements.
- Wiggling lines to interpret illustration from the poster.
- Introduce motion graphics to existing video content.
- Use different types of cloths texture movements videos
- Create visual effects such as motion blur
Considerations:
Is there text in your logo?
– Yes. The brand Tagline “Where Theatre & Fashion Collide”
Is there an icon?
– Just the logo
Are there assets that you could add? (imagery, video footage)
– Model photographs.
____________________________________________________________________
24th, Jan – Week 3
Exercise 1
Analyse my brand, considering the application of Visual Effects.
Mood/Vibe: entertainment, floating, slow, elegant, sophisticated.
List two potential uses for visual effects in your motion design solutions.
Bright lights, Atmospheric Smoke floating on the screen.
- Describe the effect.
Everything will be floating very slowly - Discuss the asset it would be applied to
logo, video footage, pattern design - Discuss the affects of including these visual effects.
It will give interesting or suspicious vibe that the target audience might want to know more about it.
____________________________________________________________________
Exercise 2
Experiment with footage file:
Apply one visual effect of your choosing: make it rainy
Customise the settings to communicate a message or feeling: made the screen darker which fits with the weather. Contrast of the woman running in the rain.
Apply a second visual effect that enhances the message
Document the result:
At first, in my opinion, the video was disorganised. After some testing and attempts to direct the motion towards my message, I eventually achieved a partial outcome that I am so far very pleased with. However, I think I should strive to use the After Effect more and keep learning new things about the program.
____________________________________________________________________
Exercise 3
Using the footage provided, choose 2 of the 3 visual effects listed below to experiment with, using the theme of your brand to guide your decisions:
•Add any visual effect that will communicate feeling.
•Add text to the footage using the ‘Track Camera’ feature
•Add a graphic/image to the footage using the ‘Track Camera’ feature
____________________________________________________________________
Exercise 4
How might you promote your brand when the logo isn’t the central component of the advertisement?
Using footage videos that communicate my theme brand.
Using your previous research, brainstorm potential promotional tactics that might apply to your brand.
Using one of the pieces of footage provided (Moodle), combine your choice of visual effects to entirely change the mood of the piece.
pre-sets in after affect
____________________________________________________________________
31st, Jan – Week 4
Exercise 1
Script for my logo animation.
The logo is first placed flat down as if a stage, then lift them individually (“r” and “j”, and allowed to converge into the desired shape in the middle.
I want to make it spin once they connected in the middle forming the logo itself.
I want to incorporate the model photos as part of the branding too.
Exercise 2
Research: Find a motion graphics video and try capture how the storyboard may have been developed.
– Consider the key scene
– Create thumbnails of what these could be
– Note transactions and details
– Document your findings
I am keen on how each screen is organised and detailed.
Exercise 3
Based on your script, develop a storyboard for your logo animation.
____________________________________________________________________
07th, Feb – Week 5
Exercise 1
Animate a line from your brand messaging.
– Choose a text animation effect and customise it, considering what parts of the text it is applied to and the timing of the animation.
Typography – Nova Square
Wipe in to the center motion text.
Easy Ease the rotation motion of the logo.
____________________________________________________________________
Exercise 2
Turn my storyboard into an Animatic. (black and white, key frame to key frame)
The animatic was made based from my script and storyboard.
The logo in the center: a horizontal rotation of 360 degrees
____________________________________________________________________
Exercise 3
Review your script and research:
– Have you collected enough examples of communication through motion design?
YES
– Have you analysed collected examples critically?
YES
– Are these displayed on your blog?
YES
____________________________________________________________________
Exercise 4
Consider your Concept & Development
Checklist:
– Script
– Thumbnails
– Storyboard
– Animatic
____________________________________________________________________
Exercise 5
Develop your Logo Motion Graphic
The colour with the background did not match correctly. However I like how the slogan appears slowly on the screen.
According to reviews, the background did not express my brand clearly. It’s challenging to understand the voice’s tonality. a horizontal rotation of 360 degrees
This is the final piece of Logo Animation.
Instead of turning a horizontal rotation of 360 degrees, I changed it to 360 clockwise rotation. Personally I think it works better with the brand and tagline.
____________________________________________________________________
21st, Feb – Week 6
CTAs Tricks & Tips
1. Give your audience a reason
2. Use commanding language
3. Incorporate emotions
4. Give it parameters
5. Consider the platform
6. Incorporate branding
Exercise 1
Research CTAs
– What CTAs with motion incorporated can you discover?
– Document and analyse minimum 3 examples, considering message and brand values.
Web CTAs
https://www.tuftandneedle.com
Tuft and Needle target is to make people shop their products. In my opinion, it makes perfect sense to put the CTA “Shop Now” on the home page.
On the eventbrite website, there are a few CTAs that are highlighted in orange and are clearly visible to anyone looking to purchase a ticket.
____________________________________________________________________
Exercise 2
Write a script for your CTA.
– Keep it basic to follow further visual exploration.
– Keep its purpose in mind: what is the message this CTA will communicate?
– Brainstorming before beginning your script.
____________________________________________________________________
Exercise 3
Develop a Storyboard for your CTA.
– Start with thumbnail sketches.
– Turn this Storyboard into an Animatic.
____________________________________________________________________
Exercise 4
Develop your CTA motion graphic.
– Consider placement on your website.
– Ask yourself are there any skills you will need to develop on before creating your storyboarded graphic?
– Do you need to generate further assets?
28th, Feb – Week 7
Exercise 1
Research Social Media Promotions.
TikTok, Instagram, Pinterest
Tumblr
Not much video graphics, more pictures, similar to twitter.
____________________________________________________________________
Exercise 2
Write a script for your Promotional Piece.
Begin again with a brainstorm.
Identify what message you hope to communicate.
Identify the social media platform your promotion will feature on.
Instagram
Similar to Facebook, and where it gets psychologically interesting, people can “like” your pins, but unlike Facebook, people don’t have to follow you to find your pins. To summarize, the main point of Pinterest is to share ideas with like-minded people, ideas that typically involve some sort of creative expression.
Pinterest
I believe that Pinterest is a visual discovery engine for finding ideas like recipes, home and style inspiration. So thinking of my target audience I believe that people into fashion love to pin fashion features which they feel are interesting. Also I like when you discover Pins you love, save them to boards to keep your ideas organised and easy to find.
____________________________________________________________________
Exercise 3
– Develop a storyboard for your Promotional Piece, starting with thumbnail roughs.
– Turn your storyboard into an Animatic.
07th, Mar – Week 8
Recap
Erika Fukasawa 