REDESIGN WEBSITE, DESIGN SYSTEM — 2016

The image is a blurred gradient background with shades of green and teal.

Hewlett Packard Enterprise

Multiple electronic devices displaying Hewlett Packard Enterprise website, including a desktop computer, tablet, and smartphone, showing news, press kit, and corporate information pages.

About the Project

Hewlett Packard Enterprise is one of two publicly traded companies arising from the separation of Hewlett Packard into HP Inc and HPE. As a market-leading company, they needed a site that defined the next generation of infrastructure, software and services. In collaboration with the HPE branding, advertising and direct response agencies, we launched a new company (a $58 billion startup) in 44 countries and 12 languages…all in under 10 months.

My role

Senior designer, working with creative directors, through end to end process: discovery, user research, design, testing, support through launch

Team

Graham Golkin — Creative Director
Torsten Rothbarth — Associate Creative Director


Goals

HP is optimized for selling boxes.

HPE brings the promise of transformation.

  • Evolve the business from selling “boxes” to capitalizing on innovative product systems and long-term partnership

  • Introduce stronger story-telling and cross-selling techniques to build a compelling HPE POV and be more business-outcomes oriented

  • Use the web as a strategic tool to shift the conversation to be more business-outcomes oriented

Design Solution

Adobe Experience Manager

The website was built with Adobe Experience Manager (AEM), a comprehensive content management solution used for all of their websites, apps, digital forms and online communities. It brings content management systems (CMS) and digital asset management (DAM) together in one place. 

As a creative team, we had to design a site that utilized a major component system that could extend across a wide variety of digital mediums.

Adobe Creative Cloud Libraries

Since we had a large creative team including freelancers, we used Adobe Creative Cloud Libraries to ensure consistency across the team.

Wireframe design of a website with sections for headers, subheads, buttons, icons, and text blocks. Includes color palettes, layout grids, and various UI element sketches.

UI Design


Screenshot of Hewlett Packard Enterprise website with a navigation menu including Solutions, Services, Products, About, and Contact Us.

Global Navigation


The image depicts multiple electronic devices, including a computer monitor and smartphones, displaying cybersecurity and IT infrastructure content, with a person working on a laptop in the background.

Storytelling


Devices displaying a website with a map to find partners, including a desktop monitor, tablet, and smartphone.

Contact & Sales


Multiple electronic devices displaying a technology blog webpage, including a tablet, smartphone, and desktop monitor with images of data centers, airports, and people working.

HPE Developer Community


Multiple electronic devices, including a desktop monitor, tablet, and smartphone, displaying server specifications and comparison pages for Hewlett Packard Enterprise server hardware.

Product Catalog


Multiple electronic devices showing the Hewlett Packard Enterprise website and news articles.

Newsroom: Leadership Platform


Illustration of digital devices displaying automotive manufacturing and technology articles, including a server room, a tablet, a smartphone, and a desktop monitor.

Newsroom: Leadership Platform


Multiple electronic devices displaying Hewlett Packard Enterprise digital content, including a desktop monitor, tablets, and smartphones.

Newsroom: Press Tools