You should copy the new Slack website

I love the new Slack homepage.

In this blog, I will tell you exactly what I love about it so much and how you can implement their winning formula into your homepage and landing pages. If you can update your website to be half as good as Slack’s, you’ll undoubtedly increase your conversions.

The Slack website covers the fundamentals of a great SaaS homepage brilliantly, such as short and snappy headlines, social proof, enticing CTAs, facts and stats, a clean layout, and not too wordy, but what really impresses me is the use of graphics.

Let’s get into it…

The graphics are the best I’ve ever seen

As I’m sure most of you are familiar with, this is what Slack actually looks like:

Imagine if Slack displayed this screenshot on their website homepage. Someone new to Slack would likely squint at the image, feeling puzzled and perhaps overwhelmed by all the details. Their impression would likely be, “That seems complicated; I don’t have time to figure it out.”

Instead, Slack have redesigned their UI, especially for their website. Take a look:

Simple, yet beautiful. Let’s break it down:

✅ Simplified it by stripping out the detail
✅ Highlighted one main feature (group chat)
✅ Pumped up the font size

You can’t see it in this blog, but they also turned it into a looping animated GIF to show it in action.

Honestly, it’s a work of art.

Visitors to the Slack website will now understand the core features of Slack within seconds. They’ll think “That looks slick and super easy to use; it has all the features I need. My team are going to love it! I want a demo ASAP”

Slack have repeated these graphics throughout the homepage and the rest of the website. Using one screenshot per feature or benefit. Here’s the UI shot they use to present group calls (Huddles).

Take a look at your website. Do you lazily paste screenshots of your platform? If so, it’s time to have a chat with your designer and product team. Show them the new Slack homepage and say, “I want that”.

Once you have designed a series of screens for each of your main features/benefits, it’s time to animate them. You’ll first need to create a storyboard/brief outlining what movements you want to see. Slack uses a moving mouse cursor, typing text and popouts to good effect.

If you don’t have an animator, you can easily find one on Upwork or Fiverr. The loops should be no longer than 10 seconds. They can be GIFs or MP4s. Chat with your web developer to ensure they do not impact the site’s speed too badly.