Cloudbees design principles

09 May 2017

As part of my job at Cloudbees, I have been working on creating our Design System. I began with a foundational element, the design principles, which defines the design direction going forward and helps convey our core beliefs to stakeholders.

“Design principles are the guiding light for any software application. They define and communicate the key characteristics of the product to a wide variety of stakeholders including clients, colleagues, and team members. Design principles articulate the fundamental goals that all decisions can be measured against and thereby keep the pieces of a project moving toward an integrated whole.”

— Luke Wroblewski, Product Director at Google

What are good design principles?

A good set of design principles, on the other hand, does the following:

  1. Helps resolve practical and real-world questions around specific design decisions.
  2. Applies to an entire class of design decisions, both things we can think of today, as well as questions that will pop up in the future.
  3. Imparts a human-oriented sense of “why?” that is easy for everybody — including non-designers — to understand.
  4. Has a point of view and a sense of prioritization that a rational person could disagree with.
  5. Is generally paired with illustrative examples that show how the principle applies to specific decisions.”

Julie Zhuo, VP of Design at Facebook

Cloudbees Design Principles

  1. Design with consistency
  2. Design simply
  3. Design for delight
  4. Design iteratively

Design with consistency

1. Design with consistency

We believe that a consistent experience across all Cloudbees products & to pre-existing mental models is essential; that consistent design is intuitive design and eliminates confusion. Visual consistency increase learnability of the product. Functional consistency increases the predictability of the product. We believe that consistency both Internal, visual and functional consistency of a product, and External, design consistency across multiple systems/products, is imperative to a great user experience.

Consistency should be built into the foundation of any design. Only the best designers will recognize what’s been done, but everyone who enjoys the product will appreciate it—whether they notice it or not.

— Joe Toscano, Experience designer for R/GA’s Google team

Design simply

2. Design simply

We believe that the best answer is often the simplest answer; that presenting a few choices, avoiding jargon and designing for brevity & clarity helps avoid overwhelming the user & creates the best product possible. We believe designing simply applies to both the user interface and the user experience. Simple is loved, needed, used and shared. Simple is also hard 😬.

“A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away.”

— Antoine de Saint-Exupery

“A good designer finds an elegant way to put everything you need on a page. A great designer convinces you half that shit is unnecessary.”

— Mike Monteiro

Hick’s law describes the time it takes for a person to make a decision as a result of the possible choices he or she has: increasing the number of choices will increase the decision time logarithmically.

Design for delight

3. Design for delight

We believe that designing with surprise & delight in mind will foster allegiance with the user; that going above and beyond will create an enjoyable experience that will make our products go from good to great. We believe through customer feedback, we can focus to refine every feature of the product until we get it right.

“Emotional design—which uses psychology and craftsman- ship to create an experience for users that makes them feel like there’s a person, not a machine, at the other end of the connection.”

— Aarron Walter, Author of Designing For Emotion
Design iteratively

4. Design iteratively

We believe that great design requires iteration; that the best designs are used and honed, not created and delivered. We believe that great design requires failure, and therefore a great design process requires light-weight, living deliverables that allow for rapid and constant refinement.

There are really two things that have to occur in order for a new technology to be affordable to the mass market. One is you need economies of scale. The other is you need to iterate on the design. You need to go through a few versions.

— Elon Musk