Design Beyond The Trend

TLDR: Doing anything the right way—especially design—requires discerning thought and practical knowledge of current & past social movements, as well as a thorough understanding of the personality and needs of the brand you’re working on. Sprinkling some java script for funsies without fundamental substance is a lipstick coverup for a lackluster designer.

——————

We all see the lists at the end of the year chock-full of all the “must-know” trends for the coming year. Many web dev, UI, and front-end design bloggers alike race to share what’s hot and not-to-be-ignored. We read, we absorb, we abide — and we kind of self-fulfill the prophecy, right?

Psh.

While there are obvious and important reasons to know current trends, there is a different school of thought in applying said trends. Before we jump into this opposing school of thought, indulge me on the following analogy:

A Trend Designer is to Web What a Velour Tracksuit is to 2002.

Yes, J.Lo tried to make it work. Yes, P. Diddy and Eminem jumped on board. Yes Brittany & Justin tried to #justify how comfortable these body-odor-trapping fabric bags were. But to no avail — the velour tracksuit trend was short lived and we look back now from arms length to shudder at the sight.

Tying it together here, stick with me:

Don’t wear a velour tracksuit just because Brittney is wearing a velour tracksuit (who we now know was amidst a major mental breakdown during that lapse of judgement so we’re giving her a pass). Popularity and necessity aren’t mutually exclusive. So don’t design on trend just for the sake of being on trend. Sure, it might feel comfortable to do what everyone else is doing. Sure, it might seem like you’re on track if you’re on trend. In some cases, this might hold true. More often than not, though, we see over eager designers splashing parallax and micro interactions all over their sites like Jackson Polluck slaps paint at a garage floor because they heard it was “the next big thing”.

Look, we get it. Your site has depth, bro. But before you slather more carousel sliders and parallax on your next homepage, let’s talk about how to do it the right way. A hint: it’s going to require using that big, beautiful noggin.

Below is a guide in navigating the murky waters of trending visuals and design decision making.

1. Form Follows Function

First things first: What does the site need to do for users? What is its primary function? If the point of the site is to showcase innovative mountain bikes, then it makes sense to visually entice the user. It makes sense here to focus on helping the user see and feel how the product will excite their lives. This is a big yes on visual depth & rewarding interactions. Go ahead and overlap an isolated product shot on top of a beautiful mountain scene. Parallax the F out of that and heck — throw in some dynamic hover states to reflect how explosive that product can be out on the trails.


On the contrary: if the purpose of the site is to get the user to a point of purchase (e-commerce) – don’t make them side-scroll through a 10-paragraph story line with heavy images and lock-in viewports to get there. Few things frustrate a scroller more than feeling forced along a long and winding path to the point. Users want to feel in control of their experience when they’re spending their hard-earned cash. Don’t make them feel duped by bogging down their experience with frills. Get them from A to B. Provide a map for extracurriculars if they please, but don’t force it or they likely won’t convert.

2. Purpose

You might be thinking: Wait, there’s a difference between function and purpose? Yes, friend. Yes there is. Think of function as a utility. Think of purpose as a But-what-does-it-all-mean, Basil?! moment in the concepting/wireframing stage. Purpose really is an essence driven thing that always points back to the core of why you’re doing what you’re doing in the first place. Knowing your brand’s mantra, positioning statement, and/or brand purpose is very important in this decision. For example, Apple has a brand purpose of making your life easier, seamless, and more accessible with their products. Apple is equipped with some of the finest designers, brand strategists and developers in the world—yet when you land on their homepage you aren’t assaulted with 8 carousel images you’ll never look through. You also might notice the lack of layering, parallax, and visual dimension. Doesn’t mean that carousels are passe`, nor does it mean that visual layering is a bad idea. It means that Apple thought this through:

Apple brand purpose: make your life easier, seamless and accessible with their products

Apple site visuals: easy-to-navigate, seamless visuals, accessible product portfolios

Driving it home here: Apple has embodied their brand essence values in their site design. They could have thrown in a hundred bells and whistles — but it wasn’t true to their purpose.

To reference the stellar tracksuit analogy above: maybe you really loved velour track suits. That’s fine. But you wouldn’t wear one to wedding, would you? A funeral? That track suit is just an accessory of expression — a small piece of the pie in your personal purpose. Maybe that tracksuit is comfy AF on your couch at home binging Netflix (re: function), but your purpose extends well beyond that velour…what was it again? Oh, yes… that velour body-odor-trapping fabric bag.

3. Tough Love: Are You Overcompensating for Lack Of Creativity?

You know that guy who drives a chromed out black Chevy Silverado complete with lift kit, mud rally tires and top-spout exhaust pipes? Yeah you do. That guy is a textbook microcosm of self doubt and false confidence.

In the design realm I equate this to trendy designers whose portfolios are littered with Lost Type fonts and cross-hatched arrow motifs. This doesn’t mean they aren’t good people. It doesn’t mean they don’t have something going for them. It means that they’re struggling (for various reasons) to find creative solutions and are leaning on trendy motifs to carry them through to the next paying gig. It’s kind of understandable, but it’s cheap, it devalues all of the hard work good designers are doing, and it’s definitely avoidable. It usually happens because designers aren’t spending enough time in the concepting and wireframing stages of a site. It’s becoming more and more common for designers to hop right into the design phase without true creative thought. Before they know it, they’re knee deep in a layout that the client isn’t digging (probably because it’s lacking in flow or function since it wasn’t hashed out on the front end), so the band-aid solution is to sprinkle some extra hover effects in and hope for some wow factor. This is BAD PROCESS and can cost a lot of money in revisions and rebuilds later in the game.

Avoid this misstep by thinking creatively to find solutions on the front end before you dive in to design embellishments. Similar to painting on a canvas (here’s looking at you, Bob Ross), always start with brushing out large blocks of color before going back in with your detail brush.

Making The Call

Whether you’re reading this as an art director, UI designer, visual designer, developer or some weird small-agency-hybrid of them all — building time into your project process to address all 3 of the topics above is imperative to doing good, value-based design. Value designers are becoming harder to find as we slip deeper into a “what’s the next big thing” tech-driven world. But when you’re in the business of brands (and who’s not?) those value designers are a commodity that we need to cultivate and keep alive.

Why? Because Science. Studies continue to show that consumers are more discerning than ever and expect a seamless, positive experience when choosing a brand, service or product. If they don’t get it, they know they have other options out there. Creating a pleasing digital experience is more important than ever to stay competitive. As marketers — that is old news. To brand execs? It can be an intimidating red flag urging them to do more awesome, trendy, state-of-the-art stuff to edge out the competition. It’s our job as designers and directors to manage this expectation from the client in a way that balances true brand purpose with current tech capabilities — reminding them that function and purpose is paramount and a well designed site may or may not need all the bells and whistles.

Where as a site for Tesla can purposefully pack in a slew of energetic video reels, 360 degree product rotations, and saucy directional animations, that level of energy might not make sense for a brand like Air BnB – whose goal is to extend the purpose of comfort and the ease of functionality. It’s all about purpose, relevance, and making the viewer feel like they’re in a exclusive brand environment created just for them.

Ultimately, when you’re making the call on whether or not to animate, illustrate, photograph, custom-code or plug-in-play something you thought looked cool on Code Canyon, you need to ask yourself if it’s true to the brand. If you get through all the points listed above and you’ve still got a solid case for a design motif or cutting-edge css styling, go for it! As long is it provides value to the experience, not just aesthetic. Follow this code of conduct and you’re in the clear.

– – – – –

About the author: Meg Wagler is an art director and illustrator with a BFA from Missouri State University. She has 9 years of working experience, 2 kids, 2 letterpresses, 1 husband, 1 scared GoldenDoodle, buckets of sass and a strong desire to do stuff.

We are a strategic team driven by passion & curiosity
Our ability to blend creativity, communication and technology is the key

to what we do, and is crucial to surviving the ever-changing landscape we

happily navigate our clients through.
Our ability to blend creativity, communication and technology is the key to what we do, and is crucial to surviving the ever-changing landscape we happily navigate our clients through.

Your digital strategy is vital to reaching your audience.

See how we can help you connect.

417.868.8378
Contact Departika

210 West Commercial, Suite A | Springfield, MO, 65803