IntuiFace and the User Experience Trends of 2017 - Trend #9: Semi-flat Design

User Experience Trend # 9 – Semi-flat Design

Semi-flat design: What is
it?

We all probably know that the world has said goodbye to the realistic design trend and welcomed flat design which, well, flattens every design we see nowadays. It’s been a disruption, seeing even top brands including Netflix, PayPal, Virgin Media etc., redesign their logos. No more realistic 3D looks with gradient colors and curvy fonts, these new icons are minimalized, light, clean, quick to grasp and much more responsive.

Despite all of its advantages, flat design - dominated by general rules such as 2D illustrations, crisp edges and monochromatic color palette - might appear boring. As there is no Z-axis, the clickable elements are much harder to discover and people can have trouble detecting the visual hierarchy of an illustration.

Fortunately, people have found a way to limit these disadvantages thanks to the influence of Material Design, Google’s new design language. By adding some Material Design characteristics such as the use of transition animations and depth effects such as lighting and shadows, flat design gains a subtle depth which cues analogies between the design and the physical world, easing their comprehension. This improvement is referred to as semi-flat design, or sometimes almost-flat or Flat 2.0.

‍

Semi-flat design: When to
use it?

If you want an old-school look for your design, go for realism. Realism has not peaked so you can still pull it off. However, if you are a fan of simple and minimal designs, we suggest you add more dimension to your project using subtle shadows to add a dash of complexity while still keeping the clean feeling of a flat design. That’s when semi-flat design takes place.

Semi-flat design: How to
use it in IntuiFace?

Keep things simple but do not go to an extreme:

We don't want to destroy the clean feel of
the Flat Design. Therefore, retain key characteristics such as monochromatic colors, crisp edged buttons, open spaces and simple typography. However, do not limit yourself to only basic colors. On the contrary, bright and vibrant colors with different tints and shades will make your experience much more eye-catching and memorable.

Add depth: 

Some subtle inner or outer shadows for your key assets and buttons are welcome! Actually, a long shadow effect with 45 degree angle and big size are currently in vogue, an effect that makes your assets feel much more 3D while still being flat.

Rock with responsive animations and transitions: 

When building an interactive experience with IntuiFace, visual responsiveness is extremely important. For example, when a user touches a button, s/he would expect a visual response from that button. To solve this particular case, use the Image Button instead of a regular image. In addition, IntuiFace also provides you with tools to create your own desired animations so don’t be shy about providing visual feedback through animation.

‍