Hewlett Packard Enterprise - Process Overview

 

content brief & copy deck

A content brief informs both the copywriter and the designer of the strategic goals and content hierarchy within a particular page or section requiring design. This brief should guide design decisions and translate into a meaningful flow. Typically, I will work directly with the client to create briefs but in the case of Hewlett Packard, enterprise datacenter subject matter experts and the well staffed HP sales and marketing teams were able to set appropriate goals and provide expert page strategy.

 

wireframes

I tend to draw my wires by hand, on paper - it's faster than photoshop and is usually viewable in a much smaller space so I can see how the design balances as a whole more easily. I will then translate my paper drawings into a visual comp, plugging in actual content and tweaking my paper design to accommodate any unforeseen widows peaks or awkwardness.

 
 
 

Component Library

Every design component is saved individually for consistency and reuse. When a new component is necessary, development can start to build long before global content design has been completed. Every component is saved in a single PSD which is continuously updated and maintained.

 
 

RED Lines & rules (global & component)

Each component contains it's own red lines and dev specifications. There are also global rules for padding, photo ratios and sizes, headlines and typography, color, alignment, forms,  and all other component and site specifications. In addition to the PSD component library, there is a live, editable, style guide hosted on an internal Atlassian wiki as well as a client facing development style guide.

 
 

Visual Comp & Assets

A reference for  implementation. Visual design, photo selection, color treatments, and all other final brand treatments. 

 

Medium Marquee (Video)

 

Storyzone (50/50)

 

Product Portfolio

Cross Sell

 

Resources