What Is Flat Design?Tuesday, April 29, 2014
Flat design is modern simplicity at its finest.
Web Designer Depot describes flat design as “characterized by an overall minimalistic look, bright but muted colors, bold — often retro — typography and simple user interface elements such as buttons or icons.”
Flat design is a logical response to the rise of mobile computing—smaller screens call for simpler designs. In fact, Apple recently updated the iPhone interface to a significantly flatter design. Before, the iPhone interface consisted of skeuomorphic design—drop shadows, gradients and artificial textures were used to give graphics a three-dimensional look. In the software upgrade, these embellishments were stripped out, resulting in a more minimalistic user interface. Check out Mashable's side-by-side comparison of iPhone iOS 6 vs. iOS 7.
Flat Design Characteristics:
- Two dimensional appearance
- Overall minimalistic look
- Heavy whitespace
- No embellishments – no drop shadows, no embossed effects, no gradients, etc.
- Crisp, clean lines—no feathered edges
- Simple shapes
- A lot of icons
- Bold use of color
- Increased use of simple typefaces
- Minimal use of elaborate typefaces
Sometimes, designers will combine flat design with skeuomorphic design—a trend that is called “almost flat design.” A popular "almost flat design" technique is to add subtle embellishments (like textures or gradients) to flat icons.
Flat design is a beautiful and simplistic way to breathe new life into your website. It’s also the key to creating a modern, up-to-date look. If you redesign your website this year, you should absolutely incorporate some level of flat design.
To truly understand the effect flat design can have on a website visitor, you have to see it for yourself. So take a look at these stunning examples of flat web design.
For more examples of flat web design, check out these sites: