Design language defines physical characteristics, color, material applications and three-dimensional logo treatments of a company’s products.
On a business strategy level, common design language creates coherence among company products, building greater brand awareness when consumers identify and recognize the different products as part of the same family.
Discover the methodology and reasons why it is important.
2. Bridge Design, Inc
Design Research & Strategy | User Experience | Industrial Design | Product Engineering
Solène Bourgeois
Director of Industrial Design
3. Design Language
= DNA of your product offering
Design language goes hand-in-hand with brand identity. Just as brand identity
strongly influences a company’s name, tagline and graphic application of its logo,
design language defines physical characteristics, color, material applications and
three-dimensional logo treatments of a company’s products – whether they be a
physical product or digital a product, such as mobile or web apps. The guidelines
apply even to packaging, exhibition booths and user interface and customer
experience.
4. On a business strategy level, common design language creates coherence among
company products, building greater brand awareness when consumers identify and
recognize the different products as part of the same family.
For example, Apple has a wide offering of products from phones, tablets, laptops,
and now a watch. Even though each product has a different form factor, each has
the same aluminum finish and contrasting black or white plastic. The simplicity and
quality of the material and finishes is a subtle physical way to create a consistent
design language, and enhance brand recognition and uniqueness in the market.
For the internal functioning of a company, having a strong design language
minimizes product reinvention between often siloed departments. Ultimately, it can
help shorten the time needed to launch a product. A common design language will
take into consideration complex requirements on multiple fronts: for users, for
materials, for the market, for the regulatory environment.
Why is it important ?
5. The first step in creating a design language involves strategy, and depends on the
company’s stage of development. If it is a new venture with a first product, or an
established company entering a new product category, the design team will gain
an understanding of overall market and propose a strategic positioning, including
brand values. If instead, the company already has a foothold in a market, the design
team would look at potential new markets, offering its expertise as design visionaries.
Market and business strategy
6. Below are examples of typical brand values that could be applied equally well to a
consumer medical or a biotech diagnostic product.
Brand values
An iconic brand value captures the essence of
the product in a strong, simple, innovative
statement. Its ultimate goal: become the leader
of a product category.
Related words: exemplary, disruptive,
innovative
Iconic
The premium look and feel of a product
translates into the selection of quality finishes
and materials, as well as a tight fit between
product parts. The sound and how a product
feels to a user’s touch also impacts quality
perception.
Related words: premium, high value
High quality
Medical products – even those found in labs –
are expected to meet “consumer” design
standards found throughout products used in
today’s modern digital lifestyle. These include
highly intuitive interfaces, quality finishes, a
broader color palette, higher speeds and
responsiveness.
Related words: approachable, modern, fresh
Consumer feel
With a consumer medical product – either
physical or digital in nature – ease of use is
paramount. It can create the desire to use this
new product. And in the case of chronic
disease, for example, intuitive design can also
increase the chances for behavior change.
Related words: reliable, accurate
Intuitive
7. Designers curate images – referred to as mood boards – that communicate the
“look and feel” of the brand. This is an iterative process, including brainstorming and
feedback with the client. The boards can include other products in the market, or
even abstract shapes, textures or pictures.
Product vision
Fun
Precise
Witty
Emotional attributes
Fluid shapes
Intricate patterns
Contrasting colors
Visual vocabulary
8. Designers write a design document that specifies the brand values and the primary
guidelines that address the overall spirit of the product. The document also includes
the secondary guidelines that capture its details of the product’s design. The
guidelines also extend in some cases to the application for the packaging and user
interface.
Below is an example of a Design Language Guideline Document for Accelerate
Diagnostics, Inc.
Guideline document
9. Brand Values
A substantial aluminum base-plate is the
foundation of the internal chassis and also
highlighted as an external visual feature. The
automatic opening and smooth movement of
the product’s door adds to its high
performance. High quality manufacturing
resulted in parts that fit tightly together.
Related words: premium, high value
High Quality
The design celebrates clean, crisp lines and
colors, and draws attention to the product’s
differentiating carousel technology. The circular
shape is also becoming the key element of the
user interface design to show the progress of
the analysis.
Related words: exemplary, disruptive,
innovative
Iconic
Accelerate’s innovative technology utilizes a
carousel system rather than the standard grid.
The design draws attention to the circular
carousel, reflecting the rotation mechanism
inside the product, and communicating
process speed via the oblong pattern on the
top of the door.
Related words: efficient, obvious
Form/function
Unlike many clunky and large lab diagnostic
products, Accelerate’s product is minimal and
compact, creating a new standard for lab
diagnostic products. The look is modern with a
flat white/black non- textured paint. The
product was created using injection molding
instead of the typical pressure forming. All
assembly elements have been removed from
the user view, making the product much more
approachable.
Related words: approachable, modern, fresh
Consumer feel
The design communicates stability and
robustness, both important for a product used
to diagnose potentially life-threatening
conditions. The user interface of the control
display is simple and easy to understand, it
tightens the product and interface together for
a more coherent experience.
Related words: reliable, accurate
Trustworthy
A careful workflow analysis led to a design that
cut the number of operation steps by more
than half, saving critical time for potentially life-
saving diagnoses. The design simplifies the user
interface by having only one button to operate
the automatic door.
Related words: integrated, ease of use, simple
Intuitive
10. Primary Guidelines
Corners should be perfect radius, no
curves
Generous round corners
Straight 90° angles and straight lines,
minimal draft or curved lines. Perfect
rectangles, squares or circles, no ovals
Straight lines
When two elements intersect they
keep their own identity without trying
to blend into each other
Distinctive elements
All elements should be as symmetric
and concentric as possible
Concentric
DO DON’TDO DON’TDO DON’TDO DON’T
11. Secondary Guidelines
Details are formed with a tight chamfer
Small chamfers
On the edges the radius are kept
minimal, between 0.2 and 1.5 mm
When certain features need to feel
smaller large chamfers can be used
Large chamfers
Details are treated with oblong shapes
for rotation pattern or ventilation
patterns, …
Oblong patternsTight radius
DO DON’TDO DON’TDO DON’TDO DON’T
12. Thank You
Bridge Design, Inc
Solène Bourgeois
Director of Industrial & Interaction Design
Design Research & Strategy | User Experience | Industrial Design | Product Engineering