Tuesday, August 31, 2010

1.2 A little print, a little web, a lot of good

Starting out week one with a look at some very sleek website design seems like the perfect place to begin. The 2Advanced Studios design company has a website that perfectly mirrors their assertion that they “push the boundaries of design and technology.” Every single detail of this site is perfectly designed to promote an edgy, part futuristic, part fantasy-scape image. This extends from the background imagery to the hypnotic music to the titles of the former site versions—Rebirth, Expansions, and Prophecy—located in the web archives.

The navigation system further feeds into this futuristic feel by using an uncluttered bar that drops down upon rollover with a subtle melodic computer processing sound, expanding within itself to a greater or lesser levels of specificity. In fact, every bit of information you could want is accessible from this main page, and yet there is a spacious feeling to the design based largely on the use of dropdowns that keep most of the information organized. Also, the use of background music, while often annoying on many websites, is ingenious in this case. The hypnotic sound actually made me hang around and browse the website (literally all of the sections) for a much longer time period than if I was just clicking around without that sound. It created a sophisticated ambience that fit seamlessly with the rest of the site contents. Also, speaking of seamlessness, 2A managed to use a background with a different color scheme on each main area of the website while making these pages tie in perfectly together. This sounds like an amazing feat, and trust me, it is.

First of all, the website pages are tied together by the consistent placement of frames within the space and the consistent look and function of the main navigation bar as well as the sub-navigation bars revealed in each section. Even the scroll bars fit into the overall design by offering a sleek line that matches the color scheme of each page, but using a common white handle to offer consistency between the pages. Beyond all that, however, they pull off the color changes by exchanging background images that utilize space in a similar fashion; each image has a relatively open sky area to prevent crowding the navigation and a foreground that is fairly dark and free of large objects. Of course, the pyramid that appears in each image also gives them a similar feel. Finally, the color changes work because each one is revealed in the navigation. Scrolling over “company” in the navigation bar reveals a slightly luminous, circular green bullet and clicking the company page loads a dominantly green background. That kind of attention to minuscule details is what makes all the elements of this site gel.

Now, cool animation and elegant design aside, 2A has not skimped on function. Everything is clearly labeled and all elements (portfolio, about page, contact, etc.) are available in the navigation panel on each page. There is not one extra click required on this site—like having to go from “awards” (which a sub-menu of “recognition”), to “home” in order to access “about.” 2A designers also clearly understand that some users will be annoyed by a rollover navigation system or background music, and offer preferences that allow the user to alter these elements and save the changes for later viewing of the site. Even more importantly, the sound and language can be adjusted at the top of the page, so there is no chance a user will have to fumble around looking for those controls under preferences if they just want to quickly change those settings.

I could go on here, but suffice it to say that every element of the 2A website is purposeful and well-designed. The animations are engaging but subtle, the imagery is beautiful and contextually appropriate, and every part of the design seems effortless, which is the true sign of a sophisticated creation.

Check it out here:
http://2advanced.com/#home

Now, since print is still alive and flourishing, I turn my attention to a book. Creating a Website: The Missing Manual is, despite the straightforward (read unimaginative) title, actually a fun book. OK, I know, the book is part of a series so the title is out of Matthew MacDonald's control, but I want to make it clear that this book is not in any way boring, as the title might suggest. It is extremely informative but written in a pleasant, conversational style. This is important because it achieves the nearly impossible task of presenting technical material in a way that is neither insulting simplistic (like the "For Dummies" materials) nor boring beyond belief. In addition to the book, there is a useful companion website; this is somewhat surprising because it functions as more than a promotional page and set of testimonials. The website has links (all of which are actually functional and up-to-date) and downloadable materials that relate to every chapter. It, as well as the book, is definitely worth a look.

Check it out here:
http://missingmanuals.com/cds/creatingws2tmm/

And in print:

No comments:

Post a Comment