A new website for a new business model

It all started with an informal chat

Paymentsense is a startup company based in West London providing card processing solutions for small and medium businesses.

Guy, Head of Marketing, called me on a Monday to invite me to be part of his new Marketing Team for the company. The goal: to redesign the company’s brand and website.

Founded in 2010, in 2012 Paymentsense had a customer base of over 30,000 businesses in the UK - and that summer they started trading in Ireland’s market.

Their mission is preventing businesses from being overcharged and under-served by the competition.
How they do that? Offering really low rates and fantastic customer service.

Paymentsense was growing exponentially and obviously it´s image needed to grow with it. What was needed was a more customer-facing approach, setting it apart of its main competitors, the banks. 

When the company's website was built 5 years ago the concept of responsive wasn’t as known as nowadays.

The main challenge for the team in charge of building the new website was the time schedule. We had to work fast - really fast: we had 7 weeks to design, write content and build (which we outsourced), the entire Paymentsense website.

We wanted to introduce the new website to the whole company at the Christmas Conference, an event where the founders of the company run a keynote with the last achievements and unveil the goals for the year ahead.

It was clear that we needed to gather as much information as possible for every decision we made, we had to really know the company from the inside out.

We listened to calls provided by Customer Service, to find out what kind of information merchants were looking for when they visited the Paymentsense website.
We arranged meetings with the Product Managers, to understand the benefits they wanted to communicate to potential customers.
And finally, we got a sense from the stakeholders about how they needed Paymentsense to be perceived by their audience.​

My Haven Account

All hands on deck

The nitty-gritty of the project

Once the research phase was finished we needed to get started on the actual work

After all that research, the team got together and we crafted the Sitemap. We decided that I would focus on the following tasks:

• Wireframes
• Art Directing the products Photo Shoot
• Prototypes
• UI system based on the Brand guidelines
• Mockups

I created my first layout ideas for the wireframes with just pen and paper, to quickly get some feedback from the rest of the team.

With no real content to start with, it was really difficult to get my head around how to structure the pages - especially the product pages.
The best approach was to start creating modules - kind of a library -  where eventually we would pour the final content into, and then decide the proper visual element to support it. These modules would be used to define the layout of every single page depending on its function: informative, sales-driven or interactive.

Getting the right look based on the brand

I chose very carefully which font families we will use for the project. Roboto Slab and Open Sans, both Google fonts, possess a modern look and great legibility. They complement each other, Roboto Slab for headers in contrast with Open Sans used for paragraphs and subheaders.

The branding dictated the use of blue and grey as the main colour palette. For primary buttons a warm green was the right choice to highlight this element, creating a nice balance with the Paymentsense branding blue.
A soft grey would be used occasionally as the background colour in some modules to create differentiation between different pieces of content.

A good workflow paid off

We met every morning, to catch up on the progress each one of us had made the day before, and to decide if this new information affected the approach that another team member was taking. Evaluate, rethink and improve.

We realised that egos played no role in a process where so many factors needed to be kept in mind.
The development team would send us the prototypes based on the wireframes and mockups I created, and we would evaluate what didn’t work, and what needed to change to make things gel. This happened roughly three times a week.
We performed tests in different browsers (Chrome, Safari and Firefox) and devices (Desktop, tablet and mobile phone).

I collaborated closely with the Development Team on the process of building the website with WordPress, the Content Management System used for the old website.

The use of WordPress decision was basically based on a matter of familiarity for the company, and also the fact that it is one of the most solid and popular CMS in the world.

Team effort

A Christmas Tale

Our efforts paid off in spades. Not only did we finish the new website ready by December for the Christmas party. In 2015 Paymentsense doubled its revenue in 3 months, signed up an average of 7 business per day and the website’s traffic increased more than 15%.