3 essential design trends, November 2014

Default avatar.
November 28, 2014
3 essential design trends, November 2014.
Trends are the sort of thing that come and go, we all know that. At times we even start to consider the fall of a brand new design trend because we know the trend will eventually be a thing of the past. And yet, in the moment of the trend it would seem that it perfectly represents the time. I have been writing about web design trends since 2007, and I can honestly say that every trend seemed appropriate for the time. That is to say, trends never feel forced, they always feel great, like a perfect form that seems to represent the best that we have to offer. And this brings us to today, not tomorrow, or yesterday. What is the state of trendy design as it stands today. I want to briefly look at 3 different visual design trends that are the "go-to" styles right now.

Semi flat design

There tends to be a consensus that pure flat design has passed its prime time in the spotlight. We have entire showcases of flat design, we have mastered the art of flat shadows and we of course have mountains of beautiful (yet often times generic and without purpose) templates to select from. In my opinion flat design can be really gorgeous, but also really generic when used in its purest form. I don't think I am alone in this opinion, given the natural way this trend is progressing. It would seem that the pure flat design phase really was an overreaction. But through that cleansing process we gained something really great — a new found appreciation for minimalism. As we move forward, and this is where we stand today, we find flat design at work but with a dash of realism, dare I even say hints of skeuomorphic design. Let's look at some examples to see what I have in mind.

Google Material Design

01-google Perhaps the most powerful example of this is the Google Material Design specification. Through the style is essentially flat in nature, we find hints of depth subtly woven into the specification. In the example above we can see that the buttons have a subtle shadow to them. We can vividly see how this hints at their functionality. Some might call this skeuomorphic, which I suppose it is, but more importantly it is an affordance to what the element does. It is something to push or click, and the shadow hints at that.

TheDash.com

02-the-dash This web utility for creating online dashboards blends flat design has hints of flat design elements. The primary style at work here though harkens back to an almost classic Apple look. It certainly feels more skeuomophic, if only due to the heavy use of gradients. But the technique is anything but random. Note how all of the key elements are treated with this more dramatic style. This pushes those key elements to the foreground. Interestingly the actual dashboard interface uses this same style, but in a much more subtle way. I challenge you to consider how flat and non-flat design styles can be blended to achieve clear and effective communication in your design.

Images as backgrounds

A simple design element that seems to be entirely out of control is the use of large background photos. In my obsession with web design I have observed this style at work on thousands of sites. I could probably write an entire book on the topic. The biggest learning point I have noticed is to have a purpose. Don't just throw in a photo because it looks cool. Which is actually easy to do with sites like Unsplash.com giving away mountains of insanely yummy photos. And while I agree the results can be really pretty, I think the photos often fail to communicate something meaningful. This is actually a reason that many themes up for sale look so appealing. They rely on gorgeous photos that bring the life to design. Until you replace it with your photos, then all the sudden the design tanks. In many ways it was built on a flimsy idea. This is akin to the pig that made his house out of straw (my kid's obsession with the three little pigs is on my mind). In contrast, we want to build our house out of brick, so it can stand the test of time, content and purpose. Let's review a few samples that accomplish just that.

ModernThemes.net

03-modern-themes This lovely example would seem on the surface to follow the trend blindly. Except for one huge detail that transforms this into a powerful demonstration of how to really use this style. The background photo not only fills the background, but the content is part of the foreground as well. By showing one of their themes displayed beautifully on an iPad it is implied that their themes are responsive in nature.

Credencys.com

04-credencys In this example we see a similar approach at work. Though in this case I suspect the foreground and background images were merged together. All the same, the results work in the same way. It comes off as a single image. And more important than that, both elements (foreground and background) communicate important information. The background informs us of the context in which the app is used, and of course the foreground shows us the actual app. This is anything but meaningless or random.

The hipster

The hipster style is another trend that is at a turning point. The hipster style is a close cousin of the two previously discussed styles. Most often it relies on flat design elements, background photos with a dash of mixed typography (multiple fonts used together) and some decorative elements. Since so much of this article is about the evolution of design styles it makes sense to consider how the hipster style is evolving. Let's dissect a few examples to see how it is being put to work.

Coffee beans delivered

05-coffee-beans Here we see the hipster style in full force. It even has a logo that feels plucked from one of the many hipster style logo templates that are so popular. On the one hand it is a trendy design, giving it a fresh and modern feel, which happens to reflect in a positive way on the brand. But I think there is something bigger at work here. By reflecting a hipster style they set themselves apart from the many mega brands. In a way they are embracing their smallness (which happens to be a classic marketing strategy by the way).

V76.com

06-v76 In other situations the use of a trendy style is purely an effort to stay relevant. The fashion and personal care industries have long embraced this approach. In this case, a trendy hipster style site simply says we are alive and aware of where the world is. We have a product that we believe fits in, and we are positing it to be hip and trendy. I guarantee if the world changed tomorrow and a new style emerged, they would eventually redesign the site to fit the new paradigm. In some cases, trendy design is just that, trendy.

Conclusion

I think the overarching theme, or trend here, is that meaningful and intentional design will never be outdated. Styles and trends may come and go, but we can easily move along. In so many ways the real goals never really change, though the brush we paint them with does.

Patrick McNeil

Patrick McNeil is a designer, developer and writer; but above all things he is a passionate educator. He is a Professor of Graphic Design at the University of Missouri St. Louis where he focuses on teaching UX Design methods and front end development techniques. Patrick is also the author of the bestselling book series The Web Designer's Idea Book and the curator of DesignMeltdown.com. For more information about Patrick visit his personal site, pmcneil.com, or follow him on Twitter @designmeltdown.

Read Next

3 Essential Design Trends, May 2024

Integrated navigation elements, interactive typography, and digital overprints are three website design trends making…

How to Write World-Beating Web Content

Writing for the web is different from all other formats. We typically do not read to any real depth on the web; we…

20 Best New Websites, April 2024

Welcome to our sites of the month for April. With some websites, the details make all the difference, while in others,…

Exciting New Tools for Designers, April 2024

Welcome to our April tools collection. There are no practical jokes here, just practical gadgets, services, and apps to…

How Web Designers Can Stay Relevant in the Age of AI

The digital landscape is evolving rapidly. With the advent of AI, every sector is witnessing a revolution, including…

14 Top UX Tools for Designers in 2024

User Experience (UX) is one of the most important fields of design, so it should come as no surprise that there are a…

What Negative Effects Does a Bad Website Design Have On My Business?

Consumer expectations for a responsive, immersive, and visually appealing website experience have never been higher. In…

10+ Best Resources & Tools for Web Designers (2024 update)

Is searching for the best web design tools to suit your needs akin to having a recurring bad dream? Does each…

3 Essential Design Trends, April 2024

Ready to jump into some amazing new design ideas for Spring? Our roundup has everything from UX to color trends…

How to Plan Your First Successful Website

Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an…

15 Best New Fonts, March 2024

Welcome to March’s edition of our roundup of the best new fonts for designers. This month’s compilation includes…

LimeWire Developer APIs Herald a New Era of AI Integration

Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…