Better Money Habits Components

As part of the Better Money Habits modernization, the article templates were redesigned to reflect the updated digital brand, improve visual consistency, and streamline authoring for content teams.

Role: Lead Experience Designer
Client: Bank of America
Platform: Responsive web
THE PROBLEM

Articles were inconsistent and off-brand, using outdated visuals and one-off layouts that didn’t align with the design system. The redesign introduced standardized components to improve readability, consistency, and scalability.

Building a flexible content system

Requirements & exploration

Design exploration based on client briefs and brand direction established visual and structural alignment.

Article template redesign

Layouts were standardized for steps, lists, and definitions to improve readability and consistency.

System integration

Templates were built within the enterprise system and evolved for flexibility and scale.

Cross-team collaboration

Designers, strategists, and developers partnered closely to ensure consistency and seamless implementation.

Disjointed to unified

The redesigned templates replaced inconsistent layouts and off-brand imagery with cohesive, reusable components built directly in the CMS. SVG-heavy infographics gave way to standardized charts and tables that created consistency across the ecosystem and tightened branding across the site. Each article template incorporated elements users expect: key ideas at the top, section links for easy navigation, and related article suggestions to encourage further exploration.

Outcomes & impact

Usability testing confirmed that the redesigned navigation made content easier to find and understand. Participants described the experience as simple and intuitive, and clearly recognized Better Money Habits as a financial education resource.

Improved visual consistency

Templates now follow a unified structure that aligns with the enterprise design system.

Faster design & authoring

Shared components reduced design time and simplified content creation for editorial teams.

Scalable framework

Patterns can expand easily as new topics and formats are added to the platform.

Stronger brand alignment

Articles and guides now fully reflect Bank of America’s digital brand standards, building trust and cohesion.