Starting Flat

Flat vs Non-Flat UI and what’s between them

Seif Sallam
Mr. Moleskine
2 min readAug 21, 2015

--

Posted December 19, 2012

Many designers and non designers associate Flat with simple and Textured with Complex UI. Having flat UI doesn’t mean it is easy, and having complex UI with textures doesn’t mean it is hard, all it gets down to. It depends on how you organize your UI. Flat & Non-flat is just a preference.

Why Start Flat?

Flat is awesome for startups with small budget and tight schedule as they don’t take much effort to setup, and whether you are developing or other are implementing your design, it is a lot easier to just go with flat. That doesn’t mean you should use flat because of that, it means you should just be careful with every pixel you add, because it will add an overhead on you to maintain and you can easily confuse users with cramping UI and lots of glossy effects that have no good effect on the user.

Think of it as a mockup, build your whole UI in a flat sense use just rounder corners as buttons, put text without drop-shadow, build in a gray scale. Focus on IA first then move to typography and colors.

Only add when you need to

Does it work? Do people understand every UI element’s purpos? Do people understand that these are buttons and these are links? can they read the text or is it too small for them? If people understand everything, you are good to go, if not try adding more effects, making for example button in gradient, or making it 3D, maybe adding some dropshadow for small text that can be hard to read unless you add drop-shadow.

The process may seem tedious, but its important to understand every pixel you put, adding drop-shadows all over the place with Photoshop or CSS, doesn’t make you a good designer, understanding the reason behind adding those effects is what makes you a better designer.

Originally published at seifsallam.com.

--

--