Follow Intuiface:
🡰 Back to Blog Home

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

This is the ninth article in our series about the top user experience trends of 2017 and how to implement them in IntuiFace.

User Experience Trend # 9 – Semi-flat Design

Semi-flat design: What is

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.


PayPal flat design logo

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.

Flat design GIF

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.

Dropbox using flat design on their website
‍Source :

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.

Flat design example
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.

Depth for a better flat design
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.

Preview of a responsive and interactive animation with Intuiface
Chloe Canella
Chloe Canella

Chloe Canella is the head of Digital Marketing at Intuiface. She has been with the company since 2011 and knows the ins and outs of SaaS and interactive technologies. Chloe's goal is to make sure that you succeed with Intuiface!

Guest Blogging
Interested in writing for our blog? Click the button below:
Write for us!

Other Articles

All Articles ➜

What's Intuiface?

The world's premier platform for creating, deploying, measuring, and managing interactive digital experiences without writing one line of code.