Dell Cloud Client Computing Human Interface Guideline

As the Visual Design lead, I am responsible for designing the components and aligning the visual language of the system with Dell corporate design guideline.

Background

One of the UX goals for the fiscal year in the organization was to unify our design vision across multiple products. We did so with collaboration with other Dell UX teams in order to design a cohesive guideline unique to Cloud Client Computing but aligned to the Dell ecosystem. We measured success by successfully:

  1. designed a design system aligned with Dell brand system
  2. developed a usable web kit 
  3. leveraged by multiple products within the organization
  4. validated usability with user testing.

The Dell Cloud Client Computing Human Interface Guideline is an internal website that documenting principles, styles, and UI components with interaction and visual specifications that intend for software user experience across the Cloud Client Computing products. The designers and developers within the division can both design and develop using consistent design and code library. 

Process

We began with team brainstorm of the Design Principles. I designed and facilitated a series of design workshop internally to brainstorm the design attributes and principles we presented, as well as aligning with the core Dell brand principles.

At the same time, there are three other product redesign in progress: Dell Wyse Device Manager, Dell Wyse vWorkspace, and Dell Wyse ThinLinux. Weekly meeting was set up for designers on each product communicated and collaborated on consistent interaction and visual components. The goal was to ensure components that we designed would scale across the different products while presenting a consistent brand with visual language. Detailed interaction and visual design specs were documented in the internal website, as well as static and animated examples to illustrate design and motion.

Front-end development worked with us to code and to produce a web kit. Daily check-in was taken place to ensure any necessary communication was taken place to keep us moving. Code for each component was posted on each pages. A package of web kit was also available for download.

Design