More Animation Training and UTFC

Animation Training

More animation training! This week was motion design focused which I mainly had fun with because it made me use more after effects features and puppet animati0n.

The first assignment was to fix a “broken” file which was mainly just using masking and reordering the assets. I think the biggest challenge was waiting for it to render since it’s over a minute long. It’s also a rather slow paced video, but nonetheless, I had fun figuring out how to fix it!

Broken File Link

Next up was animating a banner and animating Illustrator assets! This was actually really interesting as I used the puppet pin tool to essentially create limbs and mesh for the banner. I think one of the main things I learned is that it’s really easy to lose track of the proportions of an asset when using the puppet tool so I had to be very cautious the animation didn’t look too unnatural.

Animated Banner Link

I had a lot of fun with this one since I got to work with premade assets with an already established style. I’m used to just working with my own art so I look forward to projects like this.

UTFC

I’ve actually heard about the UTFC assignment before and that’s it’s mainly finding photos for the textbook. It’s a rather straightforward and meditative assignment. Some of the words can be really similar so working around that or figuring out the main thing that differentiates the words. However, I look forward to the feedback I can get so I can see what I can look for in the future.

Animation Training

I figured out how to make titles!

Anyway this was an exciting week as I got to practice my favorite medium, animation! I had a lot of fun with these training, but there were a few bumps.

I’ve never animated in photoshop before and I don’t think I’m used to it yet. I ran into some problems because there were steps I didn’t keep in mind completely. But all worth it cause I got to make an animated GIF!

It’s so satisfying to watch.

Next, I completed the online course graphics which was also really fun as I got to use After Effects!

That program is very intense and overwhelming but I’m surprised to say I’m getting used to it. The training was to make an animated intro for a class of our choice so I chose the RTF class, Comics and Cartoons. Here’s how it turned out.

Link

Some of the assets I had to make in procreate which wasn’t a problem at all. Some effects I used weren’t very straightforward and looking up tutorials wouldn’t get me anywhere so there was more experimenting with this project than I thought.

I’m currently working on the motion design animation training. I’ll upload those to my blog next week!

Week 29: Vue.js

What is Vue.js

Vue.js is an open source JavaScript framework. It is created to build user interfaces and single-page application.

Vue.js offers a lot of benefits that I really enjoy using.

1. Virtual DOM: Vue created a virtual document object model and allows the page to update automatically when we update the variable in the JavaScript.
2. Directives: Vue has special commands that we can integrate easily in HTML to handle the logic of the page.
3. Template: Vue makes it easy for the newcomers to learn because of the HTML template with added instructions that only Vue can offer.

Training 1: Built a simple counter

Date: Sep 22, 2023

This is the training that I built to examine the difference between Vue and Vanilla JS.

VueJS makes it super easy to add logic and directives to the page. The user can just insert special commands frm Vue and it will display the data with that logic accordingly.

Training 2: Built up the Project Management App

Date: Sep 22, 2023

Built upon the Figma application, I start to work on the first homepage of the app. I also start to lay out the foundation for the dashboard.

 

Project Hunter Gatherer

Started on: Sep 28, 2023

Staff Guidance: Chris

Description: 

The project aims to update from Vue 2 to Vue 3. I spent a lot of time cleaning up the code, setting up the environment with Vue and Laravel PhP.

Now, the project is in a good position to examine and upgrade the code from Vue 2 to Vue 3.

 

Activity: Sketch logos, draft in Photoshop or Illustrator, transform into a favicon, and mock up the design on different items. https://leilanimcabello.myportfolio.com/

This project’s purpose is to put oneself into words and distill the essence of a personality in written and visual language. It allows one to distill their personality, values, and aesthetic preferences into a simple and effective visual representation. By creating a wordmark logo of myself, I was able to establish a strong visual identity that can be used across various platforms, from social media to business cards.

Creating a wordmark logo requires a deep understanding of typography and branding.  Throughout the process, I experimented with various typefaces and layouts to find the perfect balance between readability and aesthetics. The challenge was to create a wordmark that not only looks visually appealing but also aligns with my personality and style. I went through numerous trials and errors, testing different font weights, styles, and colors, until I arrived at the final design. The process taught me the importance of paying attention to every detail, from kerning and leading font selection, to creating a cohesive and memorable logo.

To me eyes are a form of looking into the soul, you can read so much about a person by looking into their eyes. I have a fond attachment to them which is why I decided to incorporate and mimic my own brown eyes into this logo of my name Leilani Cabello. Overall, I feel confident about the outcome of this project. Through understanding the medium and researching how wordmarks work, I believe I conveyed an idea of who I am. I was able to have creative freedom, learn more about typefaces, and understand some basics of Adobe Illustrator.