Deconstructing a Minimal Landing Page: Part 1

In this post, I am going to take a closer look at what I think is a great example of a simple, minimal landing page. I'm going to point out some of the underlying principles behind it and explain why it works so well. In the second part, I look under the hood of the design and show some guidelines to use to create a concise, well-designed landing page like this.

The landing page I'm referring to is the one from Radial. At first glance, it seems to be about a mobile app to record and share short sound clips with friends and people you follow through the app.

Note: In case the design of the site has changed, here is a full-size screenshot from March 2023.

The Important First Impression

Here's the first part of the page, what you see when you open it:

As you can see, it's a very simple page. There's a logo, a short headline, and one single sentence of text. Following up is an input field and a button, asking me to enter my email to get early access. And finally, at the bottom of the screen, there is a large visual that is cut off by the browser window.

The whole screen above the fold makes for a great first impression. There's a bold, short headline that not only explains what the thing you are looking at is about but also urges you to take action: Listen to what's new.

Then there is just one single sentence, pretty much an elevator pitch, that gives just a bit more context about the product. It's enough to tell you about the two main aspects: Catch up and record what's happening.

And that's enough. It's short and simple, written in plain English. What's more, it is written for a potential customer. There are no buzzwords, technical jargon, or insider speech. It's a very simple yet effective opening section that tells me what this thing is and why I should care about it. And it does this fast and easily to understand.

The form below the text is also very simple and effective. Now that I know about the thing I'm looking at and what I can do with it, all I need to do to take action is enter my email and click the blue button. You could argue that “get early access” could be a bit more precise. Do I get to download the app right away after clicking the button? Do I get on some sort of waitlist? What exactly happens after clicking that button?

The visual breaks things up, catches my interest, and encourages me to scroll further down the page because it is cut off. That's important to do because you most likely want people to scroll down on your page, especially if they are not convinced enough to already enter their email and click the button.

Overall, that is a great first screen for a landing page. It answers the “what” and “why” and it gives a clear call to action. Finally, it teases continuation and clearly shows that there is more below the fold.

Product Presentation

Upon scrolling down the page, the rest of the visual comes into view:

The visual shows what I suppose is the main use case of the app: Listening to a short sound clip from a friend or somebody you follow.

Scrolling further down shows three very short sentences set in large size:

This block of text presents two more product features and emphasizes a potentially unique selling point of the product. Once again the text is easy to understand and fast to read.

The text block is followed by three sections, each consisting of a visual, a headline, and one sentence of text. Here's the first one as an example:

These sections quickly describe three features of the product. What I like about them is that they describe the product and its features from a user's point of view, outlining how they help to reach a goal.

Invisible Design

The design of the page is very simple and minimal. It puts the words and images front and center and ensures that everything that is on the page is easy to see. There are no distractions and no visual clutter.

But still, from the choice of the font to the colors and images, the page is well designed to support the brand and its messaging. Change the font and the colors and you get a completely different look and feel.

Apart from that, the landing page makes use of subtle scroll effects. The images in the feature sections expand slightly when they come into view. The large text section moves every sentence up and fades it in. I like the feature sections a lot because only the images are animated. This allows me as a user to quickly scan (or read) the text without having to wait for some fancy animation to finish.

Lessons Learned

• Text first! Well-written copy is crucial for every kind of website. By focusing on the text, you focus on the communication with the visitors. Radial does a great job explaining their product and how it can improve my life and they use a very short amount of words to accomplish that.
• Everything is written in plain English and uses a potential user's perspective. Sentences are short and easy to understand.
• The first section (everything above the fold) is spot on. It grabs your attention and tells you just enough to get interested. The visual teases more content below the fold and gets you scrolling.
• One call to action. There is just one single action you can take on the site (besides following the links in the footer). You can enter your email and get early access. That's it. Simple and straight to the point.

This type of minimal design may not be suitable for every type of landing page. However, I think even if you need something a bit more complex (more features, maybe a video, a bit more text, or a second action), an approach like this is a great starting point. It forces you to carefully think about your messaging and focus on the essence of your product or service.

If you want to know more about the underlying design systems, continue reading with part two.