Call reception
+61 3 9088 3555

Email the client service team
enquiries@liquorice.com.au

Ring the doorbell
L1, 184 Brunswick St,
Fitzroy, Victoria 3065

Close

Littlepay

Giving Littlepay the green light

26 February 2019

In 2014, the introduction of EMV payments across London’s public transport network simplified the customer experience and created a watershed moment for the transit industry.

Littlepay saw an opportunity and was founded with the aim of becoming the world’s leading specialist payment service provider for transit, promising to simplify the complexities of transit payments. Their flexible, open, API-based platform simplifies the normally complex adoption of contactless payments for transit operators everywhere; they just had to get the word out.


This fast-growing and agile start-up has gained serious traction in the industry, delivering for some impressive brands in Europe, including the Go-Ahead Group, First-Group UK Bus, and Arriva, and has been generating significant interest across the globe in the process. To take advantage of the interest, Littlepay decided to refresh their brand and website to better reflect the capabilities of their team and what they offer.

We were very happy to be brought on board to help them realise their vision for a fresh, new Littlepay.

Mapping the user journeys

Simplicity was a core consideration from day one, forming a pillar of Littlepay’s brand strategy and, indeed, the brand and product's key promise. This need for simplicity was further supported by our competitor research, where the best-practice examples all boasted powerfully simple yet focussed brands, messaging and navigation.

But simplicity is hard earned. The technology is complex, and although Littlepay's primary audience is transit operators, it was important that anyone from passengers to potential employees could understand and navigate the website and its content. So, how do you make one website speak to multiple audiences, all with varying levels of understanding? Mapping user journeys is a good start.

We began by creating an initial site map; a proposed layout of Littlepay's website including primary and tertiary pages, links and calls-to-action. Together with Littlepay, we then added, subtracted and consolidated pages until we felt we had the simplest and most effective information architecture.

We then set out to embody some of the key audiences, exploring the site map and asking ourselves "If I were a potential employee, where would I go?", "If I were a device partner, what kind of information would I be looking for?". By putting ourselves in the shoes of the people we're communicating with, we were able to map their journey across key pages and pinpoint critical messages and calls-to-action for each, colour-coding them for future reference.

Using our newly coded site map, we were able to plan the content, messaging and visual assets for each page, with clear goals in mind for every audience.

Littlepay Wireframes

Green means go

"All a traveller wants to see is the flash of green light on the ticket reader when they touch their bankcards. It's our job to handle everything that's happening behind that frictionless payment experience to make it possible in a fraction of a second." - Amin Shayan, Littlepay CEO

This simple but powerful insight from Littlepay's CEO Amin Shayan was a lightning bolt moment in the design process. We expressed the power and simplicity of Littlepay's offering through this green light in the 'i" of the brandmark, and this concept informed much of the subsequent brand, such as illustration, icons, diagrams and animation.

Pairing some of the tech-heavy text and diagram content with more approachable illustrations helped to explain complex concepts to potential customers with limited technological knowledge. By repurposing a combination of stock illustrations from various sources, we were able to create a unique set of key brand illustrations that tell the story of Littlepay's potential use cases, and still deliver them on time and on budget.

Considering content

A site must balance form and function, be beautiful and work hard. To achieve this, it's critical that the design and content work hand-in-hand, each informing the other.

Our digital designer, Pete, and our copywriter, Madeleine, worked side-by-side, sharing design and content updates and refining the site from all angles until it was ready to be built. This co-operative, tandem approach to the site was especially helpful when it came to producing diagrams. Explaining complex systems and processes in one simple visual was a challenge, but by considering design and copy together, we were able to create a concise and approachable outcome neither could achieve alone.

Littlepay Website - Desktop
Littlepay Website - Tablet
Littlepay Website - Mobile
Littlepay Website - Desktop
1 of 3

From the very beginning, the project process was very important to us. Working with Liquorice was both a transparent and integrated experience, involving everyone from the very beginning. By being embedded into the Liquorice project team, we were able to see the bigger picture sooner and this prevented any pitfalls. This way of working directly contributed to us making our delivery timelines and ultimately, the overall success of the finished product.

Amin Shayan, Littlepay CEO

Leaving the station

With the new brand identity, content and site design complete and a deadline fast approaching, our superstar developers got to work building the new Littlepay site, utilising a Django-driven Wagtail CMS. Technical Director, Hammy, has written about our love for the ever-impressive CMS software, Wagtail, and this project saw it put to good use.

Today, Littlepay have a website that better explains their product and what they have to offer, to vendors, device partners, passengers and more. Simple.

Services

Digital Strategy

Front-end Development

Back-end Development

User Experience Design

User Interface Design

Illustration

Animation

Acknowledgements

Digital Direction: Jim Yencken

UX/UI Design: Peter Binek

Project Management: Tamera Crang

Development: Hammy Goonan, Vivian Genato, Michelle Chan

We live and work on the lands of the Wurundjeri people.
We acknowledge their ownership of the land and pay our respects to their Elders past, present and emerging.