The goal of this project is to redesign the current LBC ATM/Branch Locator web page to align with the new brand identity, updated design patterns, and improved user experience.
The current LBC ATM/Branch Locator webpage has not yet been updated to align with the bank’s new online branding design. In addition to its outdated appearance, the page presents several usability issues that contribute to a poor user experience. To address these concerns, three primary design solutions have been proposed:
For Phase 1 of this project, the first design solution—a simplified Branch/ATM locator consisting of a plain list without any map integration—will be implemented. The below Work Sample section presents the final design of Solution #1, alongside a comparison with the current branch locator page.
I led a discovery phase prior to UI design, conducting persona development and user journey mapping to identify key user pain points and align stakeholders. These insights guided the design strategy, and I ultimately delivered a redesigned Branch/ATM Locator webpage that aligns with the new brand identity and updated design patterns.
The following before-and-after comparison illustrates the enhancements made in the redesigned LBC Branch and ATM Locator webpage.
The second image in the carousel shows a brief user journey for current state and future state in comparison charts while the third image showing the detailed version of the final UI design.
The initial User Persona Exercise in Figma Jam for all three scenarios/design solutions.
User journey mapping exercise; showing the initial User Journey Mapping exercise paired with mid-fidelity UI mockups to visualize key user flows and design solutions. The 4th image showing a summaried version of user journey map in chart format for all 3 design solutions.