About the client

Invoice Ninja: the all-in-one open-source invoicing app

Invoice Ninja is an invoicing software that provides good-quality services at an affordable price for freelancers and small businesses, and it's a big community for developers at the same time.

THE CHALLENGE

Creating the perfect balance between the different types of customers

Freelancers & small businesses are the ones who pay for the software.

Developers provide feedback and help Invoice Ninja expand while using the software for free.

For Invoice Ninja’s survival, these two groups need to support each other

THE Solution

Making both types of customers feel welcomed

We strategically uncovered their brand values first, took an in-depth look at the customers and their pain points, and then re-wrote the messaging.

We tried to make it very clear who they are for and what's developers’ role into this.

Positioning Invoice Ninja as the go-to invoicing and payments app at an affordable price

Results & outcomes

Website loads 3x faster

PageSpeed Insights from Google ranked the new website to perform 3 times better then their current one.

The current website vs the one created by us

Users understood what I.N. is about in the first 5 seconds

When we asked users to describe what the website is about, right when they got on the page without scrolling, they all understood very fast and described it very well.

All users said they would create an account

Everyone was willing to create an account and try Invoice Ninja after just checking the features and pricing pages.

We do workshops, Design & Brand Sprint

We tested the website’s prototype with real users and made sure everything we do is validated. We then applied users' feedback to make everything even greater.

All in just 1 month!

People involved:

Andreea Encutescu

Brand Experience Designer

Gabriela Gurgui

Digital Illustrator

Project date:

May 2020 - June 2020

Client's current website
https://www.invoiceninja.com/
New website made by us
https://in-rebrand.webflow.io/

Let’s talk about the process

Week 1

Brand Sprint

We felt that Invoice Ninja has some interesting core values that are hidden away throughout their messaging.

Week 2

Design Sprint

We explored all the challenges, set the long-term goal, the three objectives for this week, and then came up with solutions and decided what we should prototype.

Concepts

A game where everyone can choose their side

The solution we came up with for the unbalanced customer groups was to make them feel like they are already a part of Invoice Ninja right when they land on the website.

Keeping something familiar

While applying our solutions, we tried to keep some familiarity to it and not expand too much into something that Invoice Ninja is not:

Developers’ section with their profile photos is similar to what they currently have.

We took the demo of the app from behind the button they are hiding it on their current website and put it into the spotlight right on the home page.

Week 3

Brand Experience

As we tested the prototype from the previous week with the audience, we noticed a couple of problems: the navigation on the website was confusing, and they noticed that it is only for freelancers.

Concepts

Customers see themselves right when they get on the website now

We focused the most on the first thing visitors see on the website. The customers are right there saying what I.N. is for.

Previous week vs this week’s prototype

Making the other pricing plans as desirable (or more) as the free plan.

On the pricing page, we let the colors, the shapes, or the illustrations guide you. You get a sense now what's the best pricing plan you can choose.

Brand Personality

Using a magic potion for a more optimistic, creative and spontaneous Invoice Ninja

For the brand personality, we knew we want something dependable and hands-on things, something to make people feel calm.

Colors

Adding a new color, a very pale orange

The pale orange the freelancers & small businesses.

The green represents the developers.

Illustrations

Previous week’s illustrations

This week’s illustrations

With the new personality, we wanted to better express emotions relevant to the customers’ needs, and showcase the connection between the customers a lot better.

We wanted to make the result feel tactile and achievable

Showing the bond between developers, freelancers & small businesses

Illustrating an endless clock that makes the audience feel at ease with Invoice Ninja’s support.

Highlighting their biggest concerns

Illustrating the things that developers believe in

Typography & Iconography

Adjusting the smaller details for a cleaner look.

Using fewer and purposeful icons

Week 4 & 5

Iteration Sprint

With the feedback from last week’s testing session, we needed to make sure people will click on the button that opens the pop-up with ‘picking a side’, so we changed it to ‘features’ that now goes to the features page.

For a better navigation, we’ve made the features page to talk directly to freelancers & small businesses, and the  self-host page to developers.

Their current website vs our website

Let’s talk about the logo

Logo Design

Turning the ninja into an invoice, and not an envelope.

The new logo had to look like their current one, but at the same time different. So we had to be careful and to keep a balance between the old and the new.

Their current logo vs the new logo made by us

The biggest concern we had when it comes to their logo was that it is an envelope. It has a bit of personality and somehow looks like a ninja, but only email service providers use an envelope as a logo (think Gmail).

We wanted to keep the 'ninja' in the logo and add the 'invoice' in it instead of an envelope. This will better serve what Invoice Ninja is about.

Comparing the new Invoice Ninja logo to competitors' ones

Want to see the brand with your own eyes?
Go ahead, check the new website out!

Visit website created by us

Want to see more?
Check out the other stories.

See our PORTFOLIO

Hello! Nice to meet you.

We are Brandenstein and we believe in the power of brand differentiation through its personality.

meet the team

Ready to start your project?

Contact us today and start your journey of giving your brand a personality!