I improved Logix Banking's ATM by addressing issues of unclear instructions for first-time users and the absence of tap/digital card capabilities through research and testing.
Based on findings from online research and kiosk testing, I designed a user-friendly interface that reflects the bank's brand and enhances accessibility for all users, including those with disabilities. The redesigned ATM now offers clear instructions and tap/digital card support, resulting in an overall enhanced user experience.
I will be taking a look at Logix’s ATM’s located at their own locations rather than their third-party multi-bank ATM’s. For this project, I specifically looked at the Woodland Hills Logix Branch ATM.
In all honesty, I have only used an ATM about 3-4 times in my life so far, and they have been from larger banks such as Bank of America. I live in an area that I am able to get by without cash and contactless payments.
Ultimately, I am classified as a new ATM user that has some knowledge on how the machine should work.
Location wise, the ATM is easy to spot with its strong orange branding and large size.
The machine is located outside the building, allowing use during closed hours. This was located about 10 feet left of the entrance of the building, making it easier to complete tasks inside out outside the building.
At a closer look, the main point of business of the ATM is reachable by users such as those in wheelchairs, making the machine physically accessible. Braille is also included on the physical buttons and instructions surrounding them as well, making it usable by those with visual impairments. Additionally, there are mirrors above (most likely cameras), but are helpful to spot activity happening around the user in case of issues such as privacy invasion or robbery.
Overall, everything looks like your typical branch ATM.
I ran into several issues as a fairly new ATM user:
Where do I start?
After approaching the machine, I was in awe at how I did not know what to do.
I was expecting the screen to instruct the user on how to start, but, instead, was faced with rotating ads for promotions and benefits of using Logix Smarter Banking.
This is fair to do since Logix is a smaller credit union that needs to promote their services more than larger banks to increase their outreach and revenue. However, it did not help me understand how I can start my transaction.
It was not until after reviewing photos of the machine at home where I realized above and below the card slot says “Insert Card and Leave in Slot” in small text. It would be beneficial to rewrite it to say “Insert Debit Card and Leave in Slot to Start” to clarify instructions to the user. Also, in order of visual hierarchy looking at the ATM, its placement is not optimal for someone to know how to start right away.
Despite it being common knowledge on having to insert your debit card to start the ATM process, it is important to help first-time users who do not have prior knowledge to know how to start without having to be confused in public or having to ask/call for help.
Why is my tap not working?
With the rise of contactless payments in the post-pandemic world, many ATM’s have the capabilities to tap your card to start your transaction instead of inserting your card. With my prior usage of ATM’s at Bank of America, I instinctively used my phone to tap my debit card onto the tap area, yet there was no reaction. I was left confused until I took out my physical debit card to insert.
Observing users and personally having my older family member use the machine, they were also confused about the state of the tap area of the machine. If tap is not able to be used for any reason, it should be stated on the machine whether by UI or even a sticky note.
Why am I overwhelmed?
With the amount of activity happening on the screen in conjunction with the hardware around the screen, this was fairly overwhelming to interact with. The ads added a level of stress unnecessary for the user. The UI itself once the ATM process starts is simpler and less cluttered in contrast to the start screen.
How does this work for a user who needs audio?
With concern about accessibility for users with visual impairments or to those who need audio commands, I was confused on how the machine worked its screenreader without a dedicated controller or buttons next to the screen. However, I was joyfully surprised to find out how it worked.
I will base the hierarchy of actions on the Main Menu based on this data.
Cash Withdrawal
Money Transfer
Deposit
Pin Change
It is important to design with users with sensory disabilities in mind with self-service kiosks like ATMs.
The following data was obtained from a study conducted by CNIB Foundation aimed to identify infrastructural and design elements of self-service kiosks (SSK) that contribute to barriers to use the technologies for individuals with sensory disabilities. Approximately 600+ individuals with sensory disabilities responded to this survey.
Audio & audible instructions
Clear & easy to follow instructions & menus
Enlarged information on screen and enlarged fonts
Multiple mechanisms to request human assistance
Feedback and cues on important actions and error correction
Human assistance was unavailable or unhelpful
Time limit for actions, such as to read and input information
Poor color contrast and font size
In addition to testing the visual design and navigation of the ATM on the screen, I tested speech mode as well.
As stated before, I was confused on how the speech mode worked without formal controls. However, after starting speech mode, I realized the number pad was the control, making it a similar experience to automated services over the phone. Each number was correlated to an option when navigating the menu, and every option was read out loud.
This was very simple to follow as someone who occasionally struggles following audio commands. Also, you do not need to move your hand off the number pad for the most part unless you have to navigate to the slots on the machine. A handy feature is that the voice over is able to navigate you to any slot on the machine in relation to the number pad. For example, if you were getting cash dispensed, the machine would tell you that the cash dispense slot is 5 inches south of the number pad which you are able to confirm with the braille labels.
Something to note is that the process was completely auditory. The screen being turned on was optional, so there were no visual indications occurring on the screen while navigating through the menu since the options are based on the number pad.
Based on these findings, I have created a user flow that outlines the screen mapping of the kiosk.
The button placement on every screen is based on the side buttons hardware on the ATM. There are 4 buttons on each side of the screen, and they are aligned to the button options on the screen.
Instead of the ads, a starting screen was added that instructs the user how to start their process (the ads will be placed on the exterior of the ATM instead of on the screen).
"Tap Card" was added to accommodate users who do not have their physical card in possession.
Whether there are technical difficulties or a user needs assistance with their transaction, at any point a user can either have a live or in-person assistant, depending on the bank hours.
This is also based on the needs of users with disabilities: 87.9% of users require Human Assistance with self-service kiosk (CNIB Study).
According to Mada's Top 10 Ways to Make ATMS Accessible, a internal magnifier capable of 20x and 30x zoom is required in an easy place to find on the interface. Therefore, the zoom button placeholder was added for future building.
Conduct user testing with current prototype
Create the flows for additional tasks done at an ATM
Test screen reader ability with current prototype
Add the ability to increase font sizes
Add a time limit feature that is not too short for users that need longer times between actions
Incorporate custom icons
Feedback and cues on important actions and error correction
