Digital Photography & Imaging / Final Project

10.18.2021 - 11.22.2021 (Week 9 - Week 14)
Audrey Gracia Djohari / 0348120 
Digital Photography & Imaging
Bachelor of Design (Hons) in Creative Media / Taylor’s University
Project 4 : After Effect Exercise & Final Project (Self-Titled)

---

JUMP LINKS

• Lectures
• Tutorials
• After Effects Exercise
• Final Project Process
• Final Project Outcome
• Feedbacks, Reflection

---

LECTURES

WEEK 9 : Digital Surrealism

- Realism Vs. Surrealism

• Realism

Takes subject matters of the ordinary and common world which we call "reality." It almost always takes a non-exotic and non-extraordinary subject matter and theme. There is no need to think outside of the box, as that is not "real."

• Surrealism

A twist on Realism. It explores the subconscious mind, with subject matters concentrating on dream-images and often aims to distort the ordinary and what we call reality

Figure 1.0: Realism

Figure 1.1: Surrealism

- Surrealism

• Surrealism defies logic. 
• Dreams and the workings of the subconscious mind inspire surrealistic art (French for "super-realism") filled with strange images and bizarre juxtapositions.
• Fueled by the teachings of Freud and the rebellious work of Dada artists, surrealists like Salvador Dalí promoted free association and dream imagery.

 

Figure 1.2, 1.3: Surrealism Art

- Dadaism

• An anti war art movement with art works that is satirical and nonsensical in nature.
• Salvador Dalí was a Spanish Surrealist painter and printmaker known for exploring subconscious imagery.

 

Figure 1.4, 1.5: Dadaism Art

- Digital Surrealism

• Surrealism is a cultural movement focused on type of arts to express about the artist’s idea themselves.
• In this digital era surrealism is one of the top digital art styles.

 

 

Figure1.6-1.9: Digital Surrealism

- How To Start Creating Digital Surrealism

Think about: dream-like scenes and symbolic images, unexpected, illogical juxtapositions, primitive or child-like designs, bizarre assemblages of ordinary objects

Figure1.10: Digital Surrealism

1) Capturing Your Dream

• Sketch It Out

Take a piece of paper and pen/pencil or a tablet and start to sketch. Draw your vision out roughly. Don't finesse any details yet, but just lay out key points of your vision.

• Find References Images

Gathering reference images will help you greatly in realizing your new idea. Gather images that directly relate to what you have in mind. 

2) Mindset During Creation

• "Does this look real?"

Surrealism is at its best when it's convincing enough that it could be real, however we obviously know that the subject matter you are creating is nonexistent, thus is not real.

• Make it happen to the best of your ability.

When you try to approach something challenging, you will learn the skills you may need for next time to make it work. The worst thing you can do is be afraid and back off from your idea, because you would never learn that way.

- Reference Links

1. Incorporating Surrealism Concepts into Your Digital Artwork: https://bit.ly/3xjCmTf
2. Surrealism art and literature: https://www.britannica.com/art/Surrealism
3. Creating Surrealism in Photoshop: https://creativepro.com/creating-surrealism-in-photoshop/
4. What is Dadaism, Dada Art, or a Dadaist?: https://magazine.artland.com/what-is-dadaism/
5. Salvador Dalí Spanish artist: https://www.britannica.com/biography/Salvador-Dali

WEEK 10 : Intro to After Effects

Figure 1.11: Adobe After Effects

- What is After Effects?

• Adobe After Effects is a 2.5D animation software used for animation, visual effects, and motion picture compositing.
• After Effects is used in film, TV, and web video creation.
• This software is used in the post-production phase, and has hundreds of effects that can be used to manipulate imagery. This allows you to combine layers of video and images into the same scene.
• Adobe After Effects takes a different approach for creating movement. 
• Motion graphics animation works by manipulating vector and rasterized art to create and tell a story. 
• You can integrate physical based media as well through photographs and videography.

Figure 1.12: Editing in Adobe After Effects

- Pre-Compositing in Adobe Photoshop

• Basically Photoshop is a platform to compositing the layers.
• All the layers need to be arrange and rename accordingly so that it will be organize and easy to be animated in After Effects. 

Figure 1.13: Pre-Compositing in Photoshop

- Pre-Compositing in Adobe After Effects

• Adobe After Effects is a digital visual effects, motion graphics, and compositing application. Basically we can import elements such as images, video, vector and more into After Effects. 
• All the layer elements need to be organized and synchronized to the external software platforms such as Photoshop & Illustrator. 
• After Effects files does not embed its media, it links to it.

Figure 1.14: Pre-Compositing in After Effects

WEEK 11 : Digital Photography

- Exposure Setting

• In photography, exposure is the amount of light which reaches your camera sensor or film.
• The main parts of the camera:

1. Camera body: Shutter, Image sensor, LCD screen
2. Camera lens: Aperture/ Iris

• The camera body is a light proof box.

Figure 1.15: Parts of Camera

• Aperture, Shutter and ISO correlation:

1. IRIS/APERTURE:
2. SHUTTER SPEED: 
3. ISO: 

There are only two camera settings that affect the actual “luminous exposure” of an image: shutter speed and aperture. The third setting, camera ISO, also affects the brightness of your photos.

Figure 1.16: Exposure Triangle

1) Iris/Aperture

• control the flow of light entering the lens.
• Iris/Aperture is measured by f-stop, indicated by sequence of f-number: f/1, f/1.4, f/2 , f/ 2.8, f/ 4, f/ 5.6, f/ 8, f/ 11, f/ 16, f/22 , f/32
• The lower the f-number, the larger the lens opening

Figure 1.17: Iris/Aperture

2) Shutter Speed

• The shutter is a small plastic sheet that opens and closes to allow light onto the film or prevent light from reaching the film.
• Shutter speed is measured in seconds: 1/1000 s,1/500 s,1/250 s,1/125 s,1/60 s,1/30 s,1/15 s,1/8 s,1/4 s,1/2 s,1 s, 2 s, 3 s…

Figure1.18: Shutter Speed

Figure 1.19: Shutter Speed in Photography

3) ISO

• Originally referred to the sensitivity of film—it's "light gathering" ability. For digital photography, ISO refers to the sensitivity—the signal gain—of the camera's sensor.
• The common ISO camera settings are: 100, 200, 400, 640, 800, 1600, 3200, 6400….
• The lower the number of ISO the less sensitive your camera is to light and the finer the grain.

Figure 1.20: ISO

- Lens Perspective

• The are wide angle lens, standard lens and tele lens.
• Appropriate lens provided desire framing, lens choice affects angle of view.
• Different lenses are designed for different for different purposes. Lenses can be categorized by FOCAL LENGTH.

Figure 1.21: Different Camera Lens

Figure 1.22: Types of Camera Lens

1) Focal Lengths

• The shorter the focal length, the wider the angle of view and vice-versa.
• Focal length is the measurement (in millimeters) from the optical center of a camera lens to the camera’s sensor.

Figure 1.23: Focal Length

2) Depth View

• The proportion of the image that is reasonably sharp and in focus.
• The smaller the aperture you use, the greater the depth of field.

Figure 1.24: Depth of Field

• Wide angle lenses are ideal for fitting a large area into your frame.Wide angle lens is especially useful for landscape photography or street photography. With wide angle lenses, almost everything is in focus, unless your subject is very close to the lens.
• Standard lens offer a fairly accurate representation of what the human eye sees, both in terms of visual angle and perspective. Images created by standard lens are perceived as more natural than those taken with other types of camera lenses.
• Tele lenses are great for isolating a subject that is far away. Tele lenses allow you to photograph subjects from a distance thanks to their magnification.

- DSLR Vs. Smartphone

Pros

• Familiar with device
• Good quality
• Easy to learn

Cons

• Still limited
• Good but not great
• Non-ergonomic shape

DSLR cameras are designed to capture images. Phones are designed to carry out a multitude of functions. Phone cameras are very limited by size. The size of the lens and the size of the sensor that captures the photos. Entry-level DSLR have much larger lenses and sensors than mobile phones do.

WEEK 12 : Double Exposure

- Double Exposure & Image Blending Mode

Double exposure photography refers to merging multiple images. The goal is to make them surreal, emotional, or humorous. They usually feature silhouettes.

Double exposure effect may look complicated at first. But it’s easy to make in-camera and in Adobe Photoshop. You don’t need a double exposure camera, as there are a few other ways you can create them.

In the editing world, you have endless possibilities. You can transform ordinary photographs into powerful masterpieces.

1) Using Tilt-Shift Effect

Photoshop has a great tilt-shift tool that will transform your photos into soft works of art. If you want to be extra creative, blur one of your photos instead of the entire image. Or blur everything except for one important detail.

To add this feature, go to Filter > Blur Gallery > Tilt-Shift.

Figure 1.25: Tilt-Shift Effect

2) Create Fake Reflection

There are many ways you can create reflections. One of them is creating a double-exposure with the help of a separate window photo. This is an example of main subject surface with raindrops and bokeh. This help to add interesting textures to a multiple exposure photography.

Figure 1.26: Fake Reflection

3) Experiment with simple portraits and details textured
Combining something plain with something complicated will give you a balanced result. It will also save a lot of simple photos that you might discard.

4) Convert your results to Black & White
A lack of colour will strengthen the emotions in your double-exposure images. If you want to express your work in a vulnerable way, experiment with this. It gives them a unique depth and allows you to experiment with something interesting just like film photography.

5) Work with Silhouette

Many double exposure photographers choose to work with silhouettes. It would give you a fun and doable challenge. And an opportunity to show very creative sides of yourself.

Figure 1.27: Silhouette

6) Pick two random photo
A lot of double exposures photography were happy accidents. But they led to great feedback and even greater creative growth. Try and forget about any other double-exposure ideas. Shoot interesting textures, shapes and forms instead.

7) Make simple objects look fascinating
Take photos of everyday objects you usually take for granted. Try to make them look like something else. This technique will enhance your imagination.

8) Use Shadow

Outlines of any kind are fantastic to work with for double-exposure photography. Shadows are as effective as silhouettes in this genre. They’re fascinating to work with. Take a photo of someone’s shadow and transform it into a story.


- Photoshop: Blend Modes

Working with blend modes is almost always an experimental process. Because it’s nearly impossible to predict the results, you always seem to end up experimenting with different modes and Fill Opacities until you get the results you’re looking for.

Figure 1.28: Blend Modes

 

Figure 1.29: Blend Modes Application

- Reference Links

1. Tips for creating Double Exposure Photography: https://bit.ly/2xy0OGY
2. Photoshop Blend Modes explained.: https://bit.ly/2QTxrWe
3. Complete guide to Blending Modes: https://bit.ly/2UN1AYA

---

INSTRUCTION

---

TUTORIAL

WEEK 9 : Moving Imagery

- Demo
How to create loop animation for I.G Stories
https://youtu.be/HQL5ntLlHTg

WEEK 10 : Layer, Composition, Keyframe

1. AFTER EFFECT LIVE DEMO during Tutorial class.
https://drive.google.com/file/d/1TfwJt5DZLGsodVYZ97pgTTJ_rmx40lOg/view?usp=sharing
2. Advanced keyframes (attachment video)

https://youtu.be/qluLUmzPAJE

WEEK 11 : Lighting Do's & Don'ts

- Demo

Lighting in Photography
Photography Lighting practise was conducted in campus photo studio:
https://www.facebook.com/100006534667324/videos/2724224854471977/

Here are some great videos we recommended for new learner to explore the lighting technic:
1. https://youtu.be/D_O6pbT7Ovw
2. https://youtu.be/uwaqfXSIQhQ

Use your camera/phone to take below images (standard lens/ portrait mode):
1. Full body shot of you.
2. Half body of you.

---

PRACTICAL

- After Effects Exercise - 

- Instruction

1. Download the composition below:
https://drive.google.com/file/d/1fePzGWCEqeg2A2rK7VysY0OE3iwtdZKF/view?usp=sharing
2. Import the W9_ANIMATE.psd into Adobe After Effects.
3. Create a composition setting 1080 px (Width) x 1920 px (Height), Duration 15 second
4. Create a keyframe animation to the layers using Position (P), Scale (S) & Masking path.
5. Render output: Quicktime (H.264)
6. Upload your exercise into your Youtube Channel.
7. Update your progress and video to your E-Portfolio blog.
8. Attach your E-Portfolio link on this Submission.

For this exercise, we were to create a short animation using only the provided images. The exercise is to develop our skills in Adobe After Effects. We were to explore the tools in the software and come up with an animated mp4 outcome.

- Process

First of all, I imported the Photoshop file into the Project Panel (upper left panel) which was provided in the Google Classroom. Then, the files were added to the Timeline of the composition (bottom left panel) as different layers so I could adjust each element separately. The timeline turns out to be similar to how Photoshop's layer panel so I was quite familiar with it. The file settings should be 'Composition-Retain Layer Sizes' and I had to make sure it was editable in Adobe After Effects.

Figure 2.0: Importing psd File to After Effects, 11.11.2021

Next I thought about how I wanted to animate the images. After I came up with the idea, I proceeded to start animating by opening the layers first until it shows 'Transform' selections. 

To adjust the position, I created clicked the  'Stopwatch' beside the 'Position' selection to activate it. Then I created the keyframe to determine when I wanted to determine the position's coordinate. Next, I made another keyframe at a different time to determine the position where the image will go to. Keyframe plays a huge role in this exercise, as it's the determiner of when the effects are activated. I did the same thing for opacity, scale and rotation.

However, I had a little problem when I tried to rotate the typewriter image because the center point's position is a bit off. So I used 'Pan Behind' option to adjust the center point's position. That way, the typewriter could rotate the way I wanted.

 

Figure 2.1: Using 'Pan Behind', 11.11.2021

Figure 2.2: Rotation Effect, 11.11.2021

Figure 2.3: Opacity & Position Effect, 11.11.2021

I duplicated some images and make the move to one side to another. I edited the opacity of the projector and I also animated the scaling of the shark. When I finished making all the keyframe and animation, I used 'Easy Ease' (Shortcut: F9) as a finishing touch just like how Mr. Fauzi recommended. 'Easy Ease' is one of the most used After Effect keyframe, it allows the animation to look a bit more organic, by starting slow, then going fast in middle and slowing down at the end of the animation. It adds acceleration and deceleration of the animation.

Figure 2.4: Using Easy Ease, 11.11.2021

Lastly, I rendered the file by going Composition < Add to Render Queue. I made changes to the 'Render Settings' and 'Output Module'. I had trouble finding the right 'Video Codec' selection because in my laptop, there's no H264 (mp4) option for it. So I had to use Adobe Media Encoder to encode it, after doing that, I managed to export the file smoothly.

- Final Outcome

Youtube Video Link: https://youtu.be/n_bkhY9cv2o

Figure 2.5: Final Outcome, Youtube, 11.11.2021

Figure 2.6: Final Outcome in MP4, 11.11.2021

- Final Project: Self-Titled - 

- Instruction

PROJECT 4: SELF-TITLED [30%]

Timeframe: WEEK 9 - WEEK 14
Duration: 15 second
Output: .MOV or .MP4 less than 20MB
Size: 1080 x 1920 px (I.G reel/ story size)
Progress Slide:
https://docs.google.com/presentation/d/1X1KxRuf9knIx-9VI8wIt4iOmeSoV3LitqbVW01Bw1kE/edit?usp=sharing

Idea Development: 5 marks (WEEK 10)
Design Direction: 5 marks (WEEK 11)
Execution and Post Production: 10 marks (WEEK 12)
Animation & Finishing: 10 marks (WEEK 13)

Submission: WEEK 14

WEEK 10 :

- About Me

My name is Audrey, I’m a Chinese Indonesian who lives in Bandung. I’m 18 years old and I’m just a girl who wants to be the best version of herself.

I’m an art enthusiast. I like many things that relates to art including music, illustration, crafts, flower arranging, etc. I find them soothing, and I think art is a very unique way of expressing oneself. It’s abstract, it’s beautiful and often times provoking.

My motivation is to live a meaningful life and to achieve peace in everything that I do. And I realize that I will have to keep learning in order to achieve those things. And I think my life becomes more meaningful when I pursue my dreams and keep growing.

I want my work to have a meaningful message that comes from my thoughts, my experience and how I live. I want to make the visual elements don’t make sense but at the same time they do. And I want to use light and unique color palette that radiates good mood. I want the visual outcome to be both a self-reflective art piece and a message for other people.

- Statement About My Work

1) Tell us about your work
I want to combine things that I like in this work, those are: flower, art, and music. And I want to emphasize the ‘blooming’ effect in my art because I want to convey the message of growing ourself and our passion. I want to use the colors from poster #2.

2) What is the concept behind it?
I’m a part time florist was inspired when I saw how the roses keep blooming under the sun. The roses were already beautiful, but they decided to keep growing and blooming until they reach their maximal beauty. And I think that’s how I should do as well, to keep trying to reach my maximum capacity in everything I do and I’m good at.

3) What is the message you want people to understand it?
I want to show that it’s important to always grow ourselves into a better person each day. Slowly but sure.

4) What is your motto/ quote?
“Bloom From Within”

- Visual Research

Figure 3.0: Reference #1, 10.25.2021

Figure 3.1: Reference #2, 10.25.2021

Figure 3.2: Reference #3, 10.25.2021

Reference #1
I like the flower suit in this picture, the idea is amazing and it creates an appealing visual

Reference #2

I found this poster’s randomness and color scheme very warming and aesthetically pleasing.

Reference #3

I like how the clouds look like cotton candy. I like the composition and the whole color scheme work together in this digital surrealism.

WEEK 11 :

- Idea Developement & Sketches

I made 2 sketches. Both of them have a similar elements like flowers, clouds and musical elements.

Figure 3.3: Ideation Sketches, 10.25.2021

- Photoshoot

I did this photoshoot at my house using my iPhone, I followed Mr. Martin's instruction by using Portrait mode in my camera because it would not distort the image. The photographs with white background were taken in my room, with sunlight radiating from the window, while the photographs with the yellow background were taken in a fully dark room. To have different sources of light, I used ring lights. 

Figure 3.4: Photoshoot tools, 11.11.2021

And for the background, I covered my room's wall with white cloth and a yellow backdrop. It was quite challenging because I did everything alone without any help from other people in my house. The tripod and timer helped a lot in this photography process.

Figure 3.5, 3.6: Full Body Shoot (but I cropped it hehehe), 11.11.2021

Figure 3.7, 3.8: Self-Portrait with different source of lights, 11.11.2021

Figure 3.9: Photographs & Design Elements, 11.11.2021

- Digitization

The first thing I did was editing the color of the photo to match the background. I adjusted the color balance, saturation, levels, etc, I made the photographs a bit more orange and warmer, I also adjusted the highlights, shadow and brightness to match the whole color scheme.

Next, I started cropping and masking every elements. Removing the background took quite a lot of time, especially the hair & clouds.

Figure 4.0-4.4: Digitization Process, 11.11.2021 - 11.15.2021

And the posters below are the outcomes:

Figure 4.5: Digital Poster #1, 11.11.2021

Figure 4.6: Digital Poster #2, 11.15.2021

- Animating Poster #1

It took me quite a while in animating this one, because I was still trying to figure out how After Effects really works. 

Things that I animated for Poster #1:

• "Bloom From Within" tattoo (Opacity)
• Flower dress (Scale)
• Swirling lines around my body (I used Trim Path)
• Clouds (Position)
• Rain (Rainfall Effect)
• Music Vinyl (Rotation)
• Music Vinyl (Amplitude - Audio Following)
• Easy Ease for the Keyframe
• Audio

Figure 5.0: Rainfall, 11.23.2021

Figure 5.1: Audio Amplitude, 11.23.2021

Figure 5.2: 1st Attempt Animation, 11.22.2021

Figure 5.3: 2nd Attempt Animation, 11.22.2021

- Animating Poster #2

Things that I animated for Poster #2:

• Flower dress (Rotation)
• Body (Bulge)
• Blooming Flowers (Scale, Position, Rotation)
• Rainbow (Trim Path)
• Clouds (Position)
• Rain (Rainfall Effect)
• Music Vinyl (Rotation)
• Music Vinyl (Amplitude - Audio Following)
• Easy Ease for the Keyframe
• Audio

 

 

Figure 6.0-6.3: 3rd Attempt Process, 11.23.2021

Figure 6.4: 3rd Attempt Animation, 11.23.2021

- Final Outcome

Figure 7.0: Final Project Progress Documentation Slides

Figure 7.1: "Bloom From Within", Final Outcome in JPG, 11.23.2021

Figure 7.2: "Bloom From Within", Final Outcome in PDF, 11.23.2021

Figure 7.3: "Bloom From Within", Animated Final Outcome, 11.23.2021

Youtube Link: https://youtu.be/hs9z7-F231w

---

FEEDBACK

WEEK 12 :

Mr. Fauzi said to focus more on the photography.

WEEK 13 :

Mr. Martin said I have done a good job with the design, simple and neat. A very good progress from visual research, sketching to the design outcome in Photoshop. The photography and the masking is fine. And he told me that I was good to proceed to the animation process.

WEEK 14:

For the animation (1st poster), Mr. Martin said that the clouds & rain needed to be more subtle. However, when I showed the 2nd poster, Mr. Martin said that this one has a better composition. So I decided to animate the second poster and make it as my final submission. He also said that both posters' colors are good, they match each other and very consistent. Overall, he said my work was well done. 

---

REFLECTION

Experience

I experienced a little difficulties in learning the tools and finding them in Adobe After Effects, because I've never used it before and the software has so many selection so it was quite a challenge. I felt happy though because I managed to finish the first exercise in one day after watching Mr. Fauzi's tutorial video.  Adobe After Effects is a cool thing to learn. I could do the final project pretty smoothly. It felt like making my own music album cover. I like this project the most because I'm able to design anything about myself, freedom of expression is very important for me, and this really makes the project 100% more fun.

Observations

I observed that using Adobe After Effects is a complex thing to do, but once I knew where to find the tools and how to use it everything became simpler. The only way to master it is learning by doing. I also observed that watching many Youtube tutorial videos helped me a lot and gave me new tricks. 

Findings

Now that I've tried using After Effects and combined it with my own composition, I found that there are so many effects that can be used in this software. Also, I finally had the idea of how those people create motion graphics from scratch. Hopefully I could create those cool animation as well because it's a very professional skill that is helpful for almost everything in the animation world.

---

Exercises

Project 1: Collage Design

Project 2A & 2B : Exercises & Poster Design

Final Project: Cinemagraph (Self-Titled)

Final Compilation & Reflection