exploring art and design, one day at a time

Posts tagged “Berkeley

Painful New Steps

Episode I Screen Shot

The books are flying, the flag is waving, Paris is now a city! This project has been long and difficult. How will that flag wave? How will those books flying properly? And how, oh how, will I ever get the episode to play, stop, pause and scrub the way I want?? All these burning questions I tried to avoid because of un-tread water.

I am not a talented programmer or a skilled animator, these are things I am working on slowly and painfully. I’m so happy with the way the flag turned out, a pseudo stop motion animation. I drew 20 different flags to get the flag to curl in the wind, placing a new image every 5 or so frames in flash. For this file, the pace is set to 24 frames per second, so by placing them frames apart, the flag will move more slowly than if I placed them right next to each other, frame to frame. With 20 flag images, the whole animation would have gone the full cycle in less than a second.

I thought I  had to do another stop motion for the books, which I unsuccessfully tried. 15 new drawings of one book flap into the trash.  Then, I went ahead and adjusted what I already had, pushing the motion further and making the book flap all the way down instead of stopping halfway. A million times better—at least my sister isn’t laughing at it anymore.

The longest, most painful thing was the programming of the episode player. Like I said, I’m not a skilled programmer, so I was consulting a flash book and the world wide web for the right kind of mp3 player. Hours and hours later, about 10 sound flash files in the can, I got this one working. Unfortunately, the compression settings are still a bit of a problem and the sound is not as crisp as we want yet; so hopefully we’ll figure that out today so we can post this thing! Also, check out the new music notes on the home page to stop and start the music.

The Lighted Bridge Test Site

Programming “The Lighted Bridge”

The Lighted Bridge Programming

I’ve been working hard with my client to finish the Episode I page for The Lighted Bridge. The design hasn’t changed too much, just a few details. I’ve finally decided that I didn’t like the off perspective on the diamond floor, so  I created a perspective with photoshop (instead of correctly drawing it again). Instead of using text for the links at the bottom of the site, we’ve decided to go with little icons that are and will be visible throughout the site. The rollover with the text on those icons will help direct people to the right place without them having to recall exactly where those icons are in the site.

I spent a long time creating a custom skin to play the episode. I’m pretty happy with how it’s turned out and the functionality of it. Still not sure about the decorative edging above and below it, but I think I’m getting closer. Using something art deco like the rest of the pages seems to meld the best.

Now the books. My sister and I spent a long time laughing at this animation the other day. It really doesn’t work right—she says the books look like they’re breaking wrong and we started flying books in front of each other to make examples. Good times. My client also thinks the flag should be doing something because it looks unfinished (originally we thought the white “surrender” flag was great). I’m thinking that I should animate the flag as well. These two items might look awesome and much better if I did a sort of stop animation style. The style would be drawing each phase of the item and simply switching out the images per frame. We’ll see how this actually turns out.

The link to the animation so far.

Better Proportions

I’ve just completed Round 2 for The Lighted Bridge, Episode I.

The Lighted Bridge, Episode I, Round 2

I did a lot of cleaning up for the line work. Since I was away from home, I didn’t have the correct drawing utensils and couldn’t be very precise. Now the sky has thinner, more exact curves (I used a tool for the curves I haven’t used since college!). The pedestal has also be redrawn to be a bit more precise. I love the hand drawn nature of it all, but definitely feel that it needs to have a little order, otherwise it looks too childish.

I’ve also included a few things—flying books (which I’m really excited to animate), a new Paris skyline, and a little tab at the bottom to serve as a navigation area. The only thing I’m really struggling with is the player for the mp3 episode. It’s not really fitting into the space, it just kind of…sits there. I’ll be working on that while I wait for my next feedback from my client.

Slow Progress

It’s been a few days since I’ve posted, I was happily visiting my family in Texas. I haven’t seen most of them in two years and it was great to be able to have time to relax with them all this summer.

A small portion of my time was spent working on a new page for The Lighted Bridge. This is a website I’ve been developing with Kristin Cato, a theatre major who works at Berkeley Rep. The project is an episodic radio drama that will be released as podcasts, a new way to use our new technology in a clever/different approach.

We started with two pages to introduce the radio drama—a home page to give a synopsis and information about the director and a bio/informational page to introduce the cast and crew. Neither page has very obvious links, something most people enjoy and some people are annoyed with. Due to the nature of the story, we both agree that these hidden “easter eggs” (as they call them in the film industry, hint: put Big Fish in your DVD drive and arrow all around the opening page where you start the movie) are the best way to have people navigate for now.

Episode I is going to be released by the middle of July, so we are working together to create another atmosphere for this episode to be played. After talking with Kristin, I was left with some piecey ideas of how she would like it to look. “Art deco, rainbows, French flags, frame for the player, black and white photos, and the title”. Kristin also did an image search and found quite a few art deco images she was attracted to. This was what really helped me. She was very interested in architecture and the photography of the time, so I drew an image that was very heavy on art deco line-work and architecture.

Episode 1, Rough Sketch

Thankfully, with Kristin’s and my history, she doesn’t mind that my quick sketch looks like chicken scratch. She gets it.

She loved and agreed on this layout with a few changes and additions. One important idea was to take the obvious rainbows out of the sky and replace them with the colors of the French flag. I decided to leave the flag white completely because of this, which delighted Kristin because it seems like a surrender flag. The whole image is completely out of perspective on purpose, I was testing the waters with this idea, hoping that it works, so far no comment on that. I got this idea from a restaurant in Venice, called Casablanca (my favorite Mexican food in the city!). It’s a very strange place, Mexican food with a Casablanca theme. Someone was obsessed with the movie. Anyways, one wall has a scene from the movie painted on it and the whole perspective is totally out of whack but I can’t stop staring at it, I love the painting for the “mistake” (?).

Episode I, Halfway Point in Round 1

This first round still has a little ways to go, but I had a deadline to make for Kristin so she could show her work-in-progress group. So far so good, I’ll keep updating this project as it moves along.