9 Ways to Stop Designing the Same Old Stuff
By: Benek Lisefski
Tags: Design, Craft, Web Development, Creativity, UX

9 Ways to Stop Designing the Same Old Stuff

Last decade we reached peak homogeneity. Let’s mark the new one with an explosion of uniqueness.

Photo: Erlon Silva — TRI Digital/Getty Images

More than a year ago, in Boris Müller’s now-famous “Why Do All Websites Look the Same?”, he stated that today’s internet had become bland. That all interfaces are starting to look the same. Web design seems to be driven by technical and ideological constraints rather than creativity and ideas. He wasn’t wrong. Many others have noticed the same patterns.

It’s 2020 and uniqueness in interface design has only gotten worse. Through the maturation of UX design; the proliferation of templates, UI kits, and frameworks; and the stranglehold of data on design decisions, unique expression in websites and apps has been squeezed out in favor of the affordances offered by sticking with what’s expected.

This isn’t entirely bad. Design has become homogenized because those patterns have been proven to work. If design achieves its purpose, it’s good design.

But I can’t help but think that effective design and unique expression aren’t mutually exclusive. Innovation doesn’t have to be at odds with affordances. There must be ways to rise above the sea of sameness without compromising design performance.

How did we get to this place of interface blandness? And how can we break out of it? Let’s dive in.

Why do all websites and apps look the same?

To understand how to overcome this challenge, we must first appreciate how we got here.

Ten or 15 years ago, the web was still the Wild West. Mostly lawless, very experimental. We made sites in Flash with mystery navigations, sound effects, and gratuitous animations simply because we could. The technology was exciting and ripe for experimentation.

But then everyone got more serious. Websites went from being impressive extras to the necessary core of many businesses. And with that importance came a new level of expectation. Looking cool became far secondary to converting well.

The art of design got overwhelmed by data and the practicality of designing quickly at scale.

Content agnostic themes and templates

The proliferation of CMSs like WordPress led to a flood of websites based on mass-market templates designed to work for a wide range of uses, and therefore content-agnostic uses. This is their strength, but it’s an even bigger weakness.

A fundamental tenet of good UX design is an intimate connection between content and its form. When you separate the two, you’re creating a system that tries to standardize everyone into one structure rather than letting their needs dictate a unique set of design requirements. Function following form rather than form following function. That’s not design at all, and it’s created millions of websites that look similar and aren’t fit for purpose either.

Scalability and reusability

People started building much larger and more complex apps online, which necessitated systems that allowed for scaling. If everything is unique, it’s far too time-consuming to grow. So generic, but practical frameworks like Bootstrap caught on because they allowed people to build stuff quickly and at scale with less technical knowledge required.

Trendsetters like Google and Apple released well-documented design systems and guidelines, and then everyone started copying them (often at their client’s request) to fit in rather than swerving toward something new. It made life easier but allowed less room for differentiation.

Global trend amplifying bubbles

Go on Dribbble or Behance and you’ll find the homepages are full of the same superficial trends. Flat design, long shadows, glowing buttons, playful illustrations, or whatever the flavor of the week is now.

It used to be that design had regional flavor. You could tell the difference between Swiss design and Japanese, Danish, and Midwest American. For that matter, you could tell the difference between the look of a fashion brand, a tech company, and a small family business.

Now we all look the same places for inspiration, and those outlets amplify the most superficial and attention-grabbing trends across the globe in seconds. The internet has made the world of design much smaller.

Cheap stock everything

Tired of seeing the same Unsplash photos everywhere? (I’m guilty! There’s one at the top of this story.) Or the same generic stock illustrations of people at work on devices? Images speak a thousand words. If we’re all using the same images, we’re all saying the same thing. They are free or cheap, high quality, and easy to find. And they are killing the uniqueness of every project we use them on.

Data-driven design and affordances

Part of the maturation of UX design has been the integration of data into design decisions. Very little is left to instinct or guesswork when we can leverage user insights and analytics to decide which design solutions perform best.

When you see a landing page with a full-screen hero image overlaid with a buzzword-heavy introductory statement and a single call-to-action button, it looks the same as every other landing page simply because that formula has been proven to work. Why reinvent the wheel when the ones we’ve got work well?

Logos top or left, nav links horizontally across the top, hamburger icons in the corner, tab bars along the bottom: Users have learned to recognize these patterns over years of repeated exposure. Their reliability has created affordances that help us know how to use something without having to think much about it. Deviating away from those accepted patterns is seen as too great a risk. Performance dominates creativity.

Responsive design laziness

Before the popularity of smartphone screens, web design was far more like print design. You could pick a fairly standard canvas size and design a single experience that nearly everyone would see in the exact same way (unless they used Internet Explorer, in which case it was usually broken). This freedom allowed for greater experimentation.

When responsive design became a necessity, suddenly every interface had to be a fluid system of design “reflowing” into infinite, different-sized containers. This added a new layer of constraints and made good web design far more difficult. Naturally, designers looked for shortcuts.

Whether designing “mobile-first” or not, content started assuming patterns that would easily reflow into a single column. We reused these patterns over and over again without scrutinizing whether that delivery of content was actually optimized for a mobile/touch experience. Or, for fear of making responsive design too hard, we made everything very mobile friendly at the cost of not giving more to large-screen users on high-speed connections.

In short, we took the lazy path, and that meant someone on some device was getting a less-than-optimal experience. A more boring one, too.

Why is design sameness a problem?

Because every company and every user has different goals and needs. There are no one-size-fits-all approaches that can cover the diversity of what we want to achieve online.

When everything looks the same, nothing stands out. Nothing is special. Does your brand want to blend into the crowd of website sameness, or rise above it by breaking new ground and kickstarting new trends?

We’ve been scared to take that avant-garde position for fear of sacrificing affordances for style. But these things are not as mutually exclusive as we’ve been led to believe.

I argue that the day of bland, but successful enough websites and apps is coming to an end. The no-code/low-code revolution combined with A.I. means creating professional-looking, but generically designed interfaces is easier now than ever before, while ironically, the technology exists to do more interesting and experimental stuff online than we thought possible even a few years ago. We are living in a golden age of design and user experience opportunity, yet most of us are squandering that potential through data-driven sameness and lazy design masquerading as efficiency.

As Boris Müller says:

We can do everything in a browser. From massive-scale layouts to micro-typography, animation, and video. And what do we do with these incredible possibilities? Containers in containers in containers. Gigabytes of visually bland mobile-first pages contaminated with JavaScript. Generic templates that follow the same visual rules. If my younger self could have seen the state of web design 23 years later, he would have been very disappointed. Web design’s problem is not the limits of technology but the limits of our imagination. We’ve become far too obedient to visual conformity, economic viability, and assumed expectations.

After years of design style convergence, the 2020s will be the decade with a mature enough design ecosystem to allow uniqueness and innovation to flourish in a sustainable way. Success will no longer be guaranteed by how well you step in line with established trends but driven by how you differentiate.

Weapons to fight design sameness

It’s easy to get stuck in our ways, to reuse the same processes, to duplicate proven solutions rather than interrogating if there’s something better. It takes a conscious effort to keep our design thinking fresh. Here are some ideas to try.

1. Get broader inspiration

We need a much larger view of the design world than what’s trending on Dribbble. Look at TV and gaming. Book covers and magazines. Fashion and vehicle design. Architecture and industrial design. Get engrossed in nature. Study design history rather than what’s been popular in the past year. A broader base of inspiration creates a greater variety and more timeless design.

2. Educate your clients

How does the old saying go? “If I had asked people what they wanted, they would have said a faster horse.” Well, Henry Ford didn’t build horses because he knew of a better combustion-powered future. Your clients may want the same horse they saw their neighbor prancing around on. It does look fancy, after all, but is it what their business actually needs? You might be the one to open their eyes to innovate rather than duplicate.

3. Follow trends so you know when to break them

Don’t abandon Dribbble entirely. Staying aware of what’s popular is necessary if you want to buck the trend. Study why people get engrossed in certain design solutions so you know how best to deviate when it’s time for differentiation. As Hilary Archer said:

Being aware of these trends can help designers move in a different direction and try new things. Awareness of trends can help us to respond to a brief in the most appropriate way — step in line or swerve.

4. Pivot toward bespoke design

If your design business plan relies on cranking out slightly customized WP template sites, you’re part of the problem, not the solution. A.I. will be taking that job anyway, so the prudent move is to shift toward strategic UX thinking and custom design services.

5. Think before you stock

Not every project will have the budget, but you might be surprised at how effective it is to commission a few custom images to make a design really sing. Whether you art-direct a small photoshoot or collaborate with a colleague on new illustrations, where your brand and key selling points are concerned, avoiding stock is an easy ticket to unique expression.

6. Experiment with tech

WebGL, variable fonts, video, CSS animation, image recognition, NFC, Javascript trickery. There’s little we can’t make happen on the web or in apps these days. Don’t be afraid to design something you’re not sure how to build, and push development to catch up. If we all play it safe, we’re designing the same way we did five years ago. Your work may be outdated the second it’s live.

7. Question your assumptions

Before you go reaching for those geometric Grotesk fonts we all love, consider whether something with more character might better suit your message. Keep using that flexible 12-column grid that works so well, but explore how often you can break it to create variety in scale and alignment rather than walking the same line every time. Take the time, if only a little, to experiment free of constraints and assumptions. You may validate that what you assumed was best all along, or you may discover a fresh take on an old problem.

Go the extra mile to make something special as often as you can, even if it’s not the easy path.

8. Practice real responsive design

Even if you don’t use a mobile-first approach to every project (I sometimes don't), put responsive design at the core of your thinking and never an afterthought. Make it not about “How can I fit this same content in a narrower viewport?” and more about “What about this experience needs to change to make it purpose-built for a great mobile experience?”

9. Go the extra mile, but accept when you can’t

If you truly want to break free from design sameness, it may require a bit of sweat and extra money. A few more hours of experimentation, or an extra phone call to convince your stakeholders. Take that chance. Go the extra mile to make something special as often as you can, even if it’s not the easy path. You’ll never regret it.