5 Amazing Site Designs on the HubSpot Website Platform

For the past five years, IMPACT has been building websites for a variety of amazing clients. As time has passed, we’ve seen an array of platforms arise and try to prove their versatility and vast capabilities.

However, regardless of whohas come and gone, HubSpot’s Website Platform has always managed to take the cake by offering an easy-to-use framework, SEO optimization, mobile support, content personalization, and much more.

HubSpot has also continued to pump in many hours and resources to enhance and grow their platform. In 2014,  the company announced their transition from the Content Management System (CMS) to the HubSpot Content Optimization System (COS) in which they introduced website pages, landing pages, blog forms, email, and analytics.

Towards the end of 2015, HubSpot shifted the terminology again to Website Platform and integrated a truer WYSIWYG (What you see is what you get) template editor to better the experience of its  users.   

With all these updates taking place, agencies and customers have continued to push the limits of the platform and create remarkable sites that separate themselves from the conventional templates we see consistently today.

To get a sense of the platforms true potential, check out these five fantastic websites designed on HubSpot’s Website Platform and learn about what makes them stand out.

1. CataPush

Users today are  delighted with interactive elements and animations that bring light to otherwise stale and stagnant websites.

Catapush is one company that managed to achieve this effect on various areas of its site. The company’s homepage features an animation above-the-fold as well as several more are under the ‘Why Superior?’ section.

The animations help explain the product's functionality in a enjoyable fashion that users will stop and look at.

The rest of the site contains various icons and graphics with content explaining use cases of the product and what it has to offer.

The graphics and large fonts make reading about the product significantly more enjoyable and users still have the option delve further into any features by clicking the CTAs when available.

The addition of the sub navigation on these pages is an excellent way to remove the possibility of very bulky menus from the global navigation. It divides the content up strategically so users can easily navigate to exactly what they are searching for.

I am also quite a fan of their signup page for the free beta. Rather than stuffing more information onto the landing page, the team let the website do the talking and created a simple layout with only the form and scarce content.

2. Grapple

Grapple, one of IMPACT’s clients (and a recipient of the 2015 HubSpot Impact Award for Website Design of the year), went through quite facelift on its site. When its site was initially designed, the goal was to provide insight into Grapple’s software and generate leads from new users signing up.

To help facilitate this, the hero on the website’s homepage featured a large image displaying the product and a CTA allowing visitors to sign up for it.

Further down on the page, there were sections that highlighted different aspects of the product. These descriptions were accompanied with images on the left showing examples of each.

Since then, in the effort of Growth-Drive Design, Grapple has undergone further changes to optimize it for its users. For instance, we moved the signup form to the hero with a slider showing the companies who use their software.

The large sections that highlighted the product have also been condensed to one section that describes each of the software’s features.

These changes ultimately help shorten the homepage and condense the length of content so it's more digestible, especially for first time visitors.

3. Altus Financial

Far too often are we met with the traditional hero image and value proposition. Altus Financial added some originality to its site by  incorporating a video into hero section so people can get a realistic sense for the company right off the bat.

The homepage also focuses heavily on Altus’ clients, their goals, and testimonials from their current clients. This builds trust and gives the site more credibility,  encouraging users to interact with it or read more into what other clients have achieved.

The site also nicely organizes its information on inner pages that discuss managing one's financial goals. Each inner item contains a short piece of content that’s meant to resonate with the user. Lists to the right of that display the services each item offers along with accordion dropdowns explaining each of them.

Even the company’s blog has been optimized with the most recent article in the hero and later articles displayed below. It also has an excerpt of the article and appropriate tags so users get a quicker idea of what they will be reading.

4. Origami Logic

Origami Logic is a marketing company that strives to quickly get marketers the data they need to make more insightful decisions.

Like most websites have been transitioning to, their global navigation contains their most important items front and center, while less popular items are hidden in the hamburger menu.

This frees up space in the global navigation while still allowing users the ability to travel to other inner pages located in the hamburger menu.

Above-the-fold, Origami has its value prop with two different sliders; one displaying the companies who it has  worked with as well as current news.

As you scroll down, the blue background shifts to orange and you are introduced to text that continues to change, telling the users a story. This helps keeps users attention on the content and gets them to read what they may otherwise skip past.

The product and solutions pages follow a similar pattern in which the pages gain a sub-navigation which scrolls to specific areas on the page. This is a nice touch if you have sections with a decent length of content which may make the page long and cumbersome to scroll through.

5. Bizible

Seeing social proof is always a great way to give your users a sense of trust in the product you are selling. Bizible’s logo slider and testimonial slider on the homepage achieve this effect nicely, especially since they slide automatically.

Another touch of humanization and personality is the BOFU form which takes a different approach by displaying the form as a sentence written in first person that the user fills in the blanks for.

Bizible’s pricing page is also an example of how to properly display the options you offer while highlighting what the most popular one is. The page even has a comparison chart below that shows the features each service level offers.

The company’s demo page also reminds users of the products features while still incorporating in more of those testimonials and logos of companies it works with. The form to the right also maintains a short and condensed design as to not overwhelm the user with the form fields they need to fill out.