Making Flat Design Usable

There are a lot of potential benefits for flat designs. They tend to be cleaner, they tend to have lower information density, so they tend to be easier for users to understand and to process. Unfortunately, a lot of times when flat designs are implemented, designers tend to make a few mistakes. So, for example, they’ll do things like taking the signifiers out of the interface. Those are the clues that let people know how to interact with the system. When that happens, that leads to confusion. And that’s what gives slot design a bad name. Now, what if you want to implement a flat design, but you want to avoid some of those negative side effects on your usability? Well, I have a few tips for you. First, be consistent. Whatever visual treatment you decide to use for your clickable, your Topal, your linked elements, make sure you’re consistent in the way that you use them. So, for example, you would never use the same visual treatment for static text that you do for linked text.

Second, try to use traditional layouts and patterns as much as possible. So if you have a traditional layout for your site and maybe is something that users would have seen on other sites of the same type, then when they arrived to your site, even if you have a different visual design, it’s going to be easier for them to apply that existing knowledge and figure out how to use your site and interact with it. Third, pay attention to contrast. A lot of times flat designs tend to use like light gray text on a light gray background. They tend to like that because, again, it contributes to that cleaner esthetic. The problem with that is that users are less likely to notice text like that. They may have difficulty reading it and may not be legible, but even if it is, it’s not going to be very noticeable. So they’re going to have a hard time finding it, if that’s what they’re looking for. And if it’s something you want your users to notice, it’s less likely that they’ll see it. Fourth, don’t be afraid to use depth. Don’t be afraid to add back in some depth to your UI. You don’t have to go with a totally flat UI. Look at Google’s material design. You can use a little bit of shading, a little bit of shadows and texture to create a layered metaphor which can really help users a lot. And five, don’t be afraid to link things when in doubt, link it out. So if you have a something like a heading that you think users might think is linked, they might try to click it, just make it linked. And that’s to help avoid the negative experience that some users have in flat designs for they think that something is going to be linked. They try to click or tap it and they find out that it’s not.

Leave a comment

Your email address will not be published. Required fields are marked *