Thank you!

Newsletter sign up successfully

Design the perfect ICO landing page in 2018

A highly successful ICO began with brand strategy

A full guide to designing and launching the perfect landing page for ICO and blockchain products

What 2017 taught us about ICOs

During the fruitful, largely unregulated commotion of 2017 - we saw businesses manage to secure vast amounts of money through their websites, even when those websites had poor user experiences. It was an insightful example of user intentions overcoming the nuances of good web design that we so carefully strive for in most websites today.

Media coverage and public knowledge will increase as ICO's continue to surge. We’re already seeing savvy users getting better at identifying genuine blockchain businesses from cash-grabs before investing. As such, we’ll see more educated, hungry  users enter the ICO space in 2018 , resulting in an increasingly competitive playing field. Established brands and sophisticated user experiences will separate the leaders from the pack.

As this need grows, the standard for any new business wanting to raise capital through an ICO will increase; effectively weeding out those who don’t surround themselves with the expertise needed to meet that standard, stand out against the noise, and ultimately succeed.

1. Start with Brand

Even if ICO campaigns are seen as new territory in the realm of financing, the online user experience is still subject to the same design theory that applies to existing websites. That means it starts with brand - afterall, a website or landing page is merely an expression of brand that happens to be online.

Make sure that your brand’s identity is established, both verbally and visually. This means consulting with a brand and design expert to discover who you are, what you stand for, and how you plan to get there. The results of this exercise are the foundational components of your brand-system, which includes: including vision, mission, personas, value propositions, values, and tone of voice, symbol, wordmark, colour pallette, fonts, and example applications of it being used together.

With this in place, you’ll have a sound understanding of your business objectives which you can then turn into goals for your web experience.

2. Map out the goals of your users for each phase

Before moving into the design of your landing page, you’ll want to understand what the goals are. Generally speaking, an ICO campaign could span several phases before the actual tokens go on sale.  Each pre-sale phase plays an important part in building social virality, a sense of urgency or exclusivity, and ultimately a powerful ‘network effect’.

As with the stock exchange, the value cryptocurrency is determined by public perception. People ‘buy the news’, not the coin. Successful ICO’s use the following steps to generate buzz and excitement:  

  1. Announce upcoming token sale and community channels

  2. Announce white paper and/or technical paper

  3. Pre-register for flash whitelist

  4. Announce advisory board or new team additions

  5. Flash whitelist sale (usually a 24 hour sale for community members)

  6. Token sale details announced (use of funds, distribution, etc)  

  7. Launch Proof of Care program and/or Bounty program

  8. Pre-sale for whitelisted users (24-48 hours)

  9. Token sale (28 days)

  10. Token sale closed and distribution of tokens  

In terms of the user’s goals for each phase, you’ll want to write out a list of ‘user stories’ which outline exactly what a user might want to achieve. For example:

As an investor, I want to read the white paper in order to understand the entire business model

As a developer, I want to join the community Slack channel to stay informed on technical updates.

With these completed, you’re ready to get designing with real objectives in mind.

3. Wireframe the user experience

With the phased plan in pocket, you can build out the wireframes for multiple phases at once. This allows you to look ahead and think holistically about how users might engage with the site as the ICO progresses.

As you research and analyze other ICO websites, you’ll start to spot some similar designs and layouts. A trend of copying these sites has reached the point where almost every ICO page follows a similar structure - resulting in a standardization that users expect to see. These sections are:

The Header

First impressions matter, and the header plays a crucial part in creating a powerful one. The header has a few jobs:

Media Coverage

One of the most important checkboxes you want to tick in the user’s mind is that you’re being noticed. Consider having a short section directly underneath the header showing logos of media outlets that you’ve been featured in, with the addition of adding one of the more powerful quotes. Each time you’re mentioned in the media, interest will spike.

Elevator Pitch Section

You’ve heard of an elevator pitch - well now’s your chance to wax the online version of it. This section needs to briefly explain what your product is, who it’s for, and why it’s solving a valid (quantifiable if possible) problem in the world. These often take the form of a diagram or explainer-video with bullet-pointed benefits listed alongside it.

Token Details

A lot of the traffic to your site will be due to interest in your ICO. Give the people what they want: ICO details. After setting the stage and explaining what your product is about, the next priority is to explain the terms of the token sale.

This section is one that will evolve as more information becomes concrete and available to share with the public. Users are looking for the following basic details:

Consider using a mix of iconography, pie charts, and interesting layouts to present this information to make it more compelling.

Roadmap

It’s important to make it easy for people to catch up on your progress, achievements, and roadmap for future milestones. Users considering investing in ICOs are paying increasing attention to what a company has already accomplished. In particular, mention any product development updates you have.

Users are likely to pay more attention if you can demonstrate you have a real product built or in development (another good way to show this is showing commits in Github, and linking out to that). They’ll also want to see what big updates you have coming up next - each ‘point’ in this roadmap is another opportunity for them to ‘buy the news’.

A timeline works great as a design solution to convey these points. 

Team, Board, and Advisors

In traditional investing, there is an idea that exists: people invest in people, not companies. This mentality seems to have translated to ICO contributors as well.

From our domain research, social listening and user interviews, we found that team experience and skills is considered a high ranking factor users look at when considering purchasing tokens in an ICO. Be sure to highlight any blockchain engineering abilities within your team, as these teammates are assets.

In this section, be sure to include not only names and titles, but also a short bio highlighting their relevant experience.

Additionally, you will want to highlight any Advisors you bring on board. Many companies build this roster gradually, and list advisors as they are added - each addition being big news.

When considering your page structure, we recommend adding this information immediately following your team section. This way, if the visitor is looking for information on the people involved, they do not need to navigate to different sections to find your team and your advisors.

Partner and Integrations

List any partners who are already investing in your product. This is a tried and true method for building trust and demonstrating legitimacy. This is often referred to as being “Backed by [company logos]:” or “Works well with [application logos]”.

News and Expertise

As you know, news can have a significant impact on the success of your ICO.

If outside, unbiased news sources are saying good things about you in the media, this helps others to trust that your product is worth considering - post these right here (on top of the media outlets’ logos further up the page). Whether it’s a big news outlets like techcrunch, or something more niche, you should mention it on your website.

Users also want to see that you have a voice - make sure you’re writing compelling, thoughtful content that’s relevant to your industry, your product, or the market at large. This is your opportunity to show users that you’re not just a face, but a hard-hitting professional. Consider having the title of the article and a very short excerpt, which then links out to the full article (usually hosted on Medium).

Connect on Social

Depending on what phase you’re in, you’ll want to be building your social communities in order to foster a network of advocates. Ensure you have a section that offers a way to subscribe to your newsletter, or connect in to one of your communities (Telegram, Discord, Slack, Twitter). Users often check these to see if there’s already a positive community behind your project.

4. Design the user interface

User interface design is the set of decisions that go into creating the look and feel of your the digital products and touch points, such as your ICO website. In order to achieve the best results here, it’s best that your visual identity and brand is already established well.

During an ICO, you are trying to attract and engage the user to invest in your idea. The objective is that every touch point with a user is compelling, feels familiar, and is memorable. These psychological considerations can feed further virality, and more users means more chances to persuade someone to take part in the token sale.

nodes.jpg#asset:1768


We saw a lot of this. Maybe because blockchain is still very hard for newcomers to visualize, people end up with the same few visualizations. We recommend trying to break from the mould. Blockchain is only a part of your product, but what are you doing with it? Focus on your differentiating elements.

Investing in the way you represent your brand visually will help you get recognized easier and quicker. This is an opportunity to connect with visitors and stand out in the crowd of ICOs with thoughtful branding and quality design work.

5. Select your landing page builder

The world of ICOs is moving fast - which means there are a lot of websites being thrown together very quickly using out-of-the-box templates (think Squarespace or Wordpress). This rushed mentality also feeds some of the uniformity and monotony in the design of some of these pages.

On the other end of the spectrum, there are those who are striving for custom perfection and  and missing opportunities in the process.

You want to be able to move fast, but also iterate as you go. For these reasons we recommend using an adaptable landing page builder for your ICO.

Ask yourself the following questions when deciding which landing page builder to go with:

We have found a few great landing page builders that worked very well for the needs of our clients. Our favourite to use and collaborate with has been Webflow, because it offers a very easy way to build out custom designs for your developer, then acts like a simple CMS for content editing and shifting layouts for the non-developers in your team.

Prepare for Takeoff

With the new page built and tested, you’re ready to launch. Ensure your social channels are primed and that you have messaging ready to hit the media. It’s important to be prepared to adjust your flight plan because you’re still navigating very new terrain, but with 80% of the planning already done by following our guide - you should be ready to ‘go the moon’.

At Skyrocket, we’ve got years of experience helping new ideas launch - so moving in to ICOs was a natural move for us. We decided to write this guide after immersing ourselves in all things ICO, in the hopes that we can help others in the process. If you’d like our help with your ICO, drop us a line here.

More Blog Posts

Slack Is the Thread Stitching Our Culture Together

You know how these days everyone is raving about ‘Slack changing their work lives’? Well, count us in because Slack did change the way we work and our culture as we knew it.

What’s Cookin’ in Web Design?

Trends come and go, and we know it can be tough to keep up… but fear not! Let’s dive into a few that are currently on everyone’s radar.