7. Foundational HP brand elements page Typography HP Futura Tone of voice human, optimistic, intelligent, informative, dynamic, and witty Core color palette Bold, rich, vibrant; powerful impact within a narrow palette; optimized for digital publishing Photography Bold, rich, simple, optimistic, dynamic, believable, timeless Brand device Graphics A new unifying element; enhances the meaning of the communication, not arbitrary or decorative HP invent logo Blue and black, blue, black or reversed white Pervasive throughout our communications, applied through specific standards, never replaces our logo i n v e n t Illustration In certain cases, illustration may be suitable, or more inventive, than photography i n v e n t
8. HP.com customer experience evolution page September, 2003 HP Web standards site - http://www.hp.com/hpweb Adweek 2003 Technology Marketing's ICON Platinum Award for Best Interactive Web Site Category – HP.com American Business Award’s “Stevie” for Best Corporate Web Site – HP.com Ranked #1 amongst High-technology companies for online Customer Respect by the Customer Respect Group – HP.com Internet Retailer’s 2003 Best of the Web - High-Tech line-up – HPShopping Future Complexity, Cost, Competitive risk 1995 Baseline info. 2003+ E-commerce HP.com HP.com B2B myHP.com (personalized, dynamic rendering) HP -Compaq merger HP IT Resource Center support site was selected as one of the 2003 "Ten Best Web Support Sites" by the Association of Support Professionals (ASP). 2001 (pre-merger) 2002 (day 1 after merger) 2003 (One Voice) 2003 (current)
9. page September, 2003 HP Web standards site - http://www.hp.com/hpweb Introduction to the new design
13. The new design – directory page page September, 2003 HP Web standards site - http://www.hp.com/hpweb
14. The new design – product / content level page page September, 2003 HP Web standards site - http://www.hp.com/hpweb
15. The new design – product / content level page page September, 2003 HP Web standards site - http://www.hp.com/hpweb
16.
17. HP Web standards home page September, 2003 HP Web standards site - http://www.hp.com/hpweb *
18. HP Web standards home continued page September, 2003 HP Web standards site - http://www.hp.com/hpweb
19. HP Web standards home continued page September, 2003 HP Web standards site - http://www.hp.com/hpweb
20.
21. Templates and other assets page September, 2003 HP Web standards site - http://www.hp.com/hpweb Link to the Download assets page from the Web standards home page to obtain new templates and other items you will need to begin developing pages
22. Download assets page page September, 2003 HP Web standards site - http://www.hp.com/hpweb
23. HP logo page September, 2003 HP Web standards site - http://www.hp.com/hpweb
Editor's Notes
09/02/11 HP_presentation_template The HP brand elements have evolved. New elements include: The +hp brand device will be used throughout our communications, but does not replace the HP logo. Photography will continue to provide most of our main visuals at all levels The photographic style is bold, rich, simple, graphic, optimistic, energetic, tangibly real, and timelines. Photographs should never look staged. While black and white photography is a creative option, it is the exception, not the rule. Illustrations can be used in certain cases where it is more suitable or inventive than photography. The HP illustration is bold, sophisticated and poster-like. It should never look like clip art. Graphics are another new unifying element which enhances the meaning of the communications. Graphics can stand alone or be applied over photography or illustration. They are not arbitrary or merely decorative. They must advance the meaning of the communication. Approved photography, illustrations and graphics will be made available in the Creative Resource Library (CRL). To ensure color in our work is consistently bold, simple and vibrant, we’ve simplified our color palette to 16 colors. HP’s one and only typeface is HP Futura. No other font is as simple or as versatile. The HP invent logo will appear in blue, black or reversed white depending upon the communication. The way we speak is as important as what we say. The HP tone of voice is intelligent, informative, human, optimistic and witty. It is not arrogant, obscure or negative. It is not filled with jargon or jokes. Copy should be brisk and informative, pragmatic but never dull. It should reflect our passion for our customers and for our work.
09/02/11 HP_presentation_template HP.com is a critical customer touch point The site is evolving to align with the Operation One Voice corporate initiative in support of delivering a single voice out to the customer In redesigning the site we also ensured that we are supporting the eBusiness vision of becoming the #1 Rated High-Tech Web Site, the #1 Customer Satisfaction Web Site, #1 in eCommerce Revenue, and #1 in eBusiness Efficiency The design, IA, and tagging that make up HP.com play a key role in delivering on that eBusiness vision and driving for a 1:1 relationship with our customers
09/02/11 HP_presentation_template The home page supports the new messaging model The home page and top-level landing pages maintain a different look and feel from lower level pages It reflects some of the new key design changes used throughout the site: A single, bold theme color OOV compliant imagery Square corners New capitalization rules
09/02/11 HP_presentation_template Elements of the design: A new design system hierarchy defines how important content is highlighted on the page Button color and style has changed Promos have changed stylistically Behind the scenes, new meta data requirements will help achieve increased customer satisfaction
09/02/11 HP_presentation_template Some elements of the design are unchanged from the previous version of the standards: C-frame structure Information Architecture Column structure Navigation Fonts Link Indicator Breadcrumbs
09/02/11 HP_presentation_template HP.com has a new, bold color palette A single theme color is used per page with supporting grays to make important information pop “ Standard English rules” are now used for capitalization Use initial cap for first word only in headlines, page titles, sub-heads, navigation links, and bulleted text Buttons, tabs, images, and highlighted content areas all have squared corners The guidelines for highlighting content with color have expanded to include hierarchy in the page design Only Operation One Voice images can be used on HP.com These are governed by the brand team and available through the Creative Resource Library (CRL) A group of new meta tags are required on all pages
09/02/11 HP_presentation_template Areas to point out and describe: helpdesk link, site search, each major area on the left nav, news and updates section
09/02/11 HP_presentation_template Talk about the items available for download here