Good Design vs Bad Design: 7 Examples to Learn From

Does the quality of the design always depend on the subjective opinion of the person who evaluates it? Studying examples of bad design in parallel with good ones is not only interesting, but also useful. They highlight all the pitfalls to avoid and help you understand how to translate design theories into effective solutions. In this article, we look at seven examples of bad design, show similar working designs, and share helpful insights from the team.

Good Design vs Bad Design: 7 Examples to Learn From 20
Examples of good designs from Fireart

How to Determine Good Design vs Bad Design?

The need for a fantastic design solution is always caused by the user’s problem that needs to be solved. This may be a website or an app that demands clear and easy UX/UI, a product that attracts a specific audience, or a new business that needs a great logo and branding design process. Let’s find it out by making clear what bad design vs good design here means.

And the good vs. bad design will be the primary property for determining the success for any project. If it does not solve the problem, you may not go on with it – the design is bad and may cause you a market failure. It does not matter how well it looks if it does not fulfill the main goal – to satisfy the users’ demand. However, the beauty of design that may be translated via incredible animation, graphics or motion cannot be neglected. So, a compromise is what you need.

Good design is:

  • Design with artistic language and a great message,
  • Design that narrates,
  • Design, which is 100% understandable to the target consumer,
  • Design that may trigger positive emotions,
  • Design with great UX/UI components.

Besides, great design is created keeping in mind that the customer, in most cases, is not always a consumer of a certain product. And the owner is not the customer to dictate anything either.

5 Great Graphic & Animation Design Examples

Graphic design as a form to organize your product data should be semantically true, syntactically constant, pragmatic, and easy to understand. When you apply animated design to your website or embed a video, it must be organic and cater to the idea behind an entertaining or engaging function. You must remember the principles that make the design both visually attractive & highly functional. You will find some elements in many examples of bad graphic design and good vs bad graphic design here:

1.     Data overload

Designers often face situations where they must display a lot of information in a small space, such as when designing mobile apps. Superfluous data all over the website, app, or any other piece of design is bad. You don’t have much time to explain what you mean to your user, so you need to get to the point quickly. Massive checklists, jargon, lots of pop-ups, or blurred explainers just won’t do. Don’t bother the user with the superfluous data anyways.

Instead, make sure your platform discoverability is just fine, and it’s clear as glass to understand and interact with:

Source: Dribbble

2.     Mystery Meat Navigation (MMN)

With regard to unsuccessful web page designs, Mystery Meat Navigation (MMN) refers to cases when the exile of the link is not displayed until the user clicks or hits the cursor on it. MMN is bad in that it reduces the possibility of detecting navigation elements, so better avoid it.

Instead, develop designs with simple and clear navigation:

Source: Dribbble

3.     Expectation time

A few seconds of expectations can lead to much worse UX. Imagine that you will have to keep each link in your browser for several seconds just because the concept is as it is. After several clicks with a mouse, you just leave the Internet, that’s all. So, stop bothering users by wasting their time by offering to wait too long for loads or making extra actions to expect the feature, etc.

Instead, apply elastic scrolling and speed up the processes or introduce the data with effective motion design or animation:

Source: Dribbble

4.     Ugly designs

Sometimes an ugly extravagant design can damage UX. This mistake is even more dangerous because designers like to create abstruse projects stuffing them with lots of flamboyant, trendy elements that may hurt the eye, not to mention their poor functionality.

Instead, stick to classy minimalism, or at least use its elements to make it easier:

Source: Dribbble

5.     Excessive animation

Animation is an essential element of interaction design, but it should always serve your project’s primary business goal, not just blinking everywhere where it fits. Unfortunately, designers often forget about this.

Instead, remember that users come to websites for a specific purpose. And you need to provide what they need asap and never delay them in achieving the goal. For this, offer compelling short explainer videos with the top-notch beautiful and functional animated elements as good design examples:

Source: Dribbble

6.     Excessive friction

Adding a few seconds of friction to each action can lead to a significant deterioration in UX. Imagine that instead of instantly loading a page, you need to click and hold for two seconds on each link in your browser. After several such clicks and holds, you will completely stop using the Internet.

Instead, elastic scrolling, like on iOS, is a way out.

Easy scrolling sample

Interestingly, adding friction to the user’s actions can create a great design. One of Apple’s most popular inventions in their iOS mobile operating system is the creation of elastic scrolling, where in certain situations (like at the end of a page, for example), scrolling becomes more difficult.

Sometimes smart design and abuse of graphic trends like kinetic typography, animated logos, etc. can damage UX. What makes this mistake even more dangerous is that designers love smart designs. Unfortunately, most people are not designers. Even sadder is that not all smart designs are generally good, especially when they create problems with text accessibility, discovery, or usability.

Instead, keep it clean and clear:

Animated logo

Good Animation Design Checklist

Animation experts from Explain Ninja, advise to mind at least the following five principles when developing animation:

1. Think through each animation before starting to create it to avoid poor design examples.

2. Take the 12 principles of Disney animation as a basis. Although used in filmmaking, they may be suitable for websites and app design.

3. It should be useful and necessary, but only then beautiful: the aesthetics shouldn’t come first in UX.

4. Good animations are unobtrusive, subtle, and organic, which means that they move quickly.

5. Ask professionals to advise and help with the production process, and follow the anti trends to avoid mistakes.


No matter good vs bad logo design, website or app, package, or anything else, design success does not always depend on the subjective opinion of the person who evaluates it as good and bad designs. There are principles of good design you need to understand. This is what differentiates good design from great. Good design will always be primarily based on critical design principles and focused on solving users’ problems to the utmost instead of showing up or posing.

What are you waiting for? Just leave us a note, we’ll respond faster than Flash would do!

Contact Us