12 Jul The 2010 Goodie Awards – Websites and Techniques
3rdM was asked to provide a technical review / market study on behalf of Pantone. The following is the provided report overviewing state-of-the-art players within applied web-tech constructs. We have segmented the observations to narrow the context of how each provider leads their space. Given the virtually infinite nature of the web, this is by no means a ‘complete’ list. Consider this an applied list with Pantone in mind:
BRANDING & DESIGN
Considered in the context of holistic visitor experience.
Volkswagen – http://www.vw.com
Immersive branding applied throughout all interrelated campaigns. VW ‘rebrands’ its site with each major design release of their product line’s aesthetic. The tactile interior design appointments are (re)reflected into the site’s experience. You are literally inside of VW, when you are experiencing their sites. Related outreach campaigns bring humor, community and brand development at each turn.
(examples: http://www.vw.com/vdubopedia/en/us/ , http://tdi.vw.com/ , http://tdi.vw.com/leaderboard/ , http://www.vw.com/vwhype/carbonneutral/en/us/ , http://www.vw.com/vw-junior-masters-soccer/en/us/ )
Nike – http://www.nike.com
What more can be said about the corporation who invented the modern conception of ‘brand’? In this study’s context, Nike underscores the requirements of a multi-divisional enterprise: clearly present your affinities, redirect immediately to parsed content segments, infill visitor experience needs with related materials. Client / visitor needs and met expectations comes first in each case.
Schirn Kunsthalle – Playing the City – http://www.neue-digitale.de/projects/schirn_playing_the_city/
An expansion of the “museum without walls” concept, Playing the City embraces branding and integration on all fronts simultaneously: supporting video, website, newsletter, apps, and collateral all lead to the experience itself by providing the experience’s implementation.
Adobe – http://www.adobe.com/products/indesign/
Brand concept and product experience is projected forward into a contextualized wrapper. The visitor is, in effect, given a sense of the use of each product prior to engaging specific content found within the page and navigation systems. Keep in mind that this is an ALL FLASH site (naturally) which provides its own host of limitations.
Apple – http://www.apple.com
Apple perennially shows up within design and branding overviews. We are going to take an (unpopular) alternate analytical position for illustrative sake: we’re not sure that Apple’s WEB APPROACH is a great design / branding example. Is their product design strong? Yes. Is their brand highly integrated? Yes. Does their site reflect these tenets? Yes. Are they successful? Undoubtedly. From a web perspective, Apple.com <http://Apple.com> currently suffers from Design 101 troubles: their additive content constructs combats the visual requirements of primacy. (see: http://www.apple.com/mac/). When all elements provides competing levels of visual engagement – the visitor’s eye, and therefore their experience, does not find the comfort of priority and an ease of utility. We suggest that related providers, such as CulturedCode (http://culturedcode.com/) provide a more “Apple-like” experience in this regard.
Downtown Brooklyn: It’s the Moment – http://www.itsthemoment.com/
Clean, cool, consistent, and considered.
Toyota: the Every Five Seconds campaign – http://www.toyota-screensaver.ru/
Never forget to balance humor with brand positioning and targeted outreach campaigns.
The concept of localization has been, in the past, influenced by two main philosophies: distribute content by language vs. distribute content by country. A content provider’s business model usually establishes specific ‘best practices’ decision trees governing a selected philosophical route. Third Mind suggests that this philosophical dyptich is becoming outmoded. The advent of the user-generated-content ‘cloud’ combined with real time translation technologies, let alone global product distribution models, requires deep reconsideration by content providers of their philosophical and business model positions. In the following examples, bear in mind that the providers are not doing anything ‘new’. In fact, Pantone has deployed several variations of these localization strategies over the years.
Nike – http://www.nike.com
Nike exemplifies a sophisticated approach mediating between language first, then country context. The cons to this approach being the depth of technological and content support which can be provided by an organization with $20 billion / year global revenues.
Apple – http://www.apple.com/choose-your-country/
Apple deploys an iconographic system which balances country and language requirements simultaneously. This system reflects itself in the lower right corner of their sites, allowing the visitor to understand the system and appropriately customize their visitor experience.
Volkswagen – http://www.vw.com/companyinfo/vwworldwide/en/us/
VW exemplifies the country / region approach bolstered by pull-down lists and simultaneous graphical feedback.
Adobe – http://www.adobe.com/international/selector/
Adobe exemplifies a minimized experience which could be inserted in a number of localization contexts. Note the top-of-site mousetype providing status and the lead to a change agent for regionalism and language.
E-STORE / E-COMMERCE
Remarkably, ecommerce has become a staid industry argument between ‘one screen per entry requirement set?’ vs. ‘all input within one screen’ with respect to a visitor’s cart experience. The industry / Developers do not seem to be pushing this experience into a new paradigm. The pragmatics of security requirements, embedded systems and credit card gateways appears to mandate this lack of vision shift – we have not achieved brain-chips and universal currency yet ;^). Paradigms such as Amazon’s 1-Click program and MasterCard’s Secure Code program (http://www.mastercard.com/securecode) may provide initial inertia to move cart experiences to a more promising future.
Adobe – http://www.adobe.com/products/illustrator/ and Nike – http://www.nike.com
Though a bit slow and 100% Flash based, Adobe and Nike raised the bar in e-commerce experience when they re-tooled their commerce system several years ago. Note window / canvas expansibility and status provided throughout the cart experience. Remember that these examples are ALL FLASH, which provides its own host of limitations.
Piper Lime – http://www.piperlime.com
An extension of The Gap / Old Navy / Banana Republic parentage – Piper Lime’s cart reflects a continuous improvement process developed in bricks-and-mortar and translated to the web. DHTML and Jquery based, providing a flash-like experience, surrounded by customer service options at each step.
Behance – http://www.behance.net and The 99 Percent – http://www.the99percent.com
Behance’s creative professional network (behance.net <http://behance.net> ) exemplifies a sample-set of the coming social media cloud. Content is targeted, specific, audience driven, yet distributed. The hegemony of macro communities —the fall of mySpace, the impending fall of Facebook— by their very nature collapse under their own entropy. Much like the VW examples, Behance is supported by both its larger parent’s dotcom mission (http://www.behance.com/Products) as it is fed by supporting programs such as Behance’s ‘The 99 Percent’ think tank effort.
ColourLovers – http://www.colourlovers.com.com
We have previously provided a great deal of specific analytique applied to Colourlovers – please see previous dialogues.
Panic – http://www.panic.com/blog/2010/03/the-panic-status-board/
Panic represents community at it’s best – top notch products, surrounded by high end support and service, supported by a group of rabid followers. 37 Signals represents this phenomena as well (http://37signals.com/). We could all learn a thing-or-two about a thing-or-two by embracing Panic’s personal approach to generating community and retaining excellent results.
I Love Design – http://www.ilovedesign.com
Though, ironically, ilovedesign could use some aesthetic design help… The feature set applied to their community is highly integrated, broad in scope, but user-friendly. UGC meeting a simple framework with multi-threaded sharing and community building outlets.
Yodabaz – http://www.yodabaz.com/
An applied example of upcoming Flash CS5 based 3D typography. Currently too buggy for critical-path content deployment.
Nike – http://www.nike.com and HBO – http://www.hbo.com
Nike’s Topnav system is contextual, targeted and supported by visual triggers. HBO’s main nav balances contextual visual triggers with subject-matter directive devices. Remember: all flash / big budget. See Third Mind’s applied solution for the Plus Series (http://www.pantone.com/pages/pantone/pantone.aspx?ca=1) utilizing DHTML and Jquery.
NBC – http://www.nbc.com
A Flash-based mega menu system which could be rendered more effectively using the Jquery system proposed for the Pantone site product menu – see “site_augment_topmenu_needs” by Third Mind.
Volkswagen – http://www.vw.com
Volkswagen’s topnav system provides insight for segmenting navigational queues beyond pure product links – high-level pricing, imagery, even FAQ features and benefits leads provide a vibrant outreach surrounding a visitor’s curiosity. In Pantone’s context, consider the core business focus found in the VW topnav solution. Supplementary content could be accessible through nave elements grouped away from the core focus materials. Stay conscious of, and avoid, navigational buffets.
Greenpeace: Love Letters to the Future – http://www.loveletterstothefuture.com/
Thematically clear with a poignant system of access to the content. Alternate paths provided through interrelated systems – see the left rail’s “+ Contents” overlay.
National Geographic – http://ngm.nationalgeographic.com/
Massive amounts of distributed content segments organized within a homepage context. Topnav systems relying on multi-tier metaphors.
Pantone has heard from Third Mind repeatedly and consistently with respect to specific content philosophies which should be applied to Pantone material. Given the limits of this inquiry, the infinite examples available for analytique, and Third Mind’s presentations / workshops / discussions with Pantone management – we’re not sure what more we can say. We have made very little progress on this front within Pantone’s body of institutional knowledge over the years. We will continue to advocate for contextual, rich, semantic, & portable content. Blogging and 3rd Party outreach programs remain little explored avenues within Pantone. Bearing in mind that you have made solid recent strides into User Generated Content (UGC) strategies and TONES – you’re headed in the right direction!
REPURPOSED CONTENT FOR MOBILE
Multivalent content and the initial shades of Web 3.0 should be considerations within the scope of this inquiry. The following is a short-list of content providers who are ‘doing it right’ in the mobile, tablet and smartphone space.
NPR – iPhone / iPad application
Well organized and unique “slider” approach to the different departments, their design puts a lot at your fingertips (excuse the pun). NPR also leverages the multimedia aspects of the platform with extremely well-integrated test, video, and audio.
The New York Times – iPhone / iPad application
Consistently lauded in industry Top Ten lists but ironically does not score as high with the user population
on the iTunes store. The New York Times iPad application is what a virtual newspaper should be. It maintains the broadsheet look which provides a degree of familiarity to the traditional reader, but takes full advantage of the iPad interface by providing both swipe navigation and zoom-in detail on each article.
Cool Hunting – iPad application
A great example of appropriately planned and executed technological implementations, Cool Hunting’s iPad App was designed and managed to release on the day of the iPad’s inaugural launch. Capitalizing on buzz can be as important to a deployment’s success as the content itself – especially within the early-adopter design community.
Facebook – mobile application
Unfortunately, mobile web has been frequently panned (justifiably) primarily due to the inability of web designers to effectively translate existing sites/content to the mobile platform. Facebook for mobile consistently comes up at the top of mobile web “best of” lists. A few reviewers have even commented that it’s easier to use than the “desktop” site.
Search integration within a site’s context appears to be a vast wasteland of solutions. We would look forward to hearing about any ‘cutting edge’ solutions seen in the marketplace. We have included a tease toward the possible future of Search / Results. This section does not cover SEO / SEM strategies.
Pantone Topnav Search Integration
Suggested search technologies appear to lead the field in terms of search integration. See “site_augment_topmenu_search” proposed by Third Mind. Kayak (http://www.kayak.com/) leads this field of inquiry by grouping and categorizing real-time search suggestions.
Microplace – https://www.microplace.com/investments/all
Microplace, a global micro-lending clearing house NGO, represents and interesting trend in returned search results: a contextualized, graphically supported return with rated content positioning each result for comparative analysis. This positioning extends beyond the ‘did you find this helpful’ paradigm by actually positioning the content within larger mission and interests measurement devices.
The Association of Boarding Schools – http://www.boardingschools.com
Note the hide / show folding search device found in the upper right of the site’s top navigation. This device is combined with the “fast find” and “news flash” footer elements to quickly direct visitors to high-level related content which exists off of the primary content critical path.
Snapshots of Provence: Visual Search – http://mediatheque.visitprovence.com/#/en/
Snapshots of Provence: Audio Search – http://instantanes.visitprovence.com/?l=en/#/en/photos
Note the thematic / graphical search system found in the right rail of the visual seach and the redirected mapping metaphor for the audio search.
We hope the above becomes a departure point for moving Pantone in new and exciting directions. As mentioned, this analytique barely scratches the surface of consultancy which can lead Pantone to new approaches and considerations.
Thanks and best –
Teresa, Mark, Robert & Co.
ps: just for fun (move your mouse after this loads): Painting a song – http://herraizsoto.es/labuat/eng/