Sunday, February 26, 2012

MMP & "Baby Bears"

For my MMP screencast, I have outlined the vehicle that I am going to use to enable students to upload their videos/presentations/images to the internet for their peers and myself to critique. I am using a free discussion board called invisionfree.com and it's used a lot for gaming sites. I've found a template that I think works well with the whole 7th grade Life Science theme -- it's not too dark, or too light. Please let me know if you think the font needs to be darker/bigger. Link to Mrs. Cella's Biology 101 Discussion Board. And link to: My MMP Screencast.

The cloud helps brighten it up in my opinion, and I like that the forum space does not stretch to the sides of the page ... it makes it hard to read and is very overwhelming in my opinion. In the screencast I mention condensing the forums into sub forums, the reason for this is to streamline, and to create more white space. My goal was to make the forum legible, appealing graphically, as well as spaced out. I have seen many forums that have large font that is super narrow, and design-wise that does not work. The green border around the whole forum gives it structure, and gives the eye something follow down the page.

My banner stinks ... at least I think so. I don't want something that is going to distract from the whole forum, but at the same time I feel like it needs more substance. So suggestions, please!!

One a different note ...

Below is my video for the 60 second video. The overall feeling that I wanted to convey was a touch of nostalgia, as well as a 'homey' feel. I wanted it to be heart warming, and sweet, almost like going back and watching a home video ... The name of the clip is "Baby Bears" because we call the oldest boy in the video Luca Bear, and the baby, Noah, is Double Bears (or perhaps that both of them together, I forget!). The kids in the video are my adorable nephews!!

I tried to use different techniques as outlined in the White Spaces text. I attempted to pan, specifically in the shot when looking at the baby, Noah, over his mother's shoulder. In the clip where Luca, the older boy, is being thrown in the air, I wanted to sit on the ground shoot "up". The feeling that I wanted to convey was the child flying through the air, and I emphasized this by slowing it down 0.5 times. It was hard to film exactly what I had outlined (SEE HERE FOR STORYBOARD). I was working with children, and they are obviously unpredictable. Luca wouldn't kiss his baby brother for anything, so my "final shot" was thrown out the window ... But he did perform perfectly for my opening shot where I imagined him running at the camera, and placing his face as close as possible. Obviously the music aspect of the video was important as well, and I chose a song that my grandmother used to sing, and if I had thought of this sooner, I would have recorded my mother-in-law singing the song, and added it. But I found a beautiful, acappella version of "You Are My Sunshine" by Sara Hickman, that reminded me of a mother singing to her child ... and I used my new tool, MP3 Editor (that I critiqued) to cut the track so that it only did the first verse and went right to the humming harmonies.

On a side note, the storyboard helped A LOT ... especially when you only have a select window of opportunity before the kids need to sleep ... so I knew exactly what shots I wanted. I had Ryan (the dad) throw Luca up in the air. I knew I wanted an over the shoulder shot with Lauren and the baby ... so it made everything go so quickly.

My biggest issue was lighting. And I think this is one thing I really learned. Even though you think a room is well lit, it probably is not. Luckily in my case it didn't matter so much because I wanted to convey a feeling of being at home, and being with family, so the dim lighting worked to my advantage at times. The best lighting was when Luca was being throw in the air. The room had white walls and bright, bright lights.

I made two versions of the video: REGULAR COLOR and SEPIA COLOR (to give it more of a nostalgic feel ... but I think some of the images just came out creepy due to the lack of lighting ... but my favorite sepia image is the over the shoulder shot of baby Noah).

Sunday, February 19, 2012

Blog #5: Mini-art madness!

I decided to put all my blog posts into one, with a lot of help from Windows Live Movie Maker. The first video that I have embedded is the exercise from page 193. The pictures are all taken from my trip to DC and the Inner Harbor of Maryland with my husband, and it helped me keep a "theme". I added two extra pictures because some of them only had a few focal points.

For all the pictures I showed the original, the color edits I did, and then I showed the various crops. The first picture is obviously of the White House, and I wanted to crop the image to eliminate the dead space above and below the main image. The third crop was the most interesting to me, changing the focal point completely: to the lamppost and the police officers. The second picture (WWII Memorial) offered various focal points that I chose to exploit: the people taking the picture, the tall structure in the background, and the boy walking across the front. The third and fourth pictures were some of my favorites of the set, and though the crops did not "change the picture" so to say, moving the focal point did allow me to see the picture in a different angle. The fifth picture of the Korean Memorial was originally very muted, but I saturated the background greenery in order to make the statues seem more black and white, and eerie. It was hard to make the picture look extremely different, but I liked the different focal points. The last crop of the sixth picture allows for a completely perspective of the original image, and while it is not my favorite crop, I like the movement of the water splashing off the left edge of the fountain. The last two images are from the Inner Harbor and I tried to really exploit as many corners and possibly focal points of the images.



My two choice mini-art projects were: the border variation exercise (pg.197), and the theme exercise (pg. 303).

Video for borders exercise: http://www.youtube.com/watch?v=uOCIptSZpv4

I used Power Point, my new favorite program!, in order to manipulate one of my favorite images, Salvador Dali's "The Rose". Originally I cropped the image to a 400x400px size, which eliminated a lot of the white space of the original picture, but I wanted something with a defined focal point. I decided it was easiest to present the various borders using Windows Movie Maker ... Power Point was a limiting program, but in a pinch it does allow you create very professional looking borders. You can save the slides as jpeg, gif, png, or other picture files, which is very convenient.

The hardest and the most exciting, yes exciting, mini-art project this blog was the theme exercise. I do admit I had my mother to bounce ideas off of, and it allowed for me to really come up with two drastically different designs. I worked on these the longest and the hardest, and they are definitely my favorite of all the designs that I created for this blog. I used GIMP to create these images. I copies, cropped, resized, and added text to elicit as much emotion as possible ... I used a 7x9" template, which is an average book cover size.

The first image's message: Flirtatious and dangerous. To me the most flirtatious pose is a subtle, suggestive lean, especially as a silhouette. My goal was to juxtapose flirtatious with bully through the use of various fonts. My goal was to make the design simplistic yet suggestive. I also wanted to keep the colors simple. Red would have been too suggestive, and forward, but the pink was subtle enough to be considered 'flirtatious'. And I wanted to keep the silhouette in the lettering as well, even though it's a strong focal point, I countered it slightly with the author name (one of my favorite literary characters, Louisa May Alcott's Jo March).

The second image's message: Political. It is a completely different perspective on who "the bully" is. We assume that the bully is someone picking on a more demure person, perhaps a man and a woman ... but many people in NJ have labeled the Governor as a bully, and I decided to spin this as a more political ad. In terms of design, I tried to unify it through the color in Christie's tie, as well as to balance the negative space to the left of his head with a tag line. I used the font to follow the outline of his head and balance the strong directionality of Christie's face, eyes, and arm.

Sunday, February 12, 2012

So I had a great and grand discovery: Microsoft Power Point makes awesome vectors! And I never knew those little images were called vectors! I've been using them for years in my presentations ... I created a screencast to show you how to access this tool, and I what I really like about using something as basic as Power Point, is that most people have it, as well as most schools. It's super easy to use and figure out, and it eliminates a step in terms of saving a picture and loading it into a presentation ...

A feature that some people may not know is that you can save your Power Point as various files ... it doesn't have to be saved as .ppt ... it can be saved as a GIF, JPEG, PNG or even a TIFF (if you want to kill memory). So you could create an image, save it and then edit in your still image editor ... granted this will probably not give you the most high resolution results, it's still an option.


Friday, February 10, 2012

Mini-Art 4: Feature Story Layout vs. Ad


The image above is taken from National Geographic, the February 2012 issue. It was one of the main images for a feature story on a piece of artwork that sold at auction for $21,850 and is now thought to be a $100 million dollar authentic Leonardo Da Vinci pencil sketch that has been lost for centuries. What you are looking at is the left side of the magazine, and the right page was all text.

The main focus of this article was to determine whether this long lost picture was actually designed by Leonardo Da Vinci, and one of the most telling signs of the master's work is in the mouths of the women he painted. First let's look at the space, and how there is a significant amount of negative space, with more space at the top than the bottom. However, the left and right margins are the side widths. I believe that the reason for this disproportionate spacing at the top and bottom is to create movement in the picture. The space automatically draws the eye downwards, and creates movement down the page.

The size and lines of the images on the page are important as well: the focal point of the whole page is the middle mouth (Mona Lisa's), but really the layout is comprised of a myriad of horizontal, geometric lines, and shapes, whereas the mouths are more organic. The lines outline the specific part of the painting the designer wants us to focus on: the mouth -- since this is one of the main techniques that the experts used to authenticate the picture. The rectangles that outline the mouths are large, creating a boundary, a specific spot for our eyes to focus on. Inside the larger rectangle, there are smaller rectangles with the full painting image inside, but this does not distract from the main focal point, instead creates a contrast between the light colors of the faces and the darker full image.

Going back to the focal point: the center image is the focal point, and I believe this for many reasons. First, it is the largest and takes up the entire rectangle whereas the others do not, and it is one of the most famous mouths in the world: the Mona Lisa's. The pale mouths contrast with the black background and touches upon the element of value. There is equal amounts of dark and light, but enough to create a contrasting, feel to the whole image.

It is hard to spot the pattern in the layout, but there is a subtle one as seen with repeat of the larger rectangle with the smaller rectangle in the lower right corner, and italicized font beneath the image. This repeating pattern gives the layout a sense of rhythm. Overall the image does not required added texture because the high resolution images have the natural cracks that are in the paintings, giving a natural texture to the pictures.

Another place we see distinct lines is at the bottom of the page, in the text, which is aligned to the left, but it is clear that someone had to dictate where the breaks in the text were. By creating the breaks in the text, prevented "justified rivers" as pointed out on page 42 of White Space is Not Your Enemy (Golombisky and Hagen 2010).

The layout also has perspective through its contrasting light and dark colors, as well as a unifying theme of simplicity. Simple images, only two different font types (the second being at the very bottom, the fine print), one color with only two styles: normal and italicized.



From the same magazine, on the last page I found this ad. It attracted me mainly for its obvious elements of movement and distinguished horizon line and focal point. First, there is a lot of space in this ad. The pictures gives a feeling of being outside on a warm, spring day. The lines and shapes are organic, even the font is rounded, giving what I sense is a feeling of being home, and less formal than the Rolex ad in the beginning of the magazine. The rounded font gives the ad a personal feel -- to me at least. The only pattern that I see is the color red that is consistent in the font and at the bottom, though looking at the smaller icon, it seems that the reds are two different shades. The ad also had great texture: the grass, the dog's fur, but none so much as the detail in the bees that are really up close. They have that 3D feel that the text was talking about, despite it being a picture.

At this point many of the terms start to intertwine with one another. In terms of value, there are significant color differences between the dog and the bees. The dog is lighter in color, but stands out more, making it the focal point, and the bees are a muted color so as not to clash with the star of the ad. The dog, aka the focal point, is the catalyst for all the movement in the ad: he is running left to right, which in Krause's text, he said was a feeling of quick movement (pgs. 108-109). The dog is the main movement in the picture, but at the same time the bees look like they're moving in a small, confined space, so the whole ad has very high energy, and tension of the dog moving rapidly towards the unsuspecting bees. The dog's size is also significant because it creates contrast between the foreground and the background. The bees are close, the dog is far, but moving in quickly. Even with the lighter colored dog, the image maintains its balance and your eye doesn't have to search for its focal point.

The horizon line gives the image perspective and makes the viewer feel like they have a front row seat to this ad. The horizon line is lower and we feel closer. Overall there isn't really any specific rhythm that I could spot, maybe the red in the text and at the bottom, as well as the green grass and the green leaves ... but other than that none other. And finally, the whole ad is very unified. It feels warm, has a sense of this dog possibly be YOUR dog, it's personal, and the words juxtapose the image of a playful pup having fun. Is that dog really going to go towards those bees? Hopefully not!

I apologize for the length!!

Saturday, February 4, 2012

Mini-Art 3: CD Cover Art




Okay, this was probably the hardest part of the mini-art crusade for me. I love bold colors, and lots of images, but tend to shy away from it when I make things myself, which is reflected in my art work here. As stated before, I think it's easier to sit back and critique someone else's work but when it comes to making your own ... much different story!!

I decided to go with the CD cover because it's small, and when I was in seventh grade my friends and I created a band called Dr. Seuss' Nuclear Angels. Obviously there are a whole bunch of copyright hoops we would have to jump through in order to get that name sanctioned, but for the sake of this project I borrow a few images, namely a clip art of the infamous Cat in the Hat's hat. I edited the logo, added a halo, and a few props as well as wings. I wanted it to be the main focus of the cover with a simple background ... somewhat reminiscent of the Cat in the Hat book cover (it's blue). Usually warm red on cool blue = no, no, but the light blue lets the image pop.

The font I chose is one that I downloaded called Sketchy, which I have always found to be a throwback to childhood, and that's what this art is all about: childhood, silliness, fun, and a shout-out to when my friends and I created this band in middle school!! I did five mock-ups, my favorites being the first and last designs. The whole time my goal was to make sure that there was one focal point and that the font did not war with it too much. As much as I love image #3, I think the logo and the font are fighting with each other too much. In image #2, I realize there are conflicting lines/angles with the vertical guitar and the slanted microphone, so I made the microphone parallel to the halo so that there some consistency (still not sure if it's too much juxtaposition).

Image #1 and #5 are my favorite because of their simplicity. All of these are simplistic, but the way the logo pops in image #5 looks better than the others -- not as busy. Image #1 is like what I did below (I'm a serial designer), and I decided to add an album title to emphasize the design technique of highlighting a central image.

Friday, February 3, 2012

Mini-Art 2: Revisions of an old image

Before:

After:

I decided to redo the image that was on my very first blog post when I was enrolled in Digital Tools. It is certainly not my best work, and it was done rather hastily. But there are still some glaring errors, such as:
  • bad bullet points (sin #11 from Golombisky & Hagen)
  • busy background (sin #9)
  • and DEFINITELY tacky type (sin #10)

One of the hardest things for me to do is to rework something that I know needs reworking. The problem is that I am blinded by what is already done, so I find myself attempting to tweak just minor things, when really a whole entire re-work is necessary. That is what I did with this image: I started from scratch and went through Krause's Design Basics, and Golombisky & Hagen's White Space is Not Your Enemy texts ... attempting to first identify the problems ... then fix them.

My final product is better. I don't think it's perfect, but while I think I am good at spotting a good ad/bad ad, I find it difficult to apply the concepts to my own work. So I will say that this image is much better than what I had originally done. Suggestions are more than welcome!

I got rid of my beloved double helix. It was originally filled in with a white background, and I meticulously made all the white in the image transparent, and cut it out so that the double helx was only color. It took a while, and I fixated on this image that I forced it into the final product. The font is tacky. It is called Bookman Old Style ... in hindsight it looks like a hybrid of Christie meets Times New Roman. Though I was consistent with the font, it was not appropriate or legible with the background that I had chosen. The bullets were also hideous, with a lack of hanging indents ... something that GIMP (the program I used to create it), does not let you do.

In my re-work, I went with the simple background. I was indeed inspired by the simple background of my critiqued ad, and I used the images in Krause's "haromny" chapter as my main guidance. The little science icon at the top of the page is from a larger image (click on my profile icon), and it was going to serve as the main focus of the image. It didn't work; the font on the icon clashed with the type that I included "Science Nerds, Unite!" as well as the bullet points. So I cut it down, and left myself with just the icon, and repeated like the example with the sunflowers at the top of the flyer (Krause, 2004, p.53). And if you look carefully, the top of the repeat icons (where the bubbles start) is the same spacing as the text at the bottom to create symmetry.

Overall, I am much happier with the second image than the first!

Mini-Art 1: 10 rules

For the first mini-art project, I used Jim Krause's Design Basics Index (2004), Golomsisky & Haven's White Space is Not Your Enemy (2010) and 10 Web Design Rules That You Can Break website to help with my critique.

The ad I chose is one in a series by Valspar paint. I consider this a GOOD ad based on the following 10 rules:

Rule 1

Golombisky & Hagen (2010) wrote, "Don't be stingy with your margins". Earlier in the text he wrote that white space is not always white, it can be black (so think of it as "negative space"). The ad is a good example of maintaining proper space, and letting the ad breathe. There is no lack of "white space" in this ad, and even though the ad goes to the bottom of the page, the even spacing on both sides of the text and image draw your eye to it naturally.

Rule 2

Going with the idea of drawing the eye naturally, Krause brings up the idea of dynamic spacing. There should be movement to create energy, and to convey the message. Even though the length of the rose is about half the length of the page, and it has one centered stream of paint going down the middle, the other two drips give it directionality. The fact that the whole paint bucket isn't shown gives this ad dynamic spacing, a feeling of going down, into the bucket.

Rule 3

In White Space, sin #6 is centering everything. EVERYTHING. This ad is mostly centered, but the text is to the left and to the right, while creating balanced asymmetry. It doesn't look like it at first, but both sets of text are equidistant from the edge of the paper. The ad in the upper right corner also helps off-center the whole thing.

Rule 4

Sin #7 is to crowd the corners, and fill every space. This ad obviously does not, and the placement of the Lowe's logo is crucial. It is there for a reason, why the logo or tags, as White Space calls them.

Rule 5

I want to focus on the Lowes ad twice. First, in Krause's book, he writes about grouping, "visual thematic associations" (2004, p.44-45), and making sure everything is grouped accordingly, nothing is singled out, or so close to an obejct that it is incorrectly associated. The ad is about Valspar paint, NOT Lowes ... but it's sold at that store. So in order to dissociate the product from its selling locaiton, the store's logo is separate, and distinct. It is clear that Lowes is not the maker of the paint.

Rule 6

Second, we need take into consideration the flow of the ad. Krause wrote that left to right is how most of us read and this translates into speed, going fast. But going from right to left conveys a sense of slowness ... this ad clearly means for the eye to linger on the slowly dripping paint. The long drip lines signify that the color is thick paint, and the paint is as vivid as a real life rose.

Rule 7

10 Web Design Rules stated their rule #3 is to not use too many colors. The plain black background allows for the vibrant colors of the rose to really pop, which is further accentuated by a muted-color bucket. Even though the Lowes logo is bright, it's a place for the eye to start to descend. Definitely not too many colors in this ad.

Rule 8

White Space said that sin #9 is a busy background, and this ad cannot be any simpler. A solid color to just accentuate the main image, the rose dripping into the bucket.

Rule 9

Sin #10 is tacky type -- something I have definitely been guilty of! The font face is a simple sans serif font, it looks like Arial, with a rounded edge. The slogan is emphasized only with all caps, nothing else, and the informtion about the paint is small enough so as not to take away from the main message, but still is legible.

Rule 10

Finally, Krause points out the visual hierarchy. There should not be a war between the text and the imge. One should clearly dominate over the other and be the focal point. This ad does not have that issue, the font is there to subtly convey a textual message, the image speaks for itself.