Emotional & Functional Color Strategies for Upwise
The MetLife Upwise App employs a detailed color token system to ensure visual consistency, accessibility, and to convey users' emotional states regarding their financial status.
Highlight colors are the brand colors used primarily throughout the user interface, while specific shades represent various emotions such as anxiety, confidence, and contentment. Additionally, category colors help streamline navigation and enhance user understanding. Each color choice meets WCAG AA standards for readability, ensuring an accessible and cohesive user experience across the app. This structured approach supports intuitive design and effective communication of financial emotions.
Noto is a global font collection for writing in all modern and ancient languages. Noto Sans is an unmodulated (“sans serif”) design for texts in the Latin, Cyrillic and Greek scripts, which is also suitable as the complementary choice for other script-specific Noto Sans fonts. It has italic styles, multiple weights and widths, and 3,741 glyphs. via Google Fonts
Creating Harmony through Collaboration
Working on the MetLife Upwise App, I had the pleasure of collaborating closely with the UX research team and developers. Together, we designed a comprehensive library of reusable components. These modular and adaptable components made development smoother and ensured consistent design, providing a cohesive user experience throughout the app. This teamwork and structured approach allowed us to create a visually harmonious and user-friendly application, blending efficiency with intuitive design.
The Money section of the Upwise App provides users with a comprehensive overview of their financial accounts, including checking, credit cards, cash, insurance, investments, loans, and more. I contributed by developing a design system to ensure consistency, designing an intuitive interface for easy navigation, and conducting user research to align the section with user needs. This collaborative effort resulted in a user-friendly and visually appealing Money section that helps users manage their finances effectively.
The Credit Score feature for the Upwise app empowers users with tools to track and improve their financial wellness. Designed with clarity and accessibility in mind, these screens allow users to view their credit scores in real-time, receive personalized financial tips, and track progress through intuitive visualizations.