3 Essential Design Trends, October 2017

Carrie Cousins.
October 02, 2017
3 Essential Design Trends, October 2017.
Every designer loves breaking the rules every now and then. This month’s web design trends highlight some of the rebellious spirit in ways that look amazing. The key to all these rule-breaking designs is that the rest of the interface is simple and actually follows the rules. From text that doesn’t stay in its “container” to oversized design elements to odd ball geometric shapes, let’s walk on the wild side… Here’s what’s trending in design this month:

1. Text Without Boundaries

There was a time that every element in a website design had its own place. That’s not always the case anymore. More designs are allowing elements to cross planes and move into the space of other elements. It sounds like one of those ideas that could go horribly wrong (and it could), but these websites show that there’s something beautiful about text that lives in two spaces at the same time. [pullquote]there’s something beautiful about text that lives in two spaces at the same time[/pullquote] The trend is exemplified by text elements that cross into multiple containers, such as text that layers over the background and an image. It can also apply to lettering that layers partially over two different boxes, such as Tradewinds. It can work with typography of any size and shape and images or video. The one consistent theme is that text elements must have a lot of contrast with background elements so that every letter remains readable. You can see from the examples below that lettering doesn’t have to stop between words; it can be broken up vertically or horizontally. The big idea behind this treatment is to draw the user into the page with something totally unexpected. This style of lettering does that. To make it work, treat the text element as a separate layer over background and image layers. Text should always be the uppermost item to help ensure readability. Stick to typefaces that are sharp and easy to read. Simplicity in the rest of the design is key to making this technique work. matter epicur tradewinds

2. Larger Than Life Objects

Oversized design elements are nothing new. But more designs are taking everyday elements and showcasing them in larger than life styles to grab the attention of users. It’s a fun technique that requires a lot of detail for the imagery involved. It’s also takes the right kind of image—and an excellent eye for cropping—to make this work. Look at the examples below. If someone had told you the screen would be filled with half a pair of glasses, a faceless moustache or a single video of an eye would you have imagined the striking success of these concepts? Each is a great example of rule-breaking in a way that’s totally unexpected, original and contributes to the messaging of the brand and overall design. The thing that is challenging about oversized and larger than life design elements is creating balance. Large objects need plenty of space and balancing elements so that the design doesn’t feel odd or jarring. Westward Leaning does this with plenty of whitespace around the eyeglasses image; Famoustache uses bright color and fun typography to offset a “floating,” animated moustache; DTSi uses large text and geometric shape layers to soften the eye video. The key to making a larger than life element work is quality. Images and video have to be top resolution. Oversized elements are not forgiving if they aren’t sharp and perfectly in focus. You’ll need high-resolution video, or photos and vector elements for this technique. Even the lighting and composition of something as simple as a pair of glasses has to be perfectly thought out so that it doesn’t feel off to the user on the screen. Highly-detailed images such as this are nice for providing information to users—especially for ecommerce where users can almost “touch” the object—but it can be tricky to do well. wl stache dtsi

3. Hollow Shapes

Designers have fallen in love with geometric shapes this year. From shape overlays to polygon patterns, this monthly feature has centered on shapes a few times. And now designers are trying something else new with them, hollowed out shapes. For logos, icons and geometric displays, hollow shapes are an interesting design element. Generally, they are quite simple in nature, such as the hollow geometry used by Bruderl, but can also take on more complex roles such as the icons for Borderfree, which contain more detail. [pullquote]hollow shapes are fun because they can be used in space to create a focal point[/pullquote] Either way hollow shapes are fun because they can be used in space to create a focal point, as an overlay on an image or as part of a company logo or branding, or two create a set of visuals that have a consistent feel throughout a design project. To make the most of hollow shapes, create something that has a thick enough stroke that it can stand up on top of different backgrounds and different types of coloring. While you can create your own funky shape, such as some of those below, you can also use common elements to outline. What makes hollow shapes work is visual interest or identification, meaning the shape has to be really unusual or completely clear to grab the attention of a user. Consider a combination of hollow areas balanced with some fill, such as Cwart, to create contrast and more interest. The most difficult part of using a hollow shape design is that they can often feel too light and get lost in proximity to other design elements. The shape has to be clear enough, larger enough and have thick enough lines to convey meaning at every size users encounter it. bruderl cwart borderfree

Conclusion

Design rules exist as a starting point for creation. While you don’t want to get in the habit of ignoring these guidelines—you can end up with a design disaster—breaking a rule here and there can help you create something special. Just remember to use this idea sparingly and understand that it won’t work for every project. What do you think of these rule-breaking trends? Would you try them? Hit me up on Twitter and let me know.

Carrie Cousins

Carrie Cousins is a freelance writer with more than 10 years of experience in the communications industry, including writing for print and online publications, and design and editing. You can connect with Carrie on Twitter @carriecousins.

Read Next

6 Best AI Productivity Apps in 2024

There’s no escaping it: if you want to be successful, you need to be productive. The more you work, the more you…

3 Essential Design Trends, February 2024

From atypical typefaces to neutral colors to unusual user patterns, there are plenty of new website design trends to…

Surviving the Leap from College to Real-World Design

So, you’ve finished college and are ready to showcase your design skills to the world. This is a pivotal moment that…

20 Mind-Bending Illusions That Will Make You Question Reality

Mind-bending videos. Divisive Images. Eye-straining visuals. This list of optical illusions has it all. Join us as we…

15 Best New Fonts, February 2024

Welcome to February’s roundup of the best new fonts for designers. This month’s compilation includes some innovative…

The 10 Best WordPress Quiz Plugins in 2024

Whether it’s boosting your organic search visibility or collecting data for targeted email marketing campaigns, a great…

20 Best New Websites, February 2024

It’s almost Valentine’s Day, so this latest collection is a billet-doux celebrating the best of the web this month.

Everything You Need to Know About Image Formats In 2024

Always trying to walk the tightrope between image quality and file size? Looking to branch out from JPGs and PNGs this…

The 10 Best Logos of 2023 - Ranked

From vintage aesthetics to innovative new color schemes, we’ve seen a lot of creative logo designs this year. In this…

Exciting New Tools for Designers, February 2024

2024 is well underway and shaping up to be an interesting year. So, to help you keep your focus on working hard and…

The Art of Engineering AI Prompts

In the rapidly evolving world of artificial intelligence, the ability to communicate effectively with AI tools has…

15 Best New Fonts, January 2024

In this month’s roundup of the best new fonts, we find a large number of vintage, retro, and revival typefaces. Is it…