5 effective SaaS website designs

SaaS_website_design.png

Here at Blend we are in the process of redesigning one of our SaaS client’s websites, so in the name of research I thought I’d take a look at the competition and share some examples of companies getting the design part right.

Which design decisions lead to interesting and effective web design for SaaS marketing? With trends like parallax, video headers and flat design consuming the market, users are used to a high level of design – standing out is becoming increasingly challenging.

Build a B2B website that attracts, engages and converts visitors - read our  complete guide here. 

Help Scout

If you’re a fan of functional, minimalistic design then Help Scout’s website is bound to put a smile on your face. The style is understated and unpretentious, letting the viewer digest the content with generous lashings of whitespace, soft grey text and impeccable typography.

helpscout.jpg

Dropbox

The delightful illustrations make for a very engaging homepage, and create a unified look and feel across the site. Brandon Land (illustrator at Dropbox) uses a lovely colour palette and subtle animation to humanise one of the largest SaaS companies in the world.

dropbox.jpg

InVision

Possibly the only example I’ve found where having video behind the header section doesn’t distract from reading the overlaid text (InVison gets away with it because the pan on the first few frames of the video is nice and slow, and the overlay is quite dark). This site has gorgeous typography and design visuals, but the real success is how it responds to screen size by letting the images bleed off of the page to work on smaller screens, with entire images shown on larger displays. This is a site that scales up to even the highest resolution screens.

invision.jpg

Slack

With the bold choice of putting very little on the homepage (actually there are three different versions each focusing on a different high profile client) Slack immediately grabs attention. Their site uses a bright colour palette and fun illustrations to make a tool for work feel like play.

slack.jpg

Mail Chimp

Mail Chimp has to be my favourite example. Their homepage is a thing of beauty: clean, quirky and concise. The small personal touches, like the signature at the bottom of the page (a nice nod to letter writing of the past) create a engaging dichotomy between the clean minimalist style of the site and the quirky personal touches which delight at every corner. Take the pricing page for instance, kitsch plastic figurines represent each tier of pricing – lamb, horse, elephant… and if you slide the subscribers bar past 600,000: griffin, I challenge anyone not to smile.

mailchimp.jpg

 

Key Take-aways

  • Simplicity works really well, so pare back as much as you can
  • Consider how your site will look on multiple devices
  • Typography matters
  • Be discerning – it’s alright to include some trends as long as they don’t compromise legibility or usability
  • B2B doesn’t have to be boring, finding a way to add a little personality works wonders 

B2B website design 

back to blog

next post

If you enjoyed this post why not subscribe to receive post notifications