My initial idea for this animation was to have it set in space, with a shoot star bouncing around an asteroid belt, with stars twinkling in the background. However, after attempting to make a movie clip of a star twinkling, I chose to alter my idea. Not only was I having difficulty with the star, but I also felt that having a shooting star following a guide for 15 seconds would be rather boring.
The idea that I executed is a city going to sleep, and the night sky coming up. It is approximately a fifteen second animation, starting with a bright blue sky and a fully lit city. There are three different layers of buildings, with only the formost ones having windows. Each of these windows is an individually drawn square, laid out so they are all aligned properly. As the buildings slowly "go to sleep," or have all of their windows shut off, there are "z's" that float up the page, conveying the idea that the buildings are indeed sleeping. These "z's" are movie clips, rocking back and forth as they rise. I increased their alpha, making them transparent, as they are not meant to be the focus, just to communicate an idea.
As the sky darkens, a moon follows a guide across the sky, rotating slowly as it does so. I made this moon by making one dark grey circle, and then placing smaller circles on top of it. I deleted the smaller circles to leave holes in it, and then placed this entire graphic on top of a lighter grey circle. This makes it look like the holes are craters, and is just more interesting than a circle crossing the sky. As the moon reaches it's peak, the brightness increases slightly, to contrast it with the dark sky. While this is happening, small stars are coming up in the background, which then are deleted as the sky gets lighter again. There are not very many stars because it is over a city, which means light pollution would make them difficult to see.
I ideally wanted to include light pollution in this animation, but could not figure out how to do so realistically. The closest idea I had was a transparent yellow oval over the city, but this looked more like a ufo than anything else, so that layer was quickly deleted.
When I initially had the sky darkening, there was an obvious change every time the blue changed, as I did not know how to tween this. A classic tween did not work, but my roommate showed me that a shape tween would, so now the sky darkens evenly. It still has a multitude of key frames, but that is because there were particular instances when I wanted the sky a certain shade, and keeping these frames allowed me more control than I had.
The biggest problem that I came up against were the windows. When I originally made them, they were just pale yellow squares, which I thought worked. As I watched the animation, however, I realized that they looked too flat. I made a linear gradient, going from a darker yellow on the left to a lighter yellow on the right. This way it looked like there was a glare on the glass of the window, creating a more visually appealing aesthetic. It was easy to change the windows on the first frame, as I just selected them all and clicked "linear gradient" and it was done. However, as I made the windows go dark initially, I just painted them black instead of deleting them. Since they were technically still there, trying to select all of the windows to change them meant that every window became lit. What I ended up having to do was selecting each window individually to change it. While using the shift key to keep multiple things selected normally did work, sometimes it would glitch and unselect everything I had already clicked, which just provided more work for me. I think it was worth it though, as I definitely like my animation a lot more now than I did when I first made it.
If I had more time, I would probably try to figure out something else to add in the sky before it turns to night time, as it does take a little while for the windows to go out and the sky to get dark. However, I would rather than enough time to work on my website, so I'm leaving it the way it is for now.
EDIT:
I added music to my animation. Now an instrumental lullaby I found on sounddog.com is playing while my animation progresses. I think it helps to convey the idea that my city is going to sleep, and just provides a nice ambiance. Since we didn't really cover sound in class, I had my roommate teach me how to add it!
Digital Media
Monday, December 10, 2012
Website Pt. 1
I never thought that this website would take me as long as it did. My final (for now) product currently consists of thirty pages, each of which has multiple links on it.
I started this website by making the table for my index.html page, as I knew this would determine the layout for the rest of my site. Once I had the first two rows done, I moved to Illustrator and made my graphics, which also serve as buttons. When on any page but index.html, my header takes you back home. For my primary categories, I chose "digital," "studio," "photography," and "contact."
Digital contains subcategories, which are "cyberspace architecture," "self portrait i/ii," and "advertisement i/ii." Cyberspace architecture is empty because my flash drive corrupted the day that project was due, and it got deleted off of my classmate's external hard drive before I could retrieve a copy of it. The other categories contain my assignments.
Studio is currently empty, as I do not have high enough quality images of my studio work from this year. Photography is it's own category for two reasons; first of all, I had a lot of photographs to include, and secondly, I'm a photography minor, so I felt it made sense for it to stand alone. Photography was split into two categories - nude and other - because nude photography is not necessarily always appropriate to view, so I wanted it separate. Other contains everything else.
I chose not to include an image on my contact page, simply because I did not have one that I wanted to use. This page does have a short biography, as well as a link to my flickr, which contains old work. At the top of the page is my email address, but I wrote out the punctuation to avoid getting spam, as that is an email I use regularly.
One problem that I ran into immediately after making my site live came from capitalization. There were two photographs that I had capitalized on their pages, but I typed the links in lower case. This was easily rectified by renaming the pages to make the lowercase links, once I figured out what the problem was. My only other big problem came from my inability to do math. There were several times when I had to divide 500 (the height of my main cell) by 6 or 14 or some other strange number, which never came out to be a pretty number, but I somehow managed to make that work too.
In terms of my color palette and layout, I went simple and symmetrical, just like I did with my work during the rest of the semester. I have a tendency of always using blue in my projects, so I embraced this and made my buttons blue. I kept the background white so it looks clean, and used black text to make it easily readable. My only complaint is that I don't know how to make the entire website center itself in a browser, which I would like.
If I tried to make a website again, I feel like I would have a much easier time of it, having had the experience of making this one. By the time it came to coding my "other" photography pages, I had figured out that it was much faster to copy and paste code and then change small things, rather than retyping the same things over and over again, which made the end of this process much faster.
I started this website by making the table for my index.html page, as I knew this would determine the layout for the rest of my site. Once I had the first two rows done, I moved to Illustrator and made my graphics, which also serve as buttons. When on any page but index.html, my header takes you back home. For my primary categories, I chose "digital," "studio," "photography," and "contact."
Digital contains subcategories, which are "cyberspace architecture," "self portrait i/ii," and "advertisement i/ii." Cyberspace architecture is empty because my flash drive corrupted the day that project was due, and it got deleted off of my classmate's external hard drive before I could retrieve a copy of it. The other categories contain my assignments.
Studio is currently empty, as I do not have high enough quality images of my studio work from this year. Photography is it's own category for two reasons; first of all, I had a lot of photographs to include, and secondly, I'm a photography minor, so I felt it made sense for it to stand alone. Photography was split into two categories - nude and other - because nude photography is not necessarily always appropriate to view, so I wanted it separate. Other contains everything else.
I chose not to include an image on my contact page, simply because I did not have one that I wanted to use. This page does have a short biography, as well as a link to my flickr, which contains old work. At the top of the page is my email address, but I wrote out the punctuation to avoid getting spam, as that is an email I use regularly.
One problem that I ran into immediately after making my site live came from capitalization. There were two photographs that I had capitalized on their pages, but I typed the links in lower case. This was easily rectified by renaming the pages to make the lowercase links, once I figured out what the problem was. My only other big problem came from my inability to do math. There were several times when I had to divide 500 (the height of my main cell) by 6 or 14 or some other strange number, which never came out to be a pretty number, but I somehow managed to make that work too.
In terms of my color palette and layout, I went simple and symmetrical, just like I did with my work during the rest of the semester. I have a tendency of always using blue in my projects, so I embraced this and made my buttons blue. I kept the background white so it looks clean, and used black text to make it easily readable. My only complaint is that I don't know how to make the entire website center itself in a browser, which I would like.
If I tried to make a website again, I feel like I would have a much easier time of it, having had the experience of making this one. By the time it came to coding my "other" photography pages, I had figured out that it was much faster to copy and paste code and then change small things, rather than retyping the same things over and over again, which made the end of this process much faster.
Layout and Design Pt. 2
One thing that was noted at this critique was that my advertisements are both very simple, graphic, and to the point. There is no extraneous, distracting detail, but that was my intention, so I took this to be a compliment. It was also noted that a fan brush is not typically used for house painting, so it was a little confusing at first. I had taken this into consideration when developing my advertisements, and chose to continue with the brush because I liked the shape of it, but I can understand this complaint. If I had access to a roller to scan, I probably would have used that so it made more sense, but I did not.
In my second advertisement, I included punctuation after the name of the company, something that I had omitted in my first advertisement. This made it sound like a command or a directive rather than a name, which I found humor in. There is nothing about that directive that could cause someone offense, but it does make you stop and think, which is not a bad thing when it comes to an advertisement. The more time someone spends thinking about the advertisement, the more likely they are to remember it later on.
Some of the ads that my classmates made were clearly directed towards different audiences. Alanna's advertisements were for a clutch, but the two advertisements would have appealed toward very different people. One was more elegant, appealing to an older, more mature audience. The other one was on a black background, with black and white text and images. It was bold and eye catching, which I and my classmates could have seen in a magazine such as Seventeen, aimed towards preteenagers and teenagers.
I treated my advertisement as a universal advertisement, partially because of the nature of the company I chose to convey. However, had I had a specific audience in mind for each ad, I probably would have changed the way I did them. Additionally, were I to do these advertisements again, I probably would have found some way to include a website URL or some type of contact information.
In my second advertisement, I included punctuation after the name of the company, something that I had omitted in my first advertisement. This made it sound like a command or a directive rather than a name, which I found humor in. There is nothing about that directive that could cause someone offense, but it does make you stop and think, which is not a bad thing when it comes to an advertisement. The more time someone spends thinking about the advertisement, the more likely they are to remember it later on.
Some of the ads that my classmates made were clearly directed towards different audiences. Alanna's advertisements were for a clutch, but the two advertisements would have appealed toward very different people. One was more elegant, appealing to an older, more mature audience. The other one was on a black background, with black and white text and images. It was bold and eye catching, which I and my classmates could have seen in a magazine such as Seventeen, aimed towards preteenagers and teenagers.
I treated my advertisement as a universal advertisement, partially because of the nature of the company I chose to convey. However, had I had a specific audience in mind for each ad, I probably would have changed the way I did them. Additionally, were I to do these advertisements again, I probably would have found some way to include a website URL or some type of contact information.
Layout and Design Pt. 1
For this project, I made two advertisements for a company called "redo", which is a house painting company. I used an old fan brush for my scanned object, which is not used for house painting, but had an interesting shape and dynamic negative space. We used bit map tracing to make the images more graphic, and could change the colors as much as the wanted. We just needed to use text, our image, and texture in the ad.
My first ad features the fan brush central on the bottom half of the page, with the fan in the middle of the page. It is tones of yellow and blue, so I chose to continue with the variations of primary colors. My company name went above the fan brush, filling the top of the page. It says REDO in all capital letters, in a font called "birth of a hero." This font had been previously downloaded onto the computer I was working at, but was very beneficial for me. It is a sans serif font that looks as though it has been subjected to splatter painting. As my company has to do with painting, it fits nicely. I then used a stock sans serif font, also in all capitals, to do my tag line at the bottom of the advertisement. My tag line is "Redesigning your house? We do the dirty work." As it is two phrases, it was easiest to put one on each side of the paint brush handle, making it symmetrical. REDO is in black, to match the handle of the brush and to draw attention. The tag line is in a muted red, to continue the primary colors and add variation.
Finally, we were required to include a texture. In order to make the texture, I rescanned my fan brush, but instead of laying it flat I propped the scanner open and brushed the tip of the brush into it. This emphasized the fan effect, which I then bit map traced. Taking the resulting image, I put it into photoshop and reduced the transparency, layering it over itself repeatedly. I finally made the background a faded shade of the same red I used for the tag line, and placed it in InDesign as the background.
My second ad is also for REDO, but has two copies of the fan brush, which make an "X" in the middle of the page. The company name is centered at the bottom of the advertisement, this time in a serif font with a period following it. I used the color picker tool to select a grey out of the paint brush image, which I then used for all of the text in this advertisement. The tag line remained the same as the first advertisement, but each phrase is on a path mimicking the top of the paintbrushes. The background is white and there is no texture included, as I could not find a way to include it without detracting from the advertisement.
Self Portrait Pt. 2
It seemed like almost everybody in our class chose to use circles for their self portraits. To be entirely honest though, I can't blame them. Any shapes with straight edges need to line up with each other perfectly, whereas the circles can be spaced however the artist wants and still look good.
Something that really stood out to me was when Angthony said that he didn't have awesome hair to portray, so he had to do his hat to fill space. While I was really impressed by the level of detail he put into the logo on his hat, this made me think. If I had not been able to use my hair to portray myself, I'm not really sure what I would have done. I'm not good at drawing faces, so I think I would have struggled a lot more.
The question of whether or not including something like a hat counted as self portraiture was brought up. My feeling on that matter is that if it is something recognizable about you, something that you wear or have with you every day, then it should count, because it is part of your personality. There is more to me than my hair, obviously, but part of the reason I felt so comfortable emphasizing it so heavily in my portraits is because I feel it also serves as a good descriptor of my personality.
I'm happy with the way my portraits turned out, and would not change them, but I did get some interesting ideas from this critique. Michelle used hexagons in one of her portraits, and to do her hair with these hexagons, she did it by clump instead of by strand, with each clump being a different shade of blue. I think the strand method worked for my hair because it is so curly and wild, but Michelle took an approach that I barely even considered, which made for an interesting consideration.
Something that really stood out to me was when Angthony said that he didn't have awesome hair to portray, so he had to do his hat to fill space. While I was really impressed by the level of detail he put into the logo on his hat, this made me think. If I had not been able to use my hair to portray myself, I'm not really sure what I would have done. I'm not good at drawing faces, so I think I would have struggled a lot more.
The question of whether or not including something like a hat counted as self portraiture was brought up. My feeling on that matter is that if it is something recognizable about you, something that you wear or have with you every day, then it should count, because it is part of your personality. There is more to me than my hair, obviously, but part of the reason I felt so comfortable emphasizing it so heavily in my portraits is because I feel it also serves as a good descriptor of my personality.
I'm happy with the way my portraits turned out, and would not change them, but I did get some interesting ideas from this critique. Michelle used hexagons in one of her portraits, and to do her hair with these hexagons, she did it by clump instead of by strand, with each clump being a different shade of blue. I think the strand method worked for my hair because it is so curly and wild, but Michelle took an approach that I barely even considered, which made for an interesting consideration.
Self Portrait Pt. 1
For the self portrait project, we had to create two digital self portraits using Illustrator. The first portrait was more restricted, requiring one shape used in five different sizes and five different variations on shade and tint. Additionally, none of the shapes could overlap. The second portrait's only requirement was that it used a shape, so that was a lot more flexible. I chose to use a reference picture for both portraits, so they would actually look like me.
I chose to use a circle as my shape for the first project, and used a purple as my base color. I then picked four other shades/tints out of the color wheel, and created a palette to work off of. My hair was the predominant feature in the picture I chose, filling most of the frame and covering half of my face. As such, that is what I started with. I started at the front of my head, beginning with my hairline and the pieces of hair in front of my face. I made the beginning of each strand with larger circles, gradually shrinking the size of the circles as the strands continued. While this is not what hair actually looks like, it helped to define each strand and to create an illusion of volume on top of my head. When it came to the hair coming from the back of my neck over my shoulders, starting the strands thicker helped to define my neck. My hair used three different shades of purple, with the fly-aways being the lightest and the clumps of strands being the darkest.
I then moved on to my face, where I started with my eyes. Only one was really visible in the image, but I put part of my other eye in to my self portrait so it looked more human-like. My eyes are dark brown, so the darkest purple was used there, with light purple being used to define my eyelids. My nose was left mostly undefined, as was my mouth. My eyebrows, I underlined but did not make particularly thick, as I felt they would detract from the chaos of my hair. My chin and neck are very faintly defined, but I left my clothing out of the image, as I felt it was an unnecessary addition to the image.
For my second image, I chose to stick with the circles. I liked the way they looked when they weren't overlapping in the first portrait, so I stuck with that decision as well. However, I felt my first image looked delicate, so I chose to do something more bold and graphic for this one.
I started this image with black circles on a white background, again doing my hair first. I kept the strands going from thick to thin, but made all of the circles bigger and did fewer strands. In terms of my face, I chose to only do my eyebrows, but I filled them out using circles going from large to small, rather than underlining or outlining them. They are easily identifiable as eyebrows, therefore implying where the rest of my face would be without displaying it. Once I finished this portrait, I (on a whim), decided to see what it would look like inverted - with white circles on a black background. As white on black, it seemed to pop off of the screen, holding my attention for longer. I felt this was a significant improvement, so I kept it.
I chose to use a circle as my shape for the first project, and used a purple as my base color. I then picked four other shades/tints out of the color wheel, and created a palette to work off of. My hair was the predominant feature in the picture I chose, filling most of the frame and covering half of my face. As such, that is what I started with. I started at the front of my head, beginning with my hairline and the pieces of hair in front of my face. I made the beginning of each strand with larger circles, gradually shrinking the size of the circles as the strands continued. While this is not what hair actually looks like, it helped to define each strand and to create an illusion of volume on top of my head. When it came to the hair coming from the back of my neck over my shoulders, starting the strands thicker helped to define my neck. My hair used three different shades of purple, with the fly-aways being the lightest and the clumps of strands being the darkest.
I then moved on to my face, where I started with my eyes. Only one was really visible in the image, but I put part of my other eye in to my self portrait so it looked more human-like. My eyes are dark brown, so the darkest purple was used there, with light purple being used to define my eyelids. My nose was left mostly undefined, as was my mouth. My eyebrows, I underlined but did not make particularly thick, as I felt they would detract from the chaos of my hair. My chin and neck are very faintly defined, but I left my clothing out of the image, as I felt it was an unnecessary addition to the image.
For my second image, I chose to stick with the circles. I liked the way they looked when they weren't overlapping in the first portrait, so I stuck with that decision as well. However, I felt my first image looked delicate, so I chose to do something more bold and graphic for this one.
I started this image with black circles on a white background, again doing my hair first. I kept the strands going from thick to thin, but made all of the circles bigger and did fewer strands. In terms of my face, I chose to only do my eyebrows, but I filled them out using circles going from large to small, rather than underlining or outlining them. They are easily identifiable as eyebrows, therefore implying where the rest of my face would be without displaying it. Once I finished this portrait, I (on a whim), decided to see what it would look like inverted - with white circles on a black background. As white on black, it seemed to pop off of the screen, holding my attention for longer. I felt this was a significant improvement, so I kept it.
Gallery Pt. 2
At the critique, we displayed all of our web galleries on the tv at the front of the room and individually discussed our processes. Changing the color of the images was the predominant manipulation, but nearly everybody had different colors, which made for a nice variety.
One of the different manipulations that I liked was Hallie's. She started off of her own image, cropping it so just her necklace was being used. She then processed it further, also using the "posterize" tool that I used. When she applied the action as a batch process, it cropped each image to the same dimensions and location of her necklace crop. This had a cool effect, as it abstracted almost every image. Only a few images were identifiable was what they originally were, such as mine, as my nose stud was in the frame. While I'm happy not having cropped my images, this made me think that doing something like rotating them all might have been a good decision, as it would have shifted focus from each image as a portrait to the gallery as a whole.
As I was presenting my gallery, I realized that my particular manipulation made everybody look cold or sickly, as there was such a cool blue tone to every image. The purpose of this assignment was not to make everybody look good, though, so that was not really a problem, just an observation.
I can definitely see the advantages of knowing how to create an action and apply it as a batch process, especially when considering photography. If all images from a shoot come out too cool or there is too much background in the frame, it would be much easier to change them all at once than to go through each image individually. While this project was fun to do, I feel like I learned a useful trick out of it.
Subscribe to:
Posts (Atom)