STEP
DESIGN FROM THE INSIDE OUT
HOME   |   SUBSCRIBE  |   ABOUT  |   CONTACT US  |   NEWSLETTERS  |   CALL FOR ENTRIES  |   ADVERTISE  |   SUBSCRIBER SERVICES  |   JOBS
STEP ONLINE
2008
2007
2006
2005
FREE NEWSLETTER
STEP INSIDE
I do not envy the task of the judges for our annual Best of Web competition. Besides the usual parameters for judging a design competition—layout, typography, color, use of imagery—they also must consider factors exclusive to the digital realm: interface ease-of-use, continuity, scalability, content management, on and on.
» Continue
JUPITERIMAGES SEARCH
Jupiterimages offers millions of quality photos, fonts, clipart images and animations!

 
Jupiterimages.com
Clipart.com
Photos.com
Animation Factory
internet.commerce
Join Partner Program
 
Sept/Oct 2007
Best of Web: Sites of Merit


DANIEL ARSENAULT | www.scrattsurf.com
The Scratt Surf website looks a bit like an oldschool zine, and there’s good reason for the resemblance: Daniel Arsenault made the site’s collage elements largely by hand. “I spend a lot of time at Kinko’s,” he says. “It’s like doing a high school yearbook when they cut and paste things in the back with people’s faces.” While he makes his living as an advertising photographer, Arsenault considers himself an artist first, and for the past three or four years he’s been applying his collage work to custom surfboards. This site promotes that side business, so it’s only natural for the site’s design to mirror the look and feel of the products.

To create his collages, Arsenault starts with hard copies of his photographs and drawings. He takes these items to a copy machine to manipulate sizes as he begins combining these and other elements with low-tech tools ranging from scissors to tape. Once he’s satisfied with a creation, Arsenault photographs the collage and brings it back into the computer. Here he’ll replace those low-quality images—the ones ran through the copier—with high-quality versions, and perhaps lay real type into the collage. This unusual process produced the site’s engaging and authentic graphics. But at this point, you might be wondering about the project’s name. It turns out that a scratt is a cross between a squirrel and a rat—as well as a nickname Arsenault earned for sleeping in his clothes for days on end.
Michelle Taute

Daniel Arsenault | ART DIRECTOR, DESIGNER, PHOTOGRAPHER, VIDEOGRAPHER: Daniel Arsenault | PROGRAMMER, FLASH: Version-X Design | COPYWRITERS: Chris Drysdale, Daniel Arsenault | MUSIC: “Wave Slave,” by Daniel Arsenault | AMBIENT MUSIC: El Patapsco | www.danielarsenault.com


HELLO DESIGN | www.eatbetteramerica.com
Having taken notice of recent studies indicating an increasing interest in nutrition on the part of baby boomers, General Mills sought to create an online health platform to reach this audience and anyone else wanting to improve their well-being. Although conceived for those entering the second half of life, Eatbetteramerica. com is an easy-to-use resource for all who desire to eat and live better.

“We know that, too often, nutritional information is boring, confusing or just plain difficult to follow,” says Hello Design creative director David Lai. “As one of the leading food companies in the world, General Mills saw the need for a simple, straightforward website that makes eating better easier and more fun.”

Divided into four sections—food, recipes, fitness and community—the site allows users to dig into a topic, with useful information presented in a clean graphic style. This is a site that appears uncomplicated, yet has significant breadth and depth of content on the subject of living a healthy lifestyle. In developing the information presented on the site, General Mills partnered with health media giants Rodale and Lluminari to tap into their expertise, as well as to collect articles, advice and tips that anyone can benefit from.
Terry Lee Stone

Hello Design | CREATIVE DIRECTORS: David Lai, Hiro Niwa | PRODUCER: Szu Ann Chen DESIGNER: Midori Yamanaka | PROGRAMMERS: Jason Taylor, Jon Lorenz, Sarah Grant | DEVELOPER: Hugo Zhu | QUALITY ASSURANCE: Morgan Weatherford | www.hellodesign.com


HELLO DESIGN | www.huntingtonconservatory.org
The Huntington Library designed and built the conservatory, an interactive science center for children and families, to aid its outreach in botanical education. Combining the diversity and beauty of a conservatory with the learning experience of a science museum, the new facility is designed to encourage children to learn and build skills using real plants.

This website is a complementary element to the new conservatory. It is targeted at kids 9-12 (along with their families and classrooms) to encourage them to explore and learn about plants through the conservatory’s three distinct environments: Tropical Rain Forest, Cloud Forest and Temperate Bog. Site visitors can learn about plants through a dynamic database or search for plants by their location or interactions with other living things. The site was actually designed to take its cues from plants. For example, the navigation is an organic vine that comes down and grows as users mouse over it. Features boxes have rounded edges like leaves. “One of our favorite areas is the footer, which we call the digital garden,” says Hello Design creative director David Lai. “It allows visitors to plant their own digital plants on the site and leave a little information about who they are and where they come from. It was a fun idea to connect plant lovers around the world.”
Terry Lee Stone

Hello Design | CREATIVE DIRECTORS: David Lai, Hiro Niwa | PRODUCER: Szu An Chen | DESIGNER: Midori Yamanaka | DEVELOPER: Hugo Zhu | QUALITY ASSURANCE: Morgan Weatherford | www.hellodesign.com


IAMALWAYSHUNGRY | www.iamalwayshungry.com
The website for Nessim Higson’s creative studio, iamalwayshungry, is structured around the idea of dynamic abstraction. Algorithms were used in its design, enabling various aspects of the site to change on each visit. The goal is to create a truly unique experience from visit to visit and from person to person.

The website houses a variety of the studio’s work and doubles as an archival system for anyone who visits. “To avoid redesigning it every year or two, and out of sheer laziness, we made the structure of the site flexible and dynamic for easy updates,” explains Higson. “Another consideration that kept us up at night was accessibility. We made sure anyone could view it no matter what, with arrow keys, image activation or the main menu.” Just as important as its structure is the use of motion in the site. Special attention was given to how pieces transition on and off the screen, creating a certain innate rhythm with the ebb and flow of the content. Using the advantages of the latest Flash technology, imagery was given specific properties and allowed to adjust according to surrounding colors and elements, filling the screen. “As people begin to work on larger monitors with higher resolution,” says Higson, “imagery can and should begin to take on a higher importance.”
Terry Lee Stone

iamalwayshungry | creative director, art director, designer: Nessim Higson | programmer, developer: Destin Young | www.iamalwayshungry.com


IAMALWAYSHUNGRY | www.leecrum.com
The continually evolving website for photographer Lee Crum was intended to be uniquely engaging in order to grab people’s attention. It’s a flexible site designed to allow multiple uses for Crum and for viewers. “We were wanting to create something that felt both like a personal showcase and a gallery space—which, in a way, become one and the same,” says Nessim Higson, creative director of iamalwayshungry, the site’s designer/developer.

The virtual space of the website feels very similar to the photographer’s New Orleans gallery space. Crum has an extensive collection of very ornate picture frames in his studio that he also wanted to showcase on his site. By using them as a graphic metaphor to set off Crum’s stark black-and-white imagery, the website effectively captures a true sense of personality and aesthetic focus. Minimalist graphics make the photographer’s work the focus. Navigation can be done manually or simply left on autoplay. It uses x, y and z axes so users feel as though they can closely investigate the photographs. “We have continually approached the composition and grouping of the photographs with a great deal of consideration. It can be intriguing to see the groupings of work change from a different gallery view,” notes Higson.
Terry Lee Stone

iamalwayshungry | CREATIVE DIRECTOR, ART DIRECTOR: Nessim Higson | DESIGNERS: Nessim Higson, Erik Kiesewetter | PROGRAMMER, DEVELOPER: Destin Young | www.iamalwayshungry.com

| 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 »|
Events & Courses


JupiterOnlineMedia

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info


Legal Notices, Licensing, Reprints, & Permissions, Privacy Policy.

Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

Solutions
Whitepapers and eBooks
IBM Whitepaper: Innovative Collaboration to Advance Your Business
Internet.com eBook: Real Life Rails
Avaya Article: Call Control XML - Powerful, Standards-Based Call Control
Tripwire Whitepaper: Seven Practical Steps to Mitigate Virtualization Security Risks
Internet.com eBook: The Pros and Cons of Outsourcing
Go Parallel Article: Scalable Parallelism with Intel(R) Threading Building Blocks
Internet.com eBook: Best Practices for Developing a Web Site
IBM CXO Whitepaper: The 2008 Global CEO Study "The Enterprise of the Future"
Avaya Article: Call Control XML in Action - A CCXML Auto Attendant
Go Parallel Article: James Reinders on the Intel Parallel Studio Beta Program
IBM CXO Whitepaper: Unlocking the DNA of the Adaptable Workforce--The Global Human Capital Study 2008
Adobe Acrobat Connect Pro: Web Conferencing and eLearning Whitepapers
Go Parallel Article: Getting Started with TBB on Windows
HP eBook: Storage Networking , Part 1
MORE WHITEPAPERS, EBOOKS, AND ARTICLES
Webcasts
Go Parallel Video: Intel(R) Threading Building Blocks: A New Method for Threading in C++
HP Video: Is Your Data Center Ready for a Real World Disaster?
Microsoft Partner Portal Video: Microsoft Gold Certified Partners Build Successful Practices
HP On Demand Webcast: Virtualization in Action
Go Parallel Video: Performance and Threading Tools for Game Developers
Rackspace Hosting Center: Customer Videos
Intel vPro Developer Virtual Bootcamp
HP Disaster-Proof Solutions eSeminar
HP On Demand Webcast: Discover the Benefits of Virtualization
MORE WEBCASTS, PODCASTS, AND VIDEOS
Downloads and eKits
Microsoft Download: Silverlight 2 Software Development Kit Beta 2
30-Day Trial: SPAMfighter Exchange Module
Red Gate Download: SQL Toolbelt
Iron Speed Designer Application Generator
Microsoft Download: Silverlight 2 Beta 2 Runtime
MORE DOWNLOADS, EKITS, AND FREE TRIALS
Tutorials and Demos
IBM IT Innovation Article: Green Servers Provide a Competitive Advantage
Microsoft Article: Expression Web 2 for PHP Developers--Simplify Your PHP Applications
Featured Algorithm: Intel Threading Building Blocks - parallel_reduce
MORE TUTORIALS, DEMOS AND STEP-BY-STEP GUIDES