When we first started discussing this project, the ideas were plentiful, but random. I had to figure out which would be best to build an entire site with. An overall theme. George mentioned liking a carnival or circus tent. So I decided the theme would be a circus. Inside the tent, each section of the site would be in this enormous tent! Awesome!
How?
Early on, he said that voice people never have cool sites, and he wants his to stand out. I took a look around, and saw that most of the examples he gave me looked straight out of 1997. I could definitely do better than that. We decided we want this site to be an experience. Easy access to the info people need, but they could stick around and have fun if they wanted to.
Back to the tent. I want everything inside this one tent. I want it to feel like you are taking a look around this tent to see the different pages. This couldn't be done with regular "click link, go to page" programming. The whole site, all of the pages, would have to be built on a single page. Only the section you want to see would be visible. When you click a link, instead of a new page loading, ruining the experience of being in this tent, the page would simply slide left or right to your desired content. To achieve this, I built the site in html5 and jquery. Sliding pages are easy enough to accomplish with jquery, but I needed to take it a step further to help create the illusion of the tent. The background looks like the inside of the tent, and it is wide. Wide enough to scroll sideways with the content. This will allow me to have different things going on in the background depending on where you are in the site.
I wasn't happy with the background simply sliding with the content, so I decided to give the site more depth. I built layers, and each layer slides at a different speed. This creates a great parallax effect. You may not be familiar with that word, but I'm sure you've experienced the effect before. The easiest example I can think of would be a super nintendo game. You are Mario, running through the stage, and the background is moving a bit slower than you are, and in some cases there was another layer behind that and it would move even slower. I have a 3 layer system set up for the site. Well, 4 layers if you count the stationary layer for UI elements.
Layer 1: logo and navigation. This layer never moves, everything behind it does
Layer 2: top of the page, behind the logo, like the top of the tent. I made this a layer so I could have things in the rafters on the different "slides". I'll get back to that later.
Layer 3: content
Layer 4: the background, interior wall of the tent
And for a little more visual stimulation, there are little fireflies floating around behind the content layer.
I'll get more into the actual content "slides" another day. I'm not quite ready to share the link yet, but soon enough!
Things of interest only to me
I fully expect no one to get anything from this blog. It is mainly for me to keep a running log of my methods and ideas and things.
Friday, July 22, 2011
George Lowe's site: Breaking down the project
Thursday, July 21, 2011
Spaaaaaace Ghoooooost!
I've been a fan of Space Ghost since 1994. I know this because that is
when I got "The Mask" on VHS. It included a special episode of Space Ghost: Coast to Coast where he interviews Jim Carrey, and Cameron Diaz. I was 10 at the time, and I was absolutely fascinated. A cartoon talking to people?!?
A couple years later, I write a fan letter. They were kind enough to put their address at the end of each episode for just such things. It was 6 pages of 13 year old chicken scratch. I propose the idea of SG toys and request to be put on "The Space Ghost Crew", which was another brain child of mine. I wasn't sure what this crew would do, but I wanted in. I closed my manifesto requesting a signed picture. In my mind, this was a drawing of space ghost signed by the cartoonist that made it. What I got was an autographed, black and white, glossy 8x10 of Zorak and Moltar. No Space Ghost. This was the opposite of what I wanted, but I treasured it nonetheless.
My sense of humor never matured, so I continued watching the show long after my friends either grew tired of it, or completely turned on it. Was I the only one that "got it"? I remember one night they ran a marathon, so I taped the whole thing and watched it daily. That tape is in poor shape nowadays.
I realized early on that a big reason I loved the show so much was the voiceof SG himself, George Lowe. I was really excited for the Brak Show, even though I didn't care for Brak, because George was voicing Brak's dad. I enjoyed his character so much, that I created a website dedicated to the character. Not the show, just dad. It was a silly little site with a forum and wallpaper. But I liked it. One day I was looking at my stats tracker, and noticed a bunch of hits coming from atl90.turner.com. A little investigation lead me to realize this was Williams St. headquarters in Atlanta! They somehow found my weird little corner of the web, and were passing it around the office. Wow.
A few days later, I get an email from Pete Smith, a producer on the Brak show. He said he really liked the site, and he wanted to send me some stuff, like concept art, and animation cels, and a script for an unmade episode. I was skeptical, but sure enough, about a week later, I had a giant envelope of stuff from adult swim! I emailed Pete to thank him, and he told me that he passed the link on to George Lowe because he would certainly get a kick out of it. That night, contact was made. I got an email from George Lowe himself.
"What a shrine!!!
-G"
Short and to the point, but the most amazing moment of my life. This was in 2004, 10 years after I had started watching Space Ghost. I now had a email from the man himself. We got to talking, and he offered to do an interview for the Dad Shrine. I gathered questions for him from my forum members, and a week later, I was on the phone with Space Ghost. After that, we still kept in touch. He would even call randomly to shoot the breeze. It wasn't often, but to hear "Jeffy!" in that SG voice was always really cool. He even expressed interest in me doing a site for him. And that leads me to the reason for this post. 7 years after he expressed interest in me working on his site, it's happening. I plan to document the methods I use and just brainstorm on this blog.
Thanks for reading!
- Posted using BlogPress from my iPad
Labels:
adult swim,
cartoon network,
projects,
space ghost,
websites
In the beginning...
Welcome aboard! I've never had a blog before, but I figured it would be good to be familiar with the whole thing.
So for a little about me. I'm a web designer and developer by trade. I enjoy technology much more than should be considered healthy, yet my taste in video games rarely goes beyond the NES. I can't stand Mac computers, yet I love my iPhone and iPad. And I am a digital pack rat. I have terabytes of backed up tv shows and movies that I'll probably never watch more than once, but I have them, and they're here to stay.
I really don't think anyone will get any use out of this blog other than me, but if you're bored, feel free to give it a read. It will most likely cover my web projects. A place for me to document techniques for future reference. I'll also talk about gadgets and apps I enjoy. And probably tv shows or movies I watch with my girlfriend, Christine.
So for a little about me. I'm a web designer and developer by trade. I enjoy technology much more than should be considered healthy, yet my taste in video games rarely goes beyond the NES. I can't stand Mac computers, yet I love my iPhone and iPad. And I am a digital pack rat. I have terabytes of backed up tv shows and movies that I'll probably never watch more than once, but I have them, and they're here to stay.
I really don't think anyone will get any use out of this blog other than me, but if you're bored, feel free to give it a read. It will most likely cover my web projects. A place for me to document techniques for future reference. I'll also talk about gadgets and apps I enjoy. And probably tv shows or movies I watch with my girlfriend, Christine.
Subscribe to:
Posts (Atom)