Donald Armstrong / Principal UX Engineer

Design tokens.AI, applied.

Design-minded.
Engineering-led.AI / Systems / Code

I connect design intent to production code through design-token architecture, reusable components, and AI-assisted engineering.

Explore the work
Experience acrossAdvance LocalAmerican Heart AssociationFleetcorAT&T

01 / AI & design tokens

From design intent
to working systems.

Two connected areas of practice: structured design decisions and AI-assisted engineering with hands-on review.

Advance Local · 2026–present

Connecting Figma
to GitLab.

I developed an AI-assisted design-token workflow that connects design-system requirements with reusable frontend components and implementation.

My role: Principal UX Engineer

TypeScriptFigma Plugin APIFastifyGitLab APIsesbuildVitest
My contribution

Design meets engineering

I translated Figma concepts and design-system requirements into token structures, reusable components, and production-ready implementations.

AI-assisted, with engineering ownership

I use prompt-guided exploration, technical research, and code analysis to move the work forward. I review, refine, debug, and validate the implementation across platforms and devices.

Beyond the token workflow

The same approach supports my work on Sailthru subscription and preference experiences, cross-client email templates, and responsive Piano modules.

Workflow overview

01 / Design intentFigmaDesign-system requirements
02 / Shared decisionsDesign tokensReusable structures
03 / EngineeringGitLabImplementation & validation

AI supports the work.
I own the engineering decisions.

Design-token architecture

One shared language.

Color · Typography · Spacing

Brand themesDark mode
ReactReact NativeStorybook

Consistent decisions.
Room for each product’s identity.

Fleetcor · 2023

A shared language
for design and code.

I helped connect design and development through design-token architecture for the UCX Global Design System, supporting multiple brands, themes, and dark mode.

My role: Senior UI Designer / Architect

Design tokensMulti-brand systemsReact & React NativeStorybook
Architecture, adoption & collaboration

Reusable foundations

I developed components from Figma designs, curated the component library, and worked with product, design, and engineering teams to support consistent experiences across platforms.

Bringing the team along

I mentored and managed a global React team and co-authored “Design Tokens: A Unified Future” with my managers, Stephen Brown and Travis Peck. The 2023 presentation explained the shared value of tokens for designers, developers, UX managers, and product owners.

A practical path to adoption

Our presentation explored ways to connect existing design tools with development workflows, including token formats, distribution, and automation. These were part of the 2023 evaluation.

02 / How I think about systems

One decision.
Many consistent experiences.

Design tokens make decisions explicit. AI helps me explore and implement. Review and validation keep the work grounded.

Structure first.
Then accelerate.

I start with the requirements and the design system. From there, I use AI to explore options, investigate code, and refine solutions—while staying responsible for usability, implementation, and production readiness.

  1. Define the intent.Clarify requirements and reusable design decisions.
  2. Build with context.Use AI-assisted exploration alongside hands-on engineering.
  3. Review and validate.Inspect the code, debug the details, and test across devices.
Try a token-driven theme

Illustrative example · not a client product

Shared component

Same structure.
A different expression.

Change the theme. The surface, text, and accent colors update together.

Accent token
surface: #ffffff
text: #182c29
accent: #182c29
surface: #182c29
text: #f5f4ef
accent: #d8ed86
surface: #f1eafb
text: #34213f
accent: #543b6a

03 / Design systems in practice

Reusable foundations.
Real product work.

My work on design systems also spans AT&T’s Digital Design System HUB and the American Heart Association’s school platform.

AT&T · Digital Design System HUB

Making components usable.

I contributed to the React implementation of the HUB, translated Figma designs into components, and built a Flex Card configurator with real-time options.

Components & documentation

My work included pages for Themes, Flex Card, Motion Guidelines, Benefits Panel, and ShellCard. Data abstractions and templates supported reuse, readability, and scalability.

The configurator made component variants tangible through choices for layout, height, headings, background color, and content.

American Heart Association · 2024–2025

A foundation for school engagement.

As Senior UI Architect, I led redesign and support efforts for the school platform and developed a custom component library with responsive design guidelines.

20,000+schools served
30%more engagement
25%less production time

Reported results from the school engagement platform work.

04 / Additional work

A broader range of experiences.

Mobile apps, interactive experiences, and the systems that connect them.

Explore mobile, kiosk & signage projects
HAIL — Smart City interface from Donald Armstrong’s portfolio

Transportation / AT&T

HAIL — Smart City

Ground-transportation choices brought together in one airport kiosk experience.

Project details

The work

A kiosk experience for Chicago O’Hare that brings ground-transportation choices into one clear interface, comparing CTA, rideshare, taxi, and shuttle options.

Explore the original screens ↗
BizQuiz interface from Donald Armstrong’s portfolio

Mobile learning / AT&T

BizQuiz

A quiz app connecting bite-size learning, friendly competition, and mobile delivery.

Project details

The work

An interactive quiz experience with leaderboards and a content-management backend. I developed the Ionic prototype for iOS and Android, then migrated it to Ionic 5 and Angular 9 for integrated PWA support.

Explore the original screens ↗
mTAP Holiday & Gift Decider interface from Donald Armstrong’s portfolio

Retail / AT&T

mTAP Holiday & Gift Decider

A holiday retail experience that connects digital signage with mobile gift discovery.

Project details

The work

A holiday experience spanning digital signage and mobile, with a guided Gift Decider. Designed and developed using React, HTML, CSS/Sass, JavaScript, and JSON.

Explore the original screens ↗
More mobile, lab & signage work
Trigger interface from Donald Armstrong’s portfolio

Lab tools / Mobile prototype

Trigger

A mobile control interface for demonstration content across two innovation labs.

Project details

The work

A mobile prototype for controlling demonstration content in the Alpharetta and Dallas labs, including UX wireframes, UI design, identity, and an Ionic application for iOS and Android.

Explore the original screens ↗
Journey App interface from Donald Armstrong’s portfolio

Retail lab / Mobile prototype

Journey App

An extensible mobile experience for retail-lab demonstrations.

Project details

The work

An extensible retail-lab demonstration app. I translated the UX team’s direction into an Adobe XD prototype, then delivered an Ionic 4 application and CMS backend.

Explore the original screens ↗
LWDGO interface from Donald Armstrong’s portfolio

Research / Progressive web app

LWDGO

Exploring progressive web app delivery for learning and engagement.

Project details

The work

Research into PWA delivery followed by UX wireframes, UI design, and a working prototype reflecting the existing iOS app’s engagement, learning, and media experiences.

Explore the original screens ↗
PIP Lower Third interface from Donald Armstrong’s portfolio

Digital signage / AT&T

PIP Lower Third

Dynamic weather and messaging brought into a video signage layout.

Project details

The work

A OneLan signage layout combining video, animated messaging, and dynamic weather. HTML, CSS, jQuery, JSON, and XML supported data-driven content updates.

Explore the original screens ↗

05 / Skyymap archive · 2002–2011

Earlier work. Lasting curiosity.

A selection from my years leading Skyymap, across music, learning, and interactive products.

MasterCraft Boat Configurator interface from Donald Armstrong’s portfolio

Skyymap archive / 2002–2011

MasterCraft Boat Configurator

An interactive boat configurator showing hull, deck, interior, and color choices.

UsherWorld interface from Donald Armstrong’s portfolio

Skyymap archive / 2002–2011

UsherWorld

An artist website bringing music, media, fan content, and a distinctive visual identity together.

The Coca-Cola Company — DNA interface from Donald Armstrong’s portfolio

Skyymap archive / 2002–2011

The Coca-Cola Company — DNA

An interactive marketing-learning course built with the KOI Player, combining video and guided navigation.

AT&T Mobile Out of Box interface from Donald Armstrong’s portfolio

Skyymap archive / 2002–2011

AT&T Mobile Out of Box

An iPad in-store onboarding experience built with HTML5, CSS3, and jQuery.

06 / About Donald

A designer’s eye.
An engineer’s
follow-through.

I like making complicated things feel intuitive—and seeing them all the way through.

My focus is the connection between design systems and engineering: reusable tokens, adaptable components, and AI-assisted workflows. I bring creative direction and UX/UI experience to the technical decisions that make a product work.

Before my enterprise roles, I led Skyymap as CEO and Principal UI/UX. Beyond the screen, I bring the same attention to detail to live sound and mixing.

2026–presentPrincipal UX Engineer · Advance Local
2024–2025Senior UI Architect · American Heart Association
2023Senior UI Designer / Architect · Fleetcor
2008–2023Senior UI Designer & Mobile App Developer · AT&T
2002–2012CEO / Principal UI/UX · Skyymap
“His ability to bridge design and engineering elevated not just the user experience but the entire team’s standard of craftsmanship.”
Marc Blezamour · Senior Engineer, American Heart Association

07 / Start a conversation

Let’s connect your
design and engineering.

Email Donald ↗