BERA

Intergiro

Kick Game

Yum Bun

Biozeroc

Freetree

On the Edge

Amphico

Veriff

Hotjar

Deadly Dust

Trackinsight

Eat Less Plastic

Forgotten Forests

flyp

SauceLabs

One Green Bean

UserZoom

Pachama

Yango Maps

Hometree

Aruba Conservation Foundation

The Wombles

snooz

Wild Thingz

Chester Zoo

One of the most challenging elements of the rebrand, was having to design an icon which could easily be legible and recognisable at 16px by 16px. From the outset, all design considerations had to work on this scale first and foremost as it was the most important touchpoint of the Hotjar brand (seen on millions of website feedback widgets across the globe).

The icon also needed to be able to scale up with ease, and include implicit references to Hotjar's unique Purpose and Product Vision.

Andrei Beno

"This project was a major undertaking as it involved a full rebrand, creating a new illustration style to match it, redesigning our website from scratch and migrating it to a new CMS, and restyling our product — and we couldn’t be happier with having selected How&How for this project!

"They took the time to understand our team, our mission and our product, and helped us incorporate all of those elements into our new brand in a way that’s true to both who we are but also to where we’re headed. They’re professional yet friendly, highly creative yet organized, and they were extremely responsive and accommodating to our changing needs as the project evolved. We’re really proud of our new brand and redesigned website, and enjoyed collaborating with How&How on this just as much as we love the final result!"

Brand Narrative
Visual Identity
Verbal Identity
Website Design
Website Build
llustration Packages
Marketing & Website Retainer
Animation Packages

Huge thanks to Christian, Adria and Sharon—our wonderful Hotjar partners over the years!

----------------
Featured:
Design Week
Brand New: Under Consideration
Print Magazine
Branding Temple
The Goods Magazine
Designers Bookshop
Mindsparkle Magazine
----------------

Strategist: Rog How
Designers: Avi Bernet, Miltos Bottis, Joana Fatela
Digital Designer: Marisa Oosthuizen
Developer: Peter Kroyer
Client Services: Ania Dzubinska
Creative Director: Cat How

Celebrating the full spectrum of human emotion in the rebranding and relaunching of Hotjar: the global user insights platform.

Hotjar had an image problem. Their iconic 'flame' looked a little too much like Tinder’s, and user feedback had told them their brand was 'too startup-y' and not inclusive enough. In the years since it was founded in 2014, Hotjar had enjoyed exponential growth and their brand needed to catch up. Now an essential tool for millions, their industry-leading product allows companies to understand how users behave on their websites—allowing them to see what they need, and measure how they feel. 

We were approached by Hotjar to collaborate on their rebrand (including animation and illustration packages), and to design and build their new headless CMS website. We wanted to craft a brand for the future. One that took into account three hugely important factors: their Audience, their Vision (to put people at the centre of every product) and their Purpose (to inspire change through empathy).

Combining these three into an icon that had to work primarily—and most importantly—at 16px by 16px (the most visible touchpoint of the Hotjar brand), was a complex design problem to solve. Starting with an expressive line to represent the user journey, we then duplicated it to show the human connection and support the product gives. Adding a gentle curve helped to suggest heat from the iconic Hotjar flame, as well as the H inherent in the company’s name.

As the product shows the full spectrum of human emotion—from angry clicks to happy, contented browsing—we developed a design system structured around effervescent lines, and ponderous orbs or ‘auras’. In this emotion meritocracy, no feeling is superior to another—as all help to offer better understanding of the user’s journey and experience. Lines therefore can have a combination of happy curves, and angry jagged ones. 

Our colour palette was inspired by the two component warm and cool colour-sets in a flame. This also helped to convey the warm and cool emotions visualised in the product itself. Ambit by CoType Foundry was chosen due to its friendliness and distinct ‘curls’ which mimicked the expressive lines of user’s cursors browsing websites. 

The Hotjar website is the primary sales channel for their product, so a digital-first approach to the brand was essential. From colour choices to brand assets, each element was considered for accessibility, file size and motion behaviour. As Hotjar’s primary audience comprises of digitally-savvy product teams—and their product is about helping these in turn make better products—the website we designed and built had to be both functionally and aesthetically as robust as we could make it. Consistently hitting 100s on our Lighthouse scores was a must. We also implemented a dark mode option (favoured by the target audience) to aid in energy efficiency and give the user control over their preferred viewing mode.

Featured in:
Design Week
Brand New: Under Consideration
Print Magazine
Branding Temple
The Goods Magazine
Designers Bookshop
Mindsparkle Magazine

We were approached by Hotjar to collaborate on their rebrand, and to design and build their new headless CMS website. We wanted to craft a brand for the future. One that took into account three hugely important factors: their Audience, their Vision (to put people at the centre of every product) and their Purpose (to inspire change through empathy).

Combining these three into an icon that had to work primarily at 16px by 16px (the most visible touchpoint of the Hotjar brand), was a complex design problem to solve. Starting with an expressive line to represent the user journey, we then duplicated it to show the human connection and support the product gives. Adding a gentle curve helped to suggest heat from the iconic Hotjar flame, as well as the H inherent in the company’s name.

Our color palette was inspired by the two component warm and cool color-sets in a flame. This also helped to convey the warm and cool emotions visualised in the product itself. Ambit by CoType Foundry was chosen due to its friendliness and distinct ‘curls’ which mimicked the expressive lines of user’s cursors browsing websites. 

The Hotjar website is the primary sales channel for their product, so a digital-first approach to the brand was essential. From color choices to brand assets, each element was considered for accessibility, file size and motion behaviour. As Hotjar’s primary audience comprises of digitally-savvy product teams—and their product is about helping these in turn make better products—the website we designed and built had to be both functionally and aesthetically as robust as we could make it. Consistently hitting 100s on our Lighthouse scores was a must. We also implemented a dark mode option (favoured by the target audience) to aid in energy efficiency and give the user control over their preferred viewing mode.

Since our rebrand, Hotjar were subsequently acquired by enterprise-level rival Contentsquare; have welcomed a new CEO and expanded their team with hundreds of new hires. They've also gone live on a number of product updates, continuing to scale Hotjar's tech architecture to handle a whopping 21,875,000 requests per hour.

Visualising the full spectrum of human emotion in the rebranding and relaunching of Hotjar: the global user insights platform.

Brand Identity, Website Design & Website Development for Hotjar

Visualising emotion for an enterprise user insights platform

We use Google Analytics to track and record your movements on the Website, where you came from and what pages you access. This data is not connected to any personal information.

We use Hubspot for Website analytics and marketing automation. This data is anonymous unless you fill in a form and your contact details are added to our database with your consent.

We use Leadfeeder to see what company IP addresses our traffic is coming from. This data is not connected to any personal information.

We use Hotjar to record session information to see how people use our website. This data is not connected to any personal information.

Our Website uses Cookies to ensure you get the best experience on our Website.

A branding agency liberating ideas the world deserves. Working from London and LA we use imagination to turn businesses into brands. Brands which enrich lives, nature and founders. We design the not yet.

How&How Branding Agency in London & LA

Oops! We can’t find the page you're looking for, but we can help you on your path to growth here ☺︎

Hotjar

Designing at 16px

View More Work