Brand & Website Design

Growth Giant July 2012

Growth Giant is an A/B testing tool that a few friends and I created for a bit of fun on the side. I enjoyed the challenge of designing this fun and quirky brand.

growth giant illustration
logo sketch
logo grey
logo white

Creating the brand

The difference between Growth Giant and other A/B testing tools is that our tool dynamically directs website visitors to the better performing page, to ensure that you get the maximum conversion rate possible. Most A/B testing tools out there look and feel quite technical, but we wanted our brand to be fun, friendly and accessible.

The above logo design is very minimal with the upward-sloping arrow symbolising a line chart of increasing conversions. I wanted to create a symbol that incorporated growth, and a chart is a simple way to do that visually. I used rounded corners and soft pastel colours to achieve a soft and friendly aesthetic.

character illustration
character sketch

I’m by no means an illustrator, but I did have a lot of fun creating and illustrating this simple character above. He’s big and friendly and a little bit quirky with his small head and huge hands. I sketched out some ideas on paper first to figure out the visual direction. Once I was happy with the basic concept, I moved into Illustrator and used simple shapes and flat colours to create the character.

visual design of icons
visual design of typography
colour palette

Designing the website

We decided to create a simple one-page website that explained the benefits of the tool and how it works, encouraging customers to sign up. The branding had already established quite a strong visual style which gave me a pretty good idea of what the website would look like. Using the brand as a guide, I created icons (above left) and defined deliberately large and chunky typography (above right).

For the content of the page below, we focused on the benefits of the tool, showing potential customers how it could help them increase sales conversions on their website. The top banner tells users what the tool is and how it can help them. A prominent call to action encourages people to sign up or see a demonstration of the tool in action.

homepage design

I created a small case study above, about a fictional person who has an online book store. The case study diagram basically shows how she uses the app to test a new web page idea to increase book sales on her site. I used a similar illustration style to the Growth Giant character to create the images in the case study. The page ends with a prominent call to action prompting people to sign up and start optimising their websites. The distraction-free sign-up form below was designed to be quick and easy to fill out.

sign up form design

Ongoing optimisation

We plan on designing multiple versions of the homepage to split test against each other. I think it’s important to be continuously trying new ideas to improve your conversion rate, rather than just concentrating on driving more visitors to your website. Designing the application itself was also an interesting challenge, so I’ve put together a separate case study detailing how we went about designing the interface.