About the project

Afirme Bank's ATM interface was outdated and unintuitive, requiring multiple steps for basic operations like cash withdrawals. The user experience was inefficient and lacked clarity.

The challenge was to redesign the experience across multiple ATM platforms while balancing customer needs, accessibility standards, operational requirements, and the bank's new visual identity.

As part of a multidisciplinary team, I contributed to UX strategy, information architecture, interaction design, visual design, and stakeholder collaboration throughout the project lifecycle.

Discovery phase

Discovery & Stakeholder Alignment

Before moving into design, we conducted stakeholder interviews and collaborative workshops with business leaders, product stakeholders, technical teams, customer service representatives, and project managers.

The objective was to gain a comprehensive understanding of:

• Existing user pain points

• Customer expectations and behaviors

• Business goals and operational requirements

• Technical limitations across ATM platforms

• Opportunities for future scalability

This discovery phase helped establish a shared vision across teams and ensured alignment between user needs, business objectives, and technical feasibility.

My contribution

• Participated in stakeholder workshops

• Collaborated with UX leadership and client teams

• Synthesized findings into actionable design opportunities

• Helped define the future ATM experience strategy
  
  

Workshop goals

Defining the future ATM Experience

Through collaborative workshops, we analyzed customer behaviors, identified critical transaction journeys, and mapped opportunities to improve the overall ATM experience.

Our work focused on understanding:

Customer profiles

• Banking habits and behaviors

• Digital literacy levels

• Transaction frequency

• Customer expectations

Journey mapping

• Key tasks performed at ATMs

• Pain points during transactions

• Emotional states throughout the experience

• Moments of confusion or abandonment

Experience opportunities

• Simplifying navigation

• Reducing cognitive load

• Improving transaction efficiency

• Increasing confidence and clarity during operations

These insights established the foundation for a customer-centered redesign strategy.

Sketching

Experience Architecture & Content Exploration

Using workshop insights and journey mapping outputs, we redefined the information architecture and interaction model for the new ATM experience.

I translated research findings into early concepts and paper prototypes, rapidly exploring navigation structures, transaction workflows, and screen organization.

This iterative process allowed the team to validate ideas quickly, align stakeholders around potential solutions, and identify usability improvements before investing in higher-fidelity designs.

Focus Areas

• Transaction prioritization

• Navigation simplification

• Information hierarchy

• Screen organization

• Reduced interaction complexity

Wireframing

Wireframing & Interaction Design

After validating initial concepts, I developed low-fidelity wireframes in Adobe XD to establish the structure and interaction patterns of the redesigned ATM experience.

The wireframing phase focused on creating intuitive user flows while ensuring consistency across multiple ATM configurations.

Key Design Considerations

• Streamlined transaction paths

• Faster access to high-frequency actions

• Improved readability and information hierarchy

• Consistent interaction patterns

• Scalable layouts for different ATM hardware

Multiple iterations were reviewed with stakeholders and technical teams to balance usability, business requirements, and implementation feasibility.

Three phases

Designing across multiple ATM Ecosystems

One of the project's primary challenges was creating a unified customer experience across different ATM technologies.

To support Afirme's modernization roadmap, the redesign was structured into three phases.

Visual design - Phase 1

Visual Modernization

The first phase focused on aligning the ATM experience with Afirme's refreshed brand identity while maintaining the existing interaction model.

The objective was to improve visual consistency and strengthen brand recognition without requiring changes to customer behavior.

Design Improvements

• Updated visual language

• Improved typography hierarchy

• Enhanced readability

• Stronger brand presence

• Consistent visual patterns

This phase provided an immediate modernization of the ATM ecosystem while reducing implementation risk.

Visual design - Phase 2

Reimagining the Button-Based Experience

This phase moved beyond visual improvements and focused on redesigning the ATM interaction model for devices using physical navigation buttons.

The challenge was to create a more intuitive experience within the constraints of non-touch hardware.

UX Improvements

• Simplified navigation structure

• Reduced cognitive load

• Clearer transaction pathways

• Improved content prioritization

• Enhanced feedback during key actions

The resulting experience allowed customers to complete common transactions faster and with greater confidence.

Visual design - Phase 3

Designing for Touch Interaction

The final phase introduced a modern multi-touch ATM experience designed around contemporary usability standards.

With fewer hardware limitations, we were able to create a more flexible and intuitive interaction model.

Key Enhancements

• Touch-first interactions

• Improved task discoverability

• Larger touch targets

• Modern navigation patterns

• Greater accessibility and ease of use

The redesign aligned the ATM experience with customers' growing expectations shaped by mobile and digital products.

Outcome

The redesign established a scalable ATM experience that balanced customer needs, operational requirements, and Afirme's long-term digital transformation strategy.

Key UX Achievements

• Simplified transaction flows for high-frequency banking activities

• Improved information architecture and navigation clarity

• Enhanced readability through better typography, hierarchy, and spacing

• Increased usability across both physical-button and touch-screen devices

• Created a consistent experience across multiple ATM platforms

• Successfully aligned the experience with Afirme's new visual identity

• Introduced modern interaction patterns while maintaining familiarity for existing customers

Validation & Testing

To validate the redesigned experience, phases two and three were tested using an interactive HTML prototype with 14 participants over a five-day evaluation period.

The findings helped identify usability improvements, validate design assumptions, and refine the final experience before implementation.

Final Impact

The three redesign phases were successfully implemented, delivering a modernized ATM ecosystem that improved usability, strengthened brand consistency, and created a foundation for future ATM innovation.