Web designShowcase

How a 'Coming Soon' website should be done

How do you get people to sign up for a service you can't tell them about? We explore how Sillk squares the circle.

If you want to know how to design a "Coming Soon" page - particularly one for a new service you don't want to tell people too much about - you could do worse than check out Sillk for inspiration.

The idea behind this new travel service, to be launched in Spring, can't be revealed yet - but its creators wanted to drum up interest and email signups. The approach they've taken is to combine gorgeous imagery with a vague yet compelling teaser slogan and a simple call to action.

Gorgeous photography and a simple message add up to a compelling proposition

What's impressive is how the site's been built with basic psychology in mind. People are going to be intrigued, but with no real information on offer they're not going to hang around for long. Hence, the sign-up process is quick, easy and made to feel fun with some subtle, bouncy CSS3 effects.

Making it responsive

The designer behind it, Adarsh Pallian, used html5boilerplate as the base and media queries in CSS to design for various screen sizes. "Since the design involved a circle, I had to design for both large screens and laptop screens differently," he explains. "So that eventually forced me make iPad and iPhone friendly sizes as well.

Designing for Retina

Designing for retina was a pain point, he admits. "I'll be the first to admit that the site will break for retina displays. I tried adding a @2x logo, but it's still broken. My Christmas gift to myself is a retina display MacBook Pro so I can test and build for retina displays by default.

Analysing the data

Equally interesting is the approach Pallian has taken to dealing with the data he gets from the site. "I created a funnel system and used MixPanel to monitor where people drop off," he says. "For example, the first page has an 'Explore' button - I monitor how many people will actually click on that button.

You don't know what you're signing up for - but what do you have to lose?

"The next page has a destination form field - again, this is to see if I can keep user attention and emotion high. If they have gone through those two steps, I know they will give me an email address - and sure enough, according to my MixPanel analytics, they have."

Data informs design

Now he's using the data he's gathered to update the design. "Most people actually drop out before they click on 'Explore' on page one," he explains. "So I'm working on a new version of the landing page to fix that problem.

"I'm also starting a A/B testing campaign on Visual Website Optimizer  that lets me swap out the background image for images of beaches, mountains, snow etc that I'm testing with various ad campaigns to see if it converts better."

Now read:

Subscription offer

Log in to Creative Bloq with your preferred social network to comment

OR

Log in with your Creative Bloq account

site stat collection