ReloPortal Redesign
Phase 1: Scope and Research
ReloPortal Redesign
Phase 1: Scope and Research
ReloPortal Redesign
Phase 1: Scope and Research
Precision Customer Account Page - Header and Alerts Redesign
Company: F**** | Role: Creative Direction, UX/UI Lead | Industry: Banking / SaaS |
Tools: Figma, Miro | Platforms: Web, POS
Project Overview
Our team was tasked with redesigning the Customer Account page after user research revealed that employees struggled to locate critical customer information and alerts quickly. The existing layout forced staff to sift through excessive details,
slowing down their workflow and introducing errors. The project focused specifically on the customer header section and the alerts module, both of which were frequently cited as pain points. I served as the lead designer, managing a junior designer and collaborating closely with the UX research team, developers, and a project manager. The redesign was structured in
two-week sprints over a three-month timeline, with weekly check-ins to ensure that research insights, project goals,
and design iterations remained tightly aligned.
Problem Framing
Back-office banking employees needed to find customer information quickly, understand urgent alerts immediately,
and act with confidence. The previous design buried critical details in noise, increasing the likelihood of missed information and slowing down the update cycle. The redesign aimed to reorganize customer data by priority, surface alerts in real time, and enable employees to act with speed and accuracy.
Legacy screens highlighting the challenges in locating key customer data and alerts
Analysis of legacy screens revealed that critical information was buried within noise, making it difficult for employees to quickly access
and act on alerts. This artifact guided the prioritization of redesign objectives to surface the most important details first.
Research & Insights
The process began with mapping the legacy user flows, which highlighted inefficiencies in locating
and acting on customer data. Through user surveys and interviews, we learned that employees were frustrated by the sheer volume of information and the absence of meaningful filtering. Customers, in turn, wanted more visibility into account alerts and the ability to filter out unnecessary data.
To prioritize which improvements would deliver the most value, the UX research team facilitated an Impact/Effort matrix exercise in FigJam. This activity clarified which features could create the greatest lift without delaying implementation.
Research also included the development of personas and a happy path journey map, pinpointing moments where employees most often encountered friction. Finally, a competitive analysis of peer banking platforms revealed more efficient ways of surfacing alerts and structuring headers.
Impact/Effort matrix for prioritizing features that provide maximum value efficiently
This exercise clarified which improvements would deliver the greatest lift without delaying implementation. Combined with personas,
journey maps, and competitive analysis, it informed design decisions that improved both usability and efficiency.
Design Approach
With research insights in hand, we began sketching early concepts that explored how to simplify the header and alerts experience. These sketches evolved into low-fidelity wireframes, which introduced two core ideas: a totals dashboard at the top of the page for quick access to account summaries, and a right-rail alerts module that consolidated alerts,
transactions, and history into a single, filterable stream.
The design system was extended to support this work, ensuring that typography, color, and iconography not only aligned with brand standards but also provided clarity in high-information environments. Mid-fidelity prototypes were then created in Figma, allowing us to test interaction models for filtering and dismissing alerts.
Mid-fidelity designs exploring simplified header and consolidated alert module
Wireframes introduced a totals dashboard for high-level account summaries and a right-rail alerts module consolidating alerts, transactions,
and history into a single, filterable stream. These mid-fidelity designs allowed testing of interaction models for filtering and dismissing alerts.”
Testing and iteration
We tested the wireframes with bank representatives on-site, gathering feedback about clarity, scanning speed,
and ease of use. Results confirmed that the new information hierarchy made alerts easier to understand and respond to.
Based on feedback, we added contextual tooltips for certain alert types and refined iconography to reduce ambiguity. Iterative prototypes allowed us to validate each improvement and ensure alignment with employee workflows.
Final Design & Solution
The final design featured a streamlined customer header with immediate access to essential account information,
supported by a totals dashboard that provided a high-level overview. The right-rail alerts module grouped notifications by severity, allowed filtering, and enabled quick dismissal, reducing the time needed to scan and act on important updates.
The modernized interface reflected a clean, competitive look that inspired trust and usability.
Final high-fidelity designs of the streamlined customer header and alerts module
The final interface provided immediate access to essential account information. Alerts were grouped by severity, filterable, and dismissable, reducing the time needed to scan and act. The clean, modern interface enhanced trust, usability, and workflow efficiency.
Impact & Outcomes
The redesigned Customer Account page delivered measurable improvements. Initial rollout showed a 47% increase in task completion rates tied to alerts and information retrieval. Employees completed onboarding and updates faster,
while stakeholders reported that the platform now rivaled competitors in both aesthetics and functionality.
Building on this success, the enhanced design was extended to Business Account pages, creating consistency
across the Precision ecosystem.
Final account pages showing improved usability, consistency, and visual hierarchy
The redesign delivered a 47% increase in task completion rates for alert-related activities. Employees onboarded and updated accounts faster,
while stakeholders reported the platform now matched or exceeded competitors in aesthetics and functionality.
The design system improvements extended to Business Account pages, creating consistency across the Precision ecosystem.
Reflection
This project underscored the importance of designing for information hierarchy in environments where efficiency directly impacts accuracy. By combining strong research, iterative testing, and careful design system alignment, we created an experience that balanced clarity with speed. The enhancements not only improved day-to-day employee workflows
but also established a scalable foundation for future product growth.