How do you sell something that customers don’t have to buy? How do you convince someone to use something they don’t have to ask for?
Our awesome Senior UX Designer Jo discusses the latest BPAY Group product to launch through a UX lens.
So… what exactly is Osko?
Splitting a dinner bill with friends? Paying your hairdresser? Sending your sibling money to cover mum’s present? Osko is a payment service inside your online banking, typically as part of “pay anyone”, that makes the money arrive in your friends account in under a minute. It’s available between 60+ major participating banks and financial institutions 24/7. If both your banks have Osko, the whole thing is super-fast, simple and secure.
The design challenge
From the Osko brief, we had to build a website that explained what Osko was, how it worked, and how you could use it. The catch? You don’t use Osko on its website, you don’t buy it or subscribe to it, and it’s not an app you can download. Hmm…
From a design perspective, we salivated just a little when we received the Osko branding. Bold, geometric and monochrome, it promised a great website aesthetic. We would take this branding and apply it to Osko’s digital presence, working through a process of brainstorming, site mapping, sketching, wireframing and design. To understand if our design was working as intended – communicating the message of how Osko worked and how you could use it – we conducted two sessions of usability testing.
What is usability testing?
Usability testing is taking a design and asking real users to test it for us. We do it because we’re not real users. We’re too involved with the client, we know too much about the brand and the brief. We’re also only human, having spent time on the project we are physically, emotionally and mentally invested in the site as it appears because we made it. All of these factors combine to make us biased – we are unable to truly test the functionality of the site because we know how it’s supposed to work.
So, we run usability testing sessions instead. These sessions consist of people coming into our office, sitting down at a device and completing set tasks on a clickable prototype. For each task the users would answer perform an action on the prototype, answer a question and give the task a difficulty rating out of 10: 1 = “very hard” and 10 = “very easy”.
The main purpose of this task format is to capture both qualitative and quantitative feedback from the user. The open answer section allows the user to write down how they approached the task, capture any difficulties they had around the question or the solution. Although a sample of six users is not statistically significant, a score out of 10 for each question helps us understand how difficult users thought a task was to complete. We take the resulting average numbers with a grain of salt, but if every user scored a particular task less than 3/10 then we know we definitely have to address that section of the design.
How did we apply this to Osko?
For Osko we ran two different testing sessions of six users each. The first was run on a wireframe prototype, then the second session was completed two months later on a creative design prototype. The benefit of this format allowed testing feedback captured in the first session to be taken into consideration, and updates to improve usability during the design phase. Early testing meant that we didn't spend too much time working on an idea that did not test well. This helped us find the right design direction earlier saving us time and rounds of changes.
Usability testing also helped us show our client how the design was performing for users, streamlining discussion and feedback. It gave us checkpoints where we could have discussions with the client about what was working and what wasn’t, and also make decisions to push the project forward.
The wireframing session
The wireframe testing session consisted of four pages, tested on desktop. The results were mixed, with users navigating around the site easily and quickly, but finding it difficult to understand the overall purpose of Osko when they could already transfer money to anybody using their bank.
When talking about the interface, they described it as “useful, easy to navigate and self-explanatory” and the large type as “clear and casual”. However, when asked if they understood why or how Osko was different to a normal bank transfer, they thought it would be the same. This highlighted a general communication improvement we needed to make across the site to help users understand why Osko was better than a regular bank transfer. This issue was in part due to placeholder copy throughout the wireframe as the copy for the site had not been written yet at this early stage.
One of the functionalities tested was a bank look-up, where users could type in the name of their bank to see if Osko was available. Participants understood this section of the website well, and felt it was the most useful part of the site as it would help them see whether they could use Osko yet.
From the feedback collated from this session, we updated the wireframes before passing them on to design. The navigation was further simplified, we pared down some text that was too large and distracting, we added icons and graphics to help break up blocks of text, we changed the title of the help page from Help Centre to FAQs. Creative page designs were completed with these changes and tested on a new group of users.
Design steps in – the creative design session
The creative testing session also consisted of four pages, tested on six members of the general public. Users responded positively to the site creative, they commented on the modern style aesthetic, interesting graphics, and the black and white colour palette.
Now that final copy had been placed into the design, participants approved of the tone of voice, describing it as “playful”, “Australian”, “useful”, “youthful” and “real”. They felt it showed that Osko understood its customers, and that it was written by a real human. This copy also helped clarify how Osko could be used and why it was different to a regular bank transfer. After the session, most of the users could correctly describe Osko’s purpose in a short sentence.
With graphics now placed onto the page, we also found some further usability issues. The bank look-up page which had worked well as wireframes was slightly confusing as it showed bank logos. All users immediately wanted to click on these logos when they were not intended to be clickable. When we collated feedback from this testing session the decision was made to remove these logos and allow users to search for their bank by name instead.
Some users still wanted to know how they could get Osko once they found out that their bank had it – this was difficult because Osko worked differently with every bank. In the final build of the website, a link was included to each bank explaining how Osko worked specifically with that bank. This helped solve the issue by having it handled by the users’ own bank in the right environment to start using Osko within their platform.
Osko, a go-go!
Launched earlier this month, Osko has been gaining mass media attention and is now available between 60+ major participating banks and financial institutions 24/7. As users adjust to bank transfers that take less than a minute, and Osko begins to roll out more exciting features, we’ll be keeping the website updated. The final build of the Osko site took bold black and white graphics and added playful animations. With a simple style and friendly copywriting, we think the Osko website is the most interesting financial service website live today… but we may be a little biased. ;)
VISIT THE WEBSITE: www.osko.com.au
Osko and Osko by BPAY are registered trademarks of BPAY Pty Ltd ABN 69 079 137 518.
Joleen Li has been a Senior UX Designer at Adrenalin for over 2 years. She’s a user experience designer with plenty of empathy and a love for finding digital solutions to real world problems. Her background in industrial design gives her a strong focus on ergonomics for the digital space. Jo is a firm believer in colour coding, file naming conventions and inbox zero. Her life goals are to use less plastic and pat more dogs.