Sunday, June 29, 2025

After Effects: Roll Credits!

Good evening, design friends!


I'm excited about tackling this week's project, which is creating the rolling credit sequence for a movie. I learned a lot during this process! I decided to work with one of my all time favorite films, Donnie Darko. To ensure I did a good job, I researched effects and looked for images that captured the emotion and feel of the movie. I even created a short storyboard to guide my direction. After that, I organized all my Donnie Darko materials in a dedicated folder. 


I edited my images in Photoshop, resizing them, and then moved them into Lightroom to create a preset. I adjusted the mid tones, highlights, and shadows using blues and greys, adding a bit of noise before applying that to my images. While I had many photos I wanted to use, I ultimately had to narrow it down to just a few that made the cut. I let the composition flow and allowed it to take on its own life, which is sometimes how it goes, and I'm okay with that.


Next, I took my Donnie Darko materials and added my first video clip to draw viewers into the footage. I used opacity and layered the next clip, applying ease in and ease out techniques while timing everything carefully. Then, I created a new composition for my credit roll by taking the cast and director information from IMDb, typing it up, and adjusting the text to center it. I chose a typeface that closely matched the Donnie Darko style. 


To animate the credits, I added a keyframe to start them from below and another at the end to bring them above the composition. I then created a solid color layer and navigated to Effect > Generate > Gradient Ramp, setting it to a linear ramp. I played around with different colors for the start and end points, ultimately finding that black and white worked best. Typically, you would set the start color to black and the end color to white, positioning the black where you want the fade to begin and the white where the text should be fully visible. If you want the opposite effect, you can reverse the colors. Next, I positioned the text layer directly above the gradient layer, went to the Track Matte dropdown, and chose Luma Matte, ensuring that the text layer was below the track matte layer.


Here’s where I ran into problems: I took this composition and placed it into my main composition so that the credits would roll over a forest background. However, I wanted the forest's lowered opacity, which made the credits barely visible. To address this, I layered and timed additional images to fade in and out as the credits rolled, and I animated a path for a cutout of Frank the Bunny, who pops in to say hello. I realize this might detract from the serious, gloomy vibe of Donnie Darko, but it adds a personal touch that I like!


Finally, I brought everything into Adobe Premiere Pro and added Echo and the Bunnymen to complete the sequence. I know there is much work I still want to correct, so I am submitting this version on time while I continue working on aligning and improving the visibility of the credits.


So, for now, this is what I have. It has been a fun learning experience, and I hope you enjoy it!




Friday, June 27, 2025

Creative Challenge 42

Good Evening Design Friends!

So I asked ChatGPT to help me come up with a good creative challenge that pushes me to think outside the box while infusing novelty with resolution, and this is what it suggested. I like it! 


Take a totally ordinary object (something you'd never give a second thought to) and redesign it to solve a completely different problem.


You start with something known → novelty.
You push for a new use → imagination.
You end with a real pitch → resolution.



Here is what I came up with !



Something known (novelty): A box fan.


New use (imagination): Strap it on your back to create a backpack jet.


Real pitch (resolution): Experience new chilling heights with the 2-in-1 box fan! Cool down when you're hot! In a hurry to get to work and the bus is running late? Strap it on your back, and away you go! (Batteries not included.)




Pixar In A Box:What I have Learned.

Good Evening, Design Friends,


I had to work more than usual this week, so I am a bit late with this entry. I wanted to share what I learned after watching some very interesting and educational videos from Pixar in a Box, found at https://www.khanacademy.org/computing/pixar.


These videos were very helpful, and I really enjoyed the interactive sections that reinforced my understanding of the material.


Here are 10 key takeaways I wanted to share.


1. When it comes to storytelling, it’s best to write what you know. As cliché as it may sound, doing so allows you to connect with the audience by adding personal experiences. This makes a story more relatable and emotionally engaging, ultimately making it more enjoyable.


2. Tell a story multiple times. It's rarely perfect the first time, and often takes several retellings before it really comes to life.


3. When creating a story; sometimes the environment or world your character lives in comes first, while at other times the character takes precedence. A story is born when the two meet.


4. The term "color" describes a collection of attributes, while hue, saturation, and value specifically explain how we perceive things. Hue refers to the actual color we see in the rainbow. Value indicates how bright something is in relation to something else. Saturation describes how intense a color appears.


5. Light is made up of different wavelengths of energy. When this energy enters our pupils and reaches our retinas, it triggers nerve impulses that are processed by our brain.


6. Wide angle shots (where the camera is closer) make subjects appear larger and create a sense of distance for more remote objects. Long lens shots (when the camera is farther away) make the space between distant objects feel less pronounced in relation to those that are closer.


7. Adding a camera lens can allow you to bend light, causing the light rays to converge, which is known as the focal point. The shape or curvature of the lens determines how sharply the light rays are bent; when the lens curvature is decreased, the focus shifts farther away.


8. Camera movement is crucial in effectively telling a story.


9. In nature, most patterns exhibit elements of irregularity and randomness, which should be considered when creating patterns to achieve an organic and realistic appearance, such as in plants or animals. Introducing controlled randomness is key to this effect.


10. Voronoi diagrams help with pattern structure, and random variation is used to make textures feel organic and realistic. Shading packs are a toolkit utilized by the art department, including reference images, color specifications, texture ideas, and notes on scale, placement, size, and shape.

Sunday, June 22, 2025

After Effects: Social media post 2

Good evening, design friends!


I'm super excited to share that I’m finally getting the hang of After Effects! For our latest project, we were tasked with creating a social media post using an effect we learned in class last week. I wanted to redeem myself, so I decided to start with a flickering fire effect and build off that.


I created an AC repair ad for Facebook, setting my composition to 1080 by 1080 pixels and 30 frames per second. Next, I took the flame I made in Photoshop and created multiple copies, adjusting each one to give it a more natural appearance. I then grouped them together to ensure they would cover the bottom of my scene.



In After Effects, I made sure the flames fit my composition and added a turbulent displacement effect. Then, I added text and animated it so that it appeared to rise from the flames.


For the snowman, I created an image in Illustrator with a transparent background and brought it into After Effects. I made a new pre-composition, added a wiggle expression to make it look like the snowman was rocking back and forth, and incorporated that into my solid layer. I then added CC particles, adjusting the X, Y, and Z axes, as well as the longevity, to create the appearance of snow falling from above and landing on the snowman. I applied a Gaussian blur to the particles and added my text, which I styled in blue with a white stroke to give it a chilly vibe. I also added a glow effect to the text to make it stand out.


I wish I could have improved the transitions, but it was getting late, and I had been working on this for hours. I admit I was so tired that I missed an opportunity to enhance the advertisement further. Despite that, I think it's quite creative and cute, and I learned a lot while having fun exploring these new effects! I'd love to hear your thoughts!






After effects: social media post.

Good afternoon, design friends!


Oh boy, this project is only 15 seconds long, but let me start by saying that I have a whole new appreciation for videos on YouTube Shorts and TikTok. I spent an entire day creating this small clip.


Through this process, I became reacquainted with Photoshop and familiarized myself much more than I was before, which I'm thankful for. I found some helpful videos on how to create textures, and I knew from the start that I wanted to make a brick wall with graffiti or painted on typeface. I decided to center the project around a comedy club because I felt like the effect I was aiming for would fit well with that theme. I was going for an urban vibe.


I created a row of bricks in Photoshop and then duplicated the rows to construct a wall of bricks. After that, I made a copy of that layer and used the levels tool to turn the bricks grey. I added a smooth inner bevel and adjusted the size and depth until I liked how it looked, and then I merged the layers.


Next, I created a new layer, added noise, and then went to the sketch filter to apply a bas relief effect, adjusting the smoothness and detail to my liking. I changed the blend mode to hard light and lowered the opacity. Then, I duplicated that layer and added a motion blur effect. After that, I selected my original brick layer, clicked on "load layer," and returned to the layer with the motion blur. I added a mask and changed the color to red.


I feel like it was quite an involved process to create a brick wall, but I am so proud of how it turned out, and I’m really happy with the final result. (You have to see it at a larger scale to appreciate the details; that's the cool part!)




Then I added some designs with a brush tool and chose a spray paint effect to convey the urban vibe. I also used the splatter brush in the area where I wanted my text.



First, I created a new composition in Photoshop and set a background. I downloaded some typefaces from dafont.com that I felt were fitting, and I chose "Retrow Mentho." I typed out my name for a comedy club, scaled it, and added effects.

I learned how to create and use displacement maps, save them, and apply them. To do this, I made a new document and created a displacement map by converting the new layer to a smart object, which allows any applied filters to remain editable. I selected Filter > Render > Fibers and adjusted the variance and strength, then modified the levels. After that, I added a Gaussian blur and adjusted the radius. I changed the Gaussian blur mode to "Darken," then applied another Gaussian blur before saving the displacement map.

Next, I returned to the original typeface composition and made a copy of it. I went to the copy, selected Filter > Distort > Displace, and applied the displacement map, rasterizing it afterward. I adjusted the horizontal view and repeatedly reapplied the displace filter until I achieved a look I liked




I started by importing my files into After Effects. I added the title as a layer, beginning its appearance a few seconds after the first layer. Then, I adjusted the opacity, applying an ease out effect while gradually increasing it. I also used rotation to make the text spiral in and adjusted the scale so that it grew overly large before returning to its original size. After that, I made the text fade out and created the next text layer.

For this new text, I used a solid black background and downloaded a stencil font. I applied fractal noise to the solid color, adjusting the animation settings to turbulent smooth while also modifying the contrast and scale. Next, I added a camera lens blur to the text, changing the blur map to the solid color I had chosen. I set the source to "effects and masks," increased the blur radius, and made the channel luminous. 

Then, I changed the text layer to dissolve and lowered the opacity. I fine tuned the camera lens blur a bit more. After that, I added a texture that I downloaded, inverted it, and lowered its opacity. Finally, I brought the entire project into Adobe Premiere Pro, added a dissolve transition, and adjusted the ease out and ease in settings. The timing isn't exactly perfect, but this is what I've created. I hope this was helpful; I learned a lot from this project!



Friday, June 20, 2025

Creative Challenge 41

Good evening, designer friends!


For this week's creative challenge, I asked ChatGPT for some ideas to spark my creativity. It suggested creating something (whether digital art, a photograph, or a costume) using only one color that represents the day I had. Since I was in a good mood, I chose yellow. 


I started making shapes and using gradients without any specific direction or idea of what would come out of it. I just dove in and this was my result. When I stepped back to look at it when I was done, I laughed out loud. You know what? I actually like it!






Monday, June 16, 2025

Learning After Effects: Adding Effects Tutorial

Good Afternoon, design friends!


I recently revisited a project tutorial that I started a year ago. It was from the first class I took in the graphic design program for After Effects. Here is the link:


https://www.adobe.com/learn/after-effects/web/add-video-special-effects?x-product=CCHome%2F1.0&x-product-location=Search%3ATutorials%3Alink%2F3.2.3&mv2=cch&locale=en&learnIn=1.


When I began this class, I had very little knowledge of Adobe applications. Now, I'm retaking the class with a much better understanding of how to use these programs and a stronger grasp of design principles. I thought it would be a great idea to revisit this tutorial.


I started by taking the moon layer and adding it to my background image. Then, I created a rectangle that completely covered the moon image layer and cut off the bottom of the moon to create a mask. I applied a classic color dodge effect, lowered the opacity, and feathered the moon to about 180. Next, I shrank the moon image down to around 50% and adjusted the levels and saturation to create a more realistic looking moon that fits seamlessly into the scene.


After that, I added the UFO footage. I began the clip a couple of seconds in, and I adjusted the tint highlights to match the foreground shadows at the beginning of the film, where the UFO was closer. I used the eyedropper tool to sample the shadows from the distance, allowing the UFO coloring to adjust as it moved farther away. I added a pale yellow tint for the lights on the UFO and animated its path by changing the direction using the pen tool.


I also added a lamp post to the foreground and used the rotation tool to adjust its position. To help it fit into the scene better, I applied a camera lens blur effect.


The final step was a bit challenging. I needed to create a new composition layer with settings of 1280 by 720 and 24 frames. I dragged my background footage into that new composition, a process known as nesting. I then shrank the background image so I could use the scale and position tools to create a handheld phone recording effect. Unfortunately, it didn't work as I had hoped, so I left that effect out for now. I plan to work on it a bit more as I continue to learn this program.






Saturday, June 14, 2025

After Effects Tutorial: Roto Brush

Good evening, design friends!

I'm excited to share my experience using the Roto Brush tool in After Effects! It's pretty straightforward once you get the hang of it. I started by importing my footage and double clicking it in the Project panel to open it in the Layer panel next to my composition.

Then, I selected the Roto Brush tool and painted over the subject I wanted to isolate ( in this case, I aimed to separate her from the background.)


To adjust the brush size, I held down the Command key and dragged in or out (or used the mouse wheel if available). After making the selection, I zoomed in to refine the edges. Holding down the Option key let me subtract areas from the selection, and letting go added more. Once it looked good, I hit Spacebar to preview and Freeze to lock in the selection.


After that, I went back to my composition panel, duplicated the Roto Brush layer with Command+D, and deleted the Roto Brush effect from the bottom copy. Then, I created a new text layer, placed it between the two video layers, and animated it to move across the screen from behind the subject.

I also changed the typeface and color of the text to match the feel of the scene.


That’s how it turned out! I’d love to hear what you all think! feedback is always welcome!


Here is the link I used for my tutorial!

https://www.adobe.com/learn/after-effects/web/rotoscope-subject?x-product=CCHome%2F1.0&x-product-location=Search%3ATutorials%3Alink%2F3.2.3&mv2=cch&locale=en&learnIn=1




Creative Challenge 40

Good afternoon, design friends!


During our class on Wednesday night, I realized that my creative challenges were lacking a key element, which is the very reason why we engage in these challenges. Being creative is not just about being artistic; it’s about problem solving and thinking outside the box while infusing relevance with novelty.


In class, we participated in a challenge where we took a pen and pushed it through a piece of paper to create a hole. Then, we were tasked with using that hole to create a face. I completed the challenge and was so amused by my creation that it made me laugh out loud!


Inspired by this, I decided to take the challenge into Adobe After Effects. I wanted to learn how to remove an object, so I used the Roto Brush tool to paint over the object I wanted to eliminate (the background seen through the opening in the mouth). It was definitely a learning experience!


I will go into detail about how to remove an object in After Effects in my next blog post, so stay tuned. It’s a work in progress, but here is what I have so far.


Wednesday, June 11, 2025

Learning After Effects! 1st tutorial:Time mapping

Good afternoon, design friends!


This week, we begin a new class: After Effects! I want to share how excited I am, even though I also feel a bit intimidated by everything After Effects has to offer. I know it can be overwhelming, but I am eager to learn as much as I can. From what I've seen, this is an incredible program, and I've been looking forward to learning it!


I chose a the time mapping tutorial https://www.adobe.com/learn/after-effects/web/the-unlock-karen-x-cheng-on-going-viral-and-optimizing-for-fun?learnIn=1


FIRST- Click on your footage layer in the timeline. Then click on the Layer and right click on Time then Enable Time Remapping.This will automatically add two keyframes. One at the start and one at the end of your clip.


THEN - Add Keyframes for Speed Changes

Move the playhead to the point where you want the fast section to end and the slow motion effect to begin. Click the diamond icon to drop a keyframe. Next, move the playhead to where the slow motion should end and the final speed up should start, then add another keyframe. You should now have a total of four keyframes:  

- One at the very start  

- One where the slow motion begins  

- One where the slow motion ends  

- One at the very end of your clip  


NEXT- Control the Speed with Keyframe Spacing

The spacing between your keyframes controls the speed of the video:  

- Keyframes that are closer together will result in faster motion.  

- Keyframes that are farther apart will result in slower motion.  

To adjust the speed, do the following:  

- Drag the first and second keyframes closer together to speed up the beginning.  

- Pull the second and third keyframes farther apart to slow down the middle section.  

- Bring the third and fourth keyframes closer together to speed up the end.  


LASTLY- Smooth Out the Transitions

  • Highlight the keyframes, especially the two middle ones. Press F9 or right click them and choose Keyframe Assistant and choose Easy Ease. This will make the speed transitions feel more natural and less abrupt.

I then decided to add a clip of bubbles, change the blend mode to "screen," and lower the opacity. I also scaled the clip and adjusted its position to effectively cover the footage. I created a couple of versions, experimenting with different effects. I hope this helps you!



Monday, June 2, 2025

Brand Me!


Good afternoon, friends!

I was working on my resume and thought that if I was going to add a link to my Blogger page, I should have something nicer than what I had going on. I asked ChatGPT for feedback, and it suggested that as a design professional, I should create a logo for my personal brand and Blogger page. I thought, "Why didn't I think of this before? This is great!"

I really like steampunk, so I asked ChatGPT to help me create something that reflects my brand identity based on my Blogger content. It suggested an image with a steampunk style, which was a good start, but I wanted to design it myself! I decided to round the corners of the image, adjust the colors, and meticulously create a vine with each leaf in Adobe Illustrator. I sampled the colors from the image and used them to create a gradient.

Next, I grouped the elements and used a ruler to ensure they were evenly placed on top and bottom. I'm really pleased with how my leaves turned out. Overall, I'm happy with the design, and now I'm working on my Blogger page to create a layout that matches it. It's a work in progress, and I'm also trying to set up a WordPress account for more control over my content. But for now, here it is!






 

Creative Challenge 43

Good evening, design friends. I recently asked ChatGPT for another exciting creative challenge, and it delivered once again. I prompted Chat...