This week we’re looking at some of the most popular SaaS companies (software as a service) and compiled a list of trends and designs that inspired us. From logos, illustrations, and even landing page styles, this visual guide should give you a solid base for the top SaaS design trends of 2020.
We’ve also included some further resources at the end to help you tackle your SaaS design projects, so make sure to check them out!
In 2020, the trend seems to be revolving around SaaS logos that are minimal or simply font-based with slight tweaks. Now, you’ve probably heard of the term minimal design before. But, if you’re not very well versed in the world of graphics, you might not recognize some indicators of SaaS logo design.
The two basic concepts of minimal design are using a two-color palette & combining it with an accent color. Let’s break these two things down and see what they mean.
Limiting your color usage in this type of design is essential; otherwise, it defies its name—minimalism. The best minimal designs are those who keep it simple & elegant. And this is especially the case when it comes to SaaS logo design. Another thing that must be mentioned is the font type & placement. Your typeface must be congruent with the rest of your design, which means no over-the-top pretentious fonts and font colors.
In the following examples, purple and dark blue are dominant colors. Some might say that these colors represent trust and something that is of high-quality or luxurious. Although there have been psychological studies that have confirmed this, the true beauty of art is in its subjectivity. What we can say for certain is that these companies utilized their color usage brilliantly.
Here are some examples we particularly liked:
Clubhouse, for example, used a simple two-color purple and white palette. The designer used a sans serif font (something prevalent in minimal designs) and inserted the logo as part of the graphics as well.
In this particular case, the artist went with a three-color design, having a dark blue background together with a custom-made white font. Unlike the previous design, this one has the logo before the company name rather than after it.
by: JT Grauke
This is the epitome of what we call minimal design. The colors, the font, and most importantly, the minimal bread logo makes this one of the best SaaS logos we’ve seen in a long time.
Another design utilizing the purple and white colors, Marketo now has an excellent brand identity thanks to its graphics team. There’s so much to say about this superb example of rebranding, so be sure to check out the case study behind the logo!
We could go on explaining all the details of the design, but simply put - Customer.io’s design is astonishing. A minimal design, while having such a wide array of colors, is something that is a rare find. Props to the designer!
Font-based logos, also known as wordmarks or logotypes, are logos that focus on a business’ name. Creating the perfect font-based logo can be tricky. It needs to be clean and memorable, which is challenging to do when the nature of its design limits you.
Since the main focus of these types of SaaS logos are the company names themselves, choosing the right fonts is essential. The most iconic logotypes are Google and Coca Cola, though we’ll be focusing on some lesser-known ones.
Throughout the three different concepts, we see different shades of blue as the prevalent color. Given Hitch works within the travel industry, the artist decided to incorporate the international car-hauling sign into the logo. In the first two designs, we can also see bite-sized info about what the company does. Simple, sleek, informative, and very cool.
by Aaron Poe
Let’s dive into one of our favorite topics - isometric illustrations.
This graphics style depicts a 3D model on a 2D surface. While they’ve existed for ages, in the past half-decade have they gained a massive following in the designer community. This is because, with the advancement of technology and software, designer styles have moved forward with them. The highlighted colors, shadows, textures, and even animations weren’t so accessible back in the day.
At first, this resulted in a significant shift towards isometric illustrations, which, to this day, remains one of the top SaaS design trends of 2020. But, in the past five years, we’ve had a slight overload of these types of SaaS illustrations. Now, don’t worry, they still look great. They’re even the main art style on our website! But, nowadays, there also seems to be a surge of a new type of illustrations.
The first type is soft illustrations (or soft line illustrations). What’s notable about these designs is that they usually use very soft or pastel colors. This has resulted in some magnificent designs, some of which we’ll share below.
For example, Canny, a popular feedback tool (and a virtual high-five to them for being entirely bootstrapped!), used soft illustrations in their header. Notice how all of the colors and drawings are very soft and subtle. As is usually the case with these illustrations, the beauty is in their simplicity.
Here is another example of a soft illustration being utilized correctly as a landing page:
An example of a type of illustration that’s very much one of the SaaS design trends of 2020 is that of Prospa. Notice how, in certain aspects, the art style is similar to that of Softline. The difference being that this illustration type is a lot more detailed, comprised of different colors, shades, and small interesting details.
by Andrew McKay
In this particular graphic, we can see an illustration of a man painting a wall. The predominant color is green, and the artist wasn’t afraid of utilizing warmer and colder shades of the color as well. The brown staircase ladder provides a nice contrast, together with the subtle hints of white throughout the whole illustration.
Another example is the ones done by Will Beeching for FlatFair, a tenant/landlord relationship app. In 2018, the company wanted to revolutionize its brand identity and create a dynamic new visual system. The result of all this was a complete redesign of their website with some fantastic SaaS illustrations.
As part of the project for Prospa, the artist created these animated green state icons. These animations were designed for scenarios around Prospa’s customer dashboard.
Unlike all of the SaaS illustrations we’ve seen so far, this one has an entirely different drawing style. Pencil illustrations bring us back to our beginnings when we drew things on paper as kids.
This type of illustration is created using colored pencils and is a nice change from what we’ve looked at so far. The great thing about pencil illustrations is that they are timeless and don’t appear to be out of date. This makes them an excellent choice for any artist who wants to change up their usual style.
Okay, we know we already mentioned animated SaaS illustrations several times throughout this text. But, they’re worthy of a separate mention. Simple animations seem to be the trend again, and there’s a good reason why. Animations help in grabbing the visitors’ attention more effectively while also delivering an excellent user experience—a win-win situation for both the website and the visitor.
This particular example is of a Cannabis retail SaaS company called WebJoint. The designer team was hired to completely redesign their website with animations and make it informative and easy to understand. They went for a non-corporate design, to resemble what the company is itself—a cannabis startup. They attempted to show the connection between the brand and the retailer, and they did a fantastic job.
Another popular trend, specifically for landing pages (not only for SaaS ones), is having large hero illustrations. While we could go on about the psychology behind these illustrations and how it helps create trust between the company and customer - sometimes it’s just enough to look at the illustration.
Take a look at this gorgeous illustration by Tubik Studio:
To quote the design studio: “It’s a page that helps artists and their clients easily find each other and together make the world even more beautiful.” And we couldn’t agree more, the hero illustrations, autumn vibe & colors and overall design all look amazing.
The trend for landing pages (which deserves an entire blog post of its own) seems to be geared towards immaculate pages with crisp SaaS fonts that are very easy to read. We’ve all at some point encountered a page so cluttered that you didn’t know where to start. Before you know it, frustration leads you to click that little x on the right side of the tab.
An excellent example of a clean landing page is Blackbird.
When you visit the page, two things are immediately noticeable. Firstly, the font (Textbook New Bold), and secondly the crystal clear picture of one of Blackbird’s dispensaries.
Sometimes having only a couple of focal pieces of content can significantly improve the user experience. And not only this, but it also helps to navigate the visitor towards the website sections of your choice.
The same goes for SaaS dashboards:
In this case, they decided to go with a clean & slick dashboard UI. This is very important when dealing with sophisticated analytics and charts. The person viewing the data has to be able to understand all the information. And if the data isn’t correctly displayed, it defeats the purpose of a dashboard: being clean & informative.
Ready to tackle your next SaaS redesign or simply want to start from scratch? Check out some of the exciting resources below: