.png)
UI Design
Theme Builder
Theme Builder is an internal admin product designed for Alkami’s financial institution clients to customize and brand their digital banking platform. It enables credit unions and banks to apply their unique brand identity—colors, typography, logos, and imagery—across the Alkami platform, ensuring visual consistency with their public-facing brand.
Impact
Built with flexibility and scalability in mind, Theme Builder leverages design tokens and component theming to allow clients to preview changes in real time and apply updates without requiring direct developer involvement. It supports multiple themes per institution, responsive theming across device types, and the ability to quickly roll out brand changes while maintaining accessibility and usability standards.
Why Theme Builder?
80%
Reduction in Implementation Time
Allows clients to self-manage branding without engineering support and automated the design support process.
60%
Decrease in Support Tickets
Decreased any design support tickets related to theming and UI customization. There are still tickets for first time clien to help support.
325
Clients Using Theme Builder
Majority of clients are utilizing Theme Builder to create multiple themes for their users.
$500-750K
Estimated Saved Annually
Reduced engineering hours, support overhead, and manual customization effort.
What are the perks?

Client
Empowerment
Financial institutions can customize their digital banking experience to match their brand, without relying on developer support, giving them greater control and flexibility.
.png)
Brand Consistency for
Desktop & Mobile
Consistent branding across desktop and mobile, helping credit unions and banks maintain trust and visual alignment with their public-facing platforms.

Different Themes for Different Users
Supports multiple themes within the same platform for different user types, making it easy to manage white-label customizations at scale.

Faster Time-to-Launch
Reduces manual design and engineering effort by enabling real-time theme previews and quicker rollout of brand updates, speeding up implementation timelines.
The Audit
An evaluation of the current desktop shell revealed several critical issues affecting usability, maintainability, and overall product integrity. The shell lacked responsiveness, does not meet modern security protocols, relies on outdated libraries, and exhibits performance bottlenecks—all of which limit scalability and pose risk to the user experience and business.
1. Not Responsive
The current shell is built using a fixed-width layout that did not scale across screen sizes, creating usability issues on smaller screens and non-standard devices. This limits accessibility and increases maintenance effort for cross-device support.
2. Outdated Library and Frameworks
Core libraries and dependencies were outdated, lacking support for modern development practices and accessibility standards. This increases technical debt, compatibility issues, and security vulnerabilities.
3. Poor Performance
Heavy assets, unoptimized rendering logic, and lack of lazy loading contribute to slow load times and poor performance metrics. These issues degrade user experience and negatively impact search engine rankings and engagement.
The Foundation
Modernizing the shell improves the user experience, enhances performance, and reduces development risk. It enables faster development, supports scalability, and aligns with current web standards, positioning the platform for long-term success.
.png)
Utilizes Design System Tokens
Theme Builder is deeply integrated with the design system at its core, using design tokens to drive all theming capabilities. Design tokens are the smallest, platform-agnostic pieces of a design system—representing values like color, typography, spacing, shape, and elevation. In Theme Builder, these tokens are exposed through a user-friendly interface that allows clients to customize their digital banking platform while maintaining alignment with the underlying design system.
Instead of hardcoding styles or relying on overrides, Theme Builder references token variables that dynamically update UI components across the experience. When a client selects a new primary color, adjusts font styles, or changes corner radius settings, these changes are applied directly through the token layer—ensuring consistency, maintainability, and responsiveness across all devices and components.

User Audience Based Themes
In addition to branding their platform, clients can use Theme Builder to create audience-specific theme packages, allowing them to dynamically apply different themes based on user attributes such as age, location, account type, or persona segment.
For example, a credit union may create a vibrant, youth-friendly theme specifically for teen users, featuring bold colors, larger text, and playful visual cues, while maintaining a more traditional, professional look for adult account holders. These themes can be applied programmatically through user segmentation, giving financial institutions the power to personalize the banking experience without needing multiple platforms or redundant design work.
Personalized Experiences
-
Tailors the UI to resonate with different demographics or user needs (e.g., teens, seniors, business users).
Stronger Engagement
-
A themed experience that feels age-appropriate or community-specific can increase connection and retention.
Efficient Scalability
-
Packages are defined once and can be applied across user groups without duplicating theming logic.
Marketing Alignment
-
Institutions can align seasonal promotions or audience-specific campaigns directly into the platform’s visual experience.

The Outcome & Business Goal
Theme Builder empowers Alkami’s clients to fully customize their digital banking platforms without developer involvement, significantly reducing implementation time and support costs. By enabling real-time theming through design tokens, it ensures brand consistency, improves time-to-launch for new clients, and scales effortlessly across hundreds of institutions. Additionally, audience-based theming packages allow clients to deliver personalized experiences that boost user engagement and retention—turning visual customization into a strategic business advantage.
.png)
.png)


View Other Projects
Scroll through my projects to find another one to read about that tickles your fancy

.png)

.png)


.png)
