Design Lessons from Generation Web

Eric J. Adams

1

Teenagers are a fickle bunch. They have the option — and heaven knows they use it — of browsing dozens, if not hundreds, of Web sites dedicated to teen stuff. That’s why teen site developers are always striving to create sites that reflect the look and feel of the teen movement de jour, and hence find themselves on the cutting edge of site design.

Among the most successful of all teen sites is Goosehead.com, which was started a few years back by a Southern California 15-year-old with the very Hollywood-sounding name of Ashley Power. Today Goosehead.com is a bona fide franchise. Goosehead.com itself features games, music downloads, and original comedy in streaming video. But that’s just the start. Power has signed a development deal with MGM Television Entertainment and is working on a pilot script order for Showtime for “Whatever,” a slice-of-teen-life Web series. The high school sophomore is also developing projects with Richard Dreyfuss, a talk show, and a feature film.

[Editor’s note: Goosehead.com is owned by a different company now.]

“Our look totally makes or breaks our site,” says Power. “Teenagers are always coming to our message boards and asking ‘How did you do this or that?'”

Ashley’s mother, Michelle Schilder, played a major role in helping Ashley find her success. A graphic designer herself, Michelle enrolled Ashley in a Photoshop course at a local college when Ashley was 13. It was love at first click, and Ashley began experimenting with creating graphics for her own Web site. The first home page was originally created using Microsoft FrontPage, but as Goosehead expanded beyond a home page into a full-tilt teen entertainment network, Ashley switched to GoLive to take Goosehead to the next level of interactivity and sophistication.

Today, Mark Schilder, Ashley’s stepfather, is the site’s primary designer, supported by a team of six artists including Michelle and Ashley. Altogether, Goosehead employs 30 people.

“We try to make the site look more raw, because that’s were Ashley began and what teenagers respond to. In fact a lot of the work is by teenage Web programmers,” said Mark.

True Teamwork
A fine artist by training, Mark spearheads the site’s creation using Photoshop, GoLive, and Adobe After Effects. He begins by creating type styles, logos, buttons, color overlays, and other common design elements in Photoshop, saving each on a separate layer. Designers choose elements from the Photoshop layers for other work, ensuring a consistent look and feel throughout the site.

“Layers in Photoshop keep us organized and help us work faster,” says Mark. “If Michelle is creating a fashion page, she can simply grab elements I’ve already created — backgrounds, buttons, and such — and assemble them to create the major elements of a page.”

From there, designers produce and maintain the site using GoLive. GoLive helped to change the production and maintenance process. Instead of uploading revised graphics to the site, designers simply log into the site via FTP, open a page, double click on the graphic (which automatically launches Photoshop), and make the change in real-time. Capabilities like this bring a new level of productivity to the Goosehead team in updating a site that just keeps getting bigger and better.

Ashley particularly appreciates the ability to use GoLive to easily add sophisticated interactivity to the site like JavaScript rollovers for buttons and other visual elements. Prior to using GoLive, Ashley was doing a lot of hand coding in HTML to add features that made the site more engaging.

Web TV
In addition to live chat, e-mail, a search engine, e-commerce links to sponsors, and just generally cool-looking graphics, Goosehead boasts the popular Web mini-series, “Whatever,” which gets about 100,000 hits a day. Starring Ashley as Skye Warner as she undergoes the trials and tribulations of being a teenager, the six episodes were created largely using Adobe After Effects.

Mark built all of the title pages and introductory graphics as well as some sophisticated computer-generated (CG) effects using the program. In one episode, Mark wanted a devil to appear in Ashley’s room. He created devil images in Photoshop, and then brought them frame-by-frame into After Effects for animation. “I created this effect basically for free in a couple of hours,” says Mark. “An effect like that would normally cost a lot of money if we took it to a CGI house in Hollywood.”

The folks at Goosehead attribute much of the popularity of the site and the deals looming with major television networks to the site’s look and feel. Goosehead regularly rates in the top five most-visited sites for teens and kids. By focusing on teens, Goosehead is tapping into one of the Internet’s hottest market spaces; the analyst firm Forrester Research estimates that 47 percent of the 50 million people in the U.S. between the ages of 16 and 22 are hooked up to the Internet, with the percentage growing to 62 percent by 2003.

What’s truly amazing is the fact that the site was created without any expensive outside Web expertise. “We all just keep practicing and helping each other out, sharing things we discover, and the site just keeps getting better,” says Ashley.