Deconstructing Modern Flat Design
But how does it work? What gives it its magic? In this piece, we’re going to crack the face of flat design and see what makes it tick. We’ll analyze the core techniques and explore which techniques will carry over into the future.
What’s Inside the Flat Design Toolbox
1. Long ShadowsMost commonly used on smaller UI elements such as buttons, long shadows are created with a color tone that extends beyond a graphic illustration inside of a box.
2. Bright Color PalettesOne of the more fun things that has come from flat design is a re-emergence of color, specifically bright and bold color. Designers are using fun, vibrant hues in more ways than ever before.
3. Simple TypographyFlat typography is not just the use of Helvetica.
4. Ghost ButtonsDesigned as a transparent, yet clickable, element, ghost buttons provide a visual interaction cue without obstructing the UI design.
Because a ghost button is essentially an outline and does not look like an obvious button, it allows the background to share the focus. The ghost button first emerged against design patterns with high-color backgrounds, and has since evolved to work with images and a number of other elements. These simple buttons often include crisp typography that fits the flat aesthetic, which works particularly well when paired with minimalism.
5. MinimalismFlat design is innately minimal. After all, when the design isn’t meant to resemble a real-life counterpart (e.g., a notebook app looking like a notebook), you strip away a lot of extraneous texture. All that’s left is the content framed by colors, gradients, shadows, shapes, and other visual subtleties. Flat design, in essence, forces designers to be more creative by saying less – designing from the content outward, instead of fitting the content inside of a photorealistic framework.
Source : UXPin