This assignment was to take our themed text and create an interactive slider in Flash that moves with the mouse. It was really easy; the unaltered and altered text just needed to be saved for the web out of Photoshop (and sized the same); then imported into Flash and placed on separate layers in the same position. The mask is simply a rectangle twice as tall as the stage area, and a little wider. The themed text and the mask are converted to Movie Clips to allow for movement, and a little actionscript code added so that the mask tracks with the mouse movement, and voila, insta-mask!
Friday, March 11, 2011
Themed Text
This was a fun assignment: choose a word to decorate with a theme. I was going to use PAINT, but I couldn't find any good paint splatters that I wanted to use, so I went back to CAT. Each letter is placed on a separate layer; then I covered the letter with various patches of texture. I thought it would be fun to create a patchwork effect, using fur from all of our cats. (I didn't have a good tail picture, so that is from some anonymous web cat.) After a letter is covered, the texture layers are merged into one, then a mask is created of the letter and added as a Layer mask to the texture layer. This creates a nice, neat cutout of the letter, and this is where the fun really begins: I used a "fur" brush to paint on the layer mask and make nice furry letters. On the pieces that had a hard cutout edge (tail, paws, ears), I placed a new layer under the mask and painted the fur on there. I also did some blending between patches with the same fur brush. I think it's pretty funny, although I don't know how successful my "T" is, with the yawning kitty. Might have looked better to have just one head to go with the tail, but I wasn't going to do all that fur all over again!
Sunday, March 6, 2011
Javascript Gallery
I enjoyed creating the Javascript gallery. It was really easy to set up; I already had some Photoshop images optimized and ready for use, so it was simply a matter of replacing them in the code, adding Alt tags, and playing with the size and transition. It wasn't so easy to place the gallery into a website. I didn't combine it with the previous assignment, since I wanted to place it into my website for the 230 class. A bit more involved than the little bit of instruction at the end of the online lesson (thanks, Martin!) I managed to get it figured out, though, and that's probably the best way to learn things. It turned out well, professional looking, and easy to navigate (or just let it play...)
Thursday, March 3, 2011
Editing a CSS Template
This assignment would have come in handy a couple of weeks ago for the 230 class! Find a CSS template and alter/adjust text, images, and divs. Of course, I went for the pets design. I replaced the images with pics of my katz, changed some of the text, deleted one of the links at top and adjusted that div, and removed some sections. I wanted to do more with changing the size (width) of the divs, but this template has built-in box segments for the rounded corners, so I couldn't really alter that. I had enough trouble with the top left image, because it was also built into the rounded box. I ended up opening it in Photoshop, placing my image in a new layer (I already had sized him to fit), then using a vector mask with a rounded rectangle to match the size of the previous photo. The only thing that's wierd is that then it doesn't really work with the backgound on the right top (kinda...?) Interestingly, this page previewed in Safari without ANY of the formatting/styling, but it looks fine in Firefox? The thing I find helpful working with templates is seeing how they're built; helps me to understand better how to create my own.
Sunday, February 27, 2011
Photoshop Tutorial
I like working in Photoshop (and want to keep expanding my skill set), so I found this tutorial on creating a fiery sky with a comet coming in over the city. Here's the URL: http://www.photoshoplady.com/photoshop-tutorial/turning-a-systemic-city-into-fire-scenery/
I'm not completely happy with how it turned out. The overall effect is pretty good, if you don't look too closely. This tutorial was a bit vague on the explanations, just presenting the steps and settings for the various adjustment layers, and not always specifying which layer they were working with. I would have liked it to explain more WHY; that would be helpful when using different images, as I was. I especially had issues when it came to adding the fiery clouds. There are supposed to be exploding particles around some of the buildings, but even though I downloaded the brush set they were using, I couldn't seem to get the same effect. So I did learn some effects, but I feel like I didn't get the whole picture. Maybe I bit off more than I could chew, with this one!
3D Coat paint and render
This assignment uses a program called 3D Coat to paint a 3D model. Since I am not great at creating models, I used a toy plane from Lightwave Classic Content. You can choose from various brushes and textures to paint with in this program; I tried out a texture, but that didn't look right for this particular model, so I stuck with (boring) flat paint. The thing I found most challenging was getting paint on every surface; I felt like I was rotating my model round and round and round and...well, you get the picture. I find 3D work to be a bit frustrating, maybe my mind just does not work that way? The hardest part was the junction of the body to the nose cone, I had to keep going over and over it, because the yellow would get onto the red part, then the red onto the yellow. I was wishing that this object was made of layers, so that I could turn them off/on while painting, but it wasn't. Overall, I didn't enjoy this assignment very much, and I don't like the end result. Maybe if I was able to spend more time with it, experimenting with the different textures and materials, but I felt like I just had to get it done quickly.
Thursday, February 24, 2011
After Effects Morph with Radio Waves
This was interesting, if somewhat complicated to set up: creating a morph "radio waves" effect on a series of words. I typed the words in Illustrator, converted to outlines, prepped them by making sure all the letters touched, released Compound Paths to delete the interiors of any letters, then used Pathfinder>Unite to create a single object. Copied each word and pasted into After Effects composition as a mask, then created keyframes for placement on the timeline and copied keyframes to combine into a Morph layer. I did that for each word, and created a star shape/keyframe to place between the words. Then added the Radio Waves effect, and placed a Photoshop gradient background. THEN place into PremierePro to add music (plus searching for a sound loop that wasn't awful!) I'm not sure I like the final product, the words seem hard to read; maybe I should have used a different color combo, or lower case letters? Can you read it? It takes SO long to render, I didn't feel like doing it again!
Subscribe to:
Posts (Atom)





