Frost Bank.com Redesign

Frost Bank is celebrated for its "legendary customer service," yet its digital front door—the homepage—had become a bottleneck. As a UX Designer, I led the strategic effort to rebuild the frostbank.com experience. This wasn't just a "skin job"; it was a full-scale overhaul to align a 150-year-old brand with the expectations of a modern, tech-savvy audience (including Gen Z) while maintaining its human-centric soul.

The Challenge: A Digital Disconnect

Despite high JD Power rankings, the existing homepage failed to communicate the "Frost Difference." Through initial audits and stakeholder workshops, we identified critical failures:

Static Branding: The design felt dated and failed to showcase Frost as a modern bank with great technology.
Invisible Products: Key offerings (Checking, Mortgage, Wealth Management) were buried in deep navigation.
Cluttered Hierarchy: The beloved "Photo of the Day" (FOD) was a flat wallpaper that distracted from the primary Call-to-Actions (CTAs).
Operational Risk: With 140 colors and 10 fonts in use, the brand was fragmented and difficult for developers to maintain.

The Framework: A Three-Phase Strategy

Phase 1: Intake & Investigation

We started by establishing a baseline. I ran design principles workshops to ensure every button and pixel reflected Frost’s vision.

Baseline Testing: We ran UserTesting on the legacy design to measure Time on Task and Success Rates, giving us a quantitative "score" to beat.
Visual Audit: I documented the discrepancies in the "L1" experience to prevent future development rework.

Phase 2: Ideate & Iterate (The Visual Identity)

We explored five core elements—Typography, Color, Imagery, Sizing, and Motion—within a DLS framework.

Typography: We transitioned to a primary pair of Brandon Grotesque and Internacional, supported by Mercury Text for a classic yet modern touch.
Color Usage Rules: I established strict rules for the primary palette (using F200 for main CTAs only) and a secondary palette for imagery decoration.
Inclusive Design: We committed to a 4.5:1 contrast ratio for regular text to ensure full ADA Compliance.

Phase 3: Sprint Support & Go-Live

I collaborated with devs and QA to hand off "dev-ready" files, ensuring the transition from Figma to live code was flawless.

The Design System (DLS)

To solve the "140 colors" problem, I developed a unified system that bridges the gap between L1 (Marketing) and L2 (App/Aurora)

Shared Core: Both experiences now share the same Typography, Type Scale, and Color Palette.
Unique Attributes: Marketing (L1) retains its unique photography style, while the App (L2) utilizes extended form fields for complex transactions.

The Results:The "Impact"

Consistency: Reduced brand fragmentation from 10 fonts/140 colors to a streamlined, accessible DLS.

Modern Aesthetics: Transformed the homepage into a dynamic, interactive experience that showcases "The Frost Difference".
Engagement: By featuring key products prominently, we removed the friction from the user journey.
Speed to Market: Established a "fast-follow" rollout plan, launching the refreshed homepage by the end of 2023 with a full rebranding update in January.

"This framework doesn't just change how Frost looks; it changes how we build. By answering 'What if?' with 'We tested that,' we gave the bank a digital system as reliable as its service."

Frost Bank.com Redesign

Frost Bank.com Redesign

Frost Bank.com Redesign

The Challenge: A Digital Disconnect

The Framework: A Three-Phase Strategy

Phase 1: Intake & Investigation

We started by establishing a baseline. I ran design principles workshops to ensure every button and pixel reflected Frost’s vision.

Baseline Testing: We ran UserTesting on the legacy design to measure Time on Task and Success Rates, giving us a quantitative "score" to beat.

Visual Audit: I documented the discrepancies in the "L1" experience to prevent future development rework.

Phase 2: Ideate & Iterate (The Visual Identity)

We explored five core elements—Typography, Color, Imagery, Sizing, and Motion—within a DLS framework.

Typography: We transitioned to a primary pair of Brandon Grotesque and Internacional, supported by Mercury Text for a classic yet modern touch.

Color Usage Rules: I established strict rules for the primary palette (using F200 for main CTAs only) and a secondary palette for imagery decoration.

Inclusive Design: We committed to a 4.5:1 contrast ratio for regular text to ensure full ADA Compliance.

Phase 3: Sprint Support & Go-Live

I collaborated with devs and QA to hand off "dev-ready" files, ensuring the transition from Figma to live code was flawless.

The Design System (DLS)

To solve the "140 colors" problem, I developed a unified system that bridges the gap between L1 (Marketing) and L2 (App/Aurora)

Shared Core: Both experiences now share the same Typography, Type Scale, and Color Palette.

Unique Attributes: Marketing (L1) retains its unique photography style, while the App (L2) utilizes extended form fields for complex transactions.

The Results:The "Impact"

Consistency: Reduced brand fragmentation from 10 fonts/140 colors to a streamlined, accessible DLS.

Modern Aesthetics: Transformed the homepage into a dynamic, interactive experience that showcases "The Frost Difference".

Engagement: By featuring key products prominently, we removed the friction from the user journey.

Speed to Market: Established a "fast-follow" rollout plan, launching the refreshed homepage by the end of 2023 with a full rebranding update in January.