Monday, December 7, 2009

The End


Those three and a half assignments make up what turned out to be the most learning filled class I have had in a long, long time. So, yes, I learned a lot. And it was hard, but awesome. So I'm going to keep making these things and take more classes, and I'm really looking forward to it. And man have I come a long way since this. Click and drag the corner of your window to expand and contract the window and perform amazing action!

Tracking Sasquatch


The site ended up looking almost exactly like I wanted, so that is exciting. It is a very short site, but a lot of work went into it. Flash could be frustrating at times, but once you figure something out you are pretty much good to go, and it's an easy fix. But sometimes the simple fix is so simple you have to curse. The key to the site looking "real" is the ambient animation. The falling snow (the original code made by GalaxyGoo) and subtle effects like pouring water and breath, animate the still images in the background. And everything has an effect when you click, making the interface less digital and more physical. So, here it is.

Upon completion of the animation, there was even less time to complete the flash website. Thank God for Thanksgiving break. The website was supposed to be the equivalent of 5 pages from the html site we made in class, which was supposed to be 15 pages in length. Seeing as my html likely had 100 or so pages, this meant to me that I had a lot of work to do. I wanted to do a website that was different from Hell's How-To but still fun. So I decided to make the site about bigfoot. This was going to be just a fun website with little information, and in the real world maybe a gateway into delving deeper into bigfoot study. Because he is totally real. So the emphasis was on making this a "real" situation. So on the site you kind of take the roll of a camera in the wilderness tracking bigfoot. So the picture above is one of the digital comps made in illustrator. The final site ended up looking almost exactly like the comps, so this one is the one that didn't make in.

Type Animation


After completion of the poster it was time to animate it. Animation took quite some time, and discovering the downfalls of tweening took me far too long. An interesting thing about animating though is how much of a profound effect sound has on what is visual. This being my first flash animation, it is somewhat visually un-impressive. But my choice of quote lends itself real well; and when those last few seconds hit with the uproar of music, man it's just cool. Click here!

Kill Bill Poster


The completed poster illustrates a quote from Kill Bill. My focus here was to make the somewhat monotone voice of Uma a little more visually interesting by illustrating the imagery of what she was saying. I solved the problems I had before by treating the poster as a poster that MIGHT some day be animated and to make the poster easily read from top to bottom. It was also important to tie the imagery in with the movie so I used the Impact font and yellow, black, and red color scheme.

Now Animation! Oh wait, a poster


So now we move on in class to animating in flash. No we are making a poster first. Now this poster is to act as a sort of map to the animation. So you should look at this poster and be able to animate the words in flash. This project is about animating a quote from a movie. And so that is what I started out with, making a poster with animation in mind. This didn't quite work well because, well, posters don't move. So my successes are in the imagery here. In critique we determined that maybe I should forget about animation and just make a poster, but add in some more pizazz to some specific words.

Hell's How-To


After many, many hours I finished my first "real" html site. Actually it was attempt at php too. And, to be honest, the photoshop job of making the background interface of meat took up half the time. But here it is, "Hell's How-To," a how-to site for Halloween projects. The idea behind it was to make a site just for Halloween projects and to make that site more interesting than other sites like it. I did this by making the navigation more simple while adding more pages. I also did this by appealing to an audience, the Halloweeny audience, and making my interface them about some kind of corpse meat or something. It is really supposed to be disgusting. Apparently it gave a girl in class nightmares, and her husband refused to look at it. Job well done I'd say. Oh and don't ask me how a 15 page assignment turned into something like 95.
I believe I solved the problem I had at the very beginning. I could deal with html not being able to handle a sort of "highlights" panel on the home page that would present some featured articles and act like a shortcut to those things. I couldn't make a slide show where you could click on the images and you would be taken to that page. My first attempt was a mouseover effect to enlarge thumbnails and reveal what that content would be if you clicked on that thumbnail. Then I discovered that I could get the desired effect using code that would hide and show a div on a rollover. This way, the image in the div could still have a link attached to it, and the desired picture would appear, while the one below it would disappear. So now you can click on the big image!

Now for the good stuff, or the beginning of it. Here are my digital comps, made in photoshop, which are kind of like a really nice rough draft I guess. Two big things taken from critique were the setup of the background and the size of the navigation. The background did not take into account those rich people with giant computer screens and the navigation takes up a lot of space. So the home page reflects the comps unchanged, and the content page represents the first change to the site to try and fix those problems.

Tutorial


So, in preparation for my html website, I decided to make a little tutorial that would help me. Turns out it didn't really but it was a good start. this tutorial is on button roll overs using style sheets, but really it is about a smaller picture appearing larger when the mouse scrolls over the smaller picture. It is pretty straight forward and therefore not pretty, so click here if you want to see it.

Surprise!

A big surprise. Couldn't do it. Couldn't blog and design my last website at the same time. So here we go on an epic journey I like to call "The Time Warp." Yes we are about to go back in time and review my projects and some things I learned. Enjoy