A-Z Popular Blog Design Search »
Design
 Advertisements
Related Guides
Design
Key Concepts
Design
Related Topics

9 Principles of Flat Design

 , updated on
Flat design is a minimalist style of user interface that has emerged as a dominant design approach for information oriented user web sites and mobile apps. It takes influence from minimalist traditions such as Bauhaus. Flat design keeps a design simple and clean in order to impress customers with content and functionality over decorations. It tends to be easy to develop and lends itself well to dynamic content, platforms and resizing for multiple devices. The following are general principles or characteristics of flat design.

Standard Elements

Use of standard native elements such as the buttons of html. Avoids attempts to override the look and feel of such elements.

Practical Color

Solid colors that are selected for practical reasons such as contrast for visibility. Typically gradients and ornate textures are avoided.

Sans-serif Typography

San-serif fonts are selected for their readability on a range of screens.

Grid Layouts

Grid layouts that lend themselves well to resizing. Also simplifies the generation of interfaces from a platform.

Symettrical

Flat designs tend to rely on symmetry for balance. Although asymmetrical elements may appear in a grid there is rarely much attempt to use sophisticated asymmetrical balance techniques.

Native Dimensions

Tends to avoid 3D looking icons and effects on a 2D screen.

Mechanical over Organic

Flat designs rely on geometrical shapes with no attempt to make designs soft, curvy or organic.

Decorations are Functional

Flat designs are decorative in the sense that they often make heavy use of icons over text. They also commonly use photographs. Flat design avoids illustrations that have no function such as a decorative background.

Skeuomorphs

Skeuomorphs are avoided. Seams and shadows may be used to provide cues to users about what is touchable. These could be considered skeuomorphs except that they are used for a functional purpose.

Philosophy

Flat design is more of a philosophy and style than a strict set of rules. As a philosophy, it embraces form follows function and doesn't decorate without a reason. As the name suggests, it makes no attempt to look multidimensional and produces interfaces that look much like a flat poster.
Overview: Flat Design
Type
Design Style
Definition
A modern minimalist style for information oriented user interfaces that embraces form follows function, simple native elements and practical design choices for a wide range of devices.
Value
Inexpensive designs that look good across a range of devices.
Easy to generate dynamically.
Focuses on content and function over superfluous decoration.
Related Concepts

Talent

This is the complete list of articles we have written about talent.
Area Of Expertise
Art
Character Building
Cognitive Abilities
Confidence
Creative Ability
Creative Traits
Creative Works
Creativity
Credibility
Data Literacy
Decision Making
Design
Design Thinking
Employability
Expertise
Gaming Skills
Influencing
Knowledge
Leadership
Meaningful Work
Personal Presence
Personal Resilience
Problem Solving
Professional Self
Professionalism
Public Speaking
Qualifications
Self Direction
Self Management
Storytelling
Strengths
Systems Thinking
Visual Design
More ...
If you enjoyed this page, please consider bookmarking Simplicable.
 

Design

A comprehensive guide to design.

Color Theory

An overview of color theory.

Layout vs Composition

The difference between layout and composition.

Modeless vs Contextual

The difference between modeless and contextual user interfaces explained.

Types Of Design

A list of common types of design.

Design Process

The steps in a design process.

Design Quality

The common types of design quality.

Universal Design

A definition of universal design with examples.

Sensory Design

A definition of sensory design with examples.

Emotional Design

An overview of emotional design.

Elegance

The definition of elegance with examples.

Visual Design

A list of visual design techniques, elements and considerations.

Color Harmony

Why colors match or clash.

Dominance

A design element that is meant to catch the eye.

Symmetry vs Balance

The difference between symmetry and balance.

Proportion vs Scale

An overview of proportion and scale in design.

Design Contrast

The basic ways to create contrast in a design.

Design Unity

The common types of design unity.

Visual Communication Examples

A definition of visual communication with examples.

Information Design

The common elements of information design.

Modern Design

The defining characteristics of modern design.
The most popular articles on Simplicable in the past day.

New Articles

Recent posts or updates on Simplicable.
Site Map