Mobile phone with app account view
Cooperative Bank New Zealand

Banking app redesign

Designing at a large scale.

After outsourcing mobile app design and development work for several years, The Co-operative Bank (Co-op) — NZ’s largest member-owned bank — decided to bring the effort in-house. The big priority was to deliver an improved customer experience on top of a more manageable codebase.

Design partnership

Co-op approached us to support their in-house development team with user experience (UX), user interface (UI), and customer experience (CX) design capabilities. While we worked together to deliver these new apps, Octave was also helping Co-op establish new design practices and tools for their growing internal design team.

Setting the foundations

The most important design principle for this project was to embrace, as much as possible, native iOS and Android UI patterns. This makes the new apps more familiar to customers while creating huge production efficiencies by leveraging the work Apple and Google put into their developer kits.

With this in mind, much of our design focus was on finding the right balance between pragmatic decisions and the creative expression of Co-op’s brand experience.

Wireframes for the app shown in an isometric view

Framing things up

Before digging into the details, we established a low-fidelity view of the entire app using wireframes. This process helped us create a wide-reaching requirements document and allowed us to tease out areas that needed improvement, or that would require testing with customers.


Customers love the ability to see a little bit of themselves in their banking apps. We used the metaphor of a wallet to design the accounts view, the “home” screen of the app. Customers can dial the level of personalisation up or down to their heart’s content by adding colour, photos and account nicknames.

Home screen with images added
Account screen with image
Account screen with no image
App review

“Love the new app. Great options to customise, and also dark theme too. Much more intuitive to use. Well done The Co-operative Bank team.”

Simple moves

By a landslide, making payments and transfers is the most-used action in a banking app – so we put the new, streamlined Pay & Transfer flow front and centre in the app’s interface. Just the right amount of information is shown based on the context of the transaction, making it easier for customers to focus on the important bits.

Three screens showing the pay and transfer flow

Balancing experience and effort

We identified a handful of app features that needed a little extra love to make the user experience sing. To ensure we were making the right decisions about how much effort was spent polishing these features, we cycled through iterations between Octave’s design team, Co-op’s delivery squad, and Co-op’s customers; continually revising, reviewing, and testing ideas.

Screen in iOS app showing card view
Screen in Android app showing card view
Toast messages

Using Co-op’s brand voice

The language used in help text, notifications, success messages, and “empty states” is fundamental to the success of the customer experience. Working closely with Co-op’s brand and marketing, and legal teams, we created a suite of microcopy that balances clarity and playfulness to bring out the best of Co-op’s brand personality.

Documented design system

One system. One team.

The project team, across Octave and Co-op, needed visibility of the design work as it progressed, and clarity on what decisions were signed-off. As we created, tested, and locked-in design decisions, we documented these in a library of styles, components and patterns. This design system is now owned and maintained by Co-op’s internal team.

components making up a screen view
Icons in a grid

The value in the process

While Octave’s responsibility in this project was to deliver design specifications for two new apps, it was the facilitation of decision–making sessions between Co-op and their customers that delivered the most value. What Co-op has now – on top of their new apps – is a set of new tools and processes for creating, testing, and validating new features to add over time. They also have design principles that help qualify the design of new features.

Project in numbers


People using the app.


Screen views in 2 weeks.