Overview
NOVA was how we referred to AT&T’s brand refresh. As the new brand rolled out, we began introducing it into our design system and merchandising ecosystem. At the same time, teams were moving fast and delivering with a growing mix of legacy components and newly introduced NOVA components.
My role
As the Lead UX Designer, I worked as a liaison across brand, content strategy, design, standards, product, and platform teams to help define the components that make up the upper‑funnel library.
This work required balancing brand ambition, platform constraints, and business urgency. My role was often about connecting the necessary dots to translating brand goals into something the platform could support, while keeping teams moving forward.
Reframing the problem
AT&T leadership kicked off the rebrand with our agency partner, Basic. This introduced updated core visuals, a color shift, bold typography, and illustration. In addition to the brand package, a set of core page studies was delivered. These were intentionally aspirational: light on copy, minimal constraints, and no legal. The challenge was that those studies didn’t reflect real‑world conditions.
To bring the rebrand into production, we needed to close the wide gap between the idealistic brand studies and the realities of upper funnel content such as long copy, legal requirements, multiple CTAs, and platform constraints. Without that translation, the system wouldn’t realistically scale.
It was clear that we couldn’t treat components as layouts anymore. They needed to be treated as products. Instead of designing static compositions, we defined each component with:
- Clear inputs and outputs
- Explicit authoring rules
- Documented feature support for media, motion, legal, and CTAs
This moved us away from one‑off, idealized designs and toward components teams could use, deliver, and maintain. It allowed the brand to show up consistently across real pages, under real constraints, without slowing teams down or fragmenting the experience.
Flexibility First, Consistency Later
One of the most important decisions we made early on was to prioritize flexibility and reuse over immediate visual consistency.
There was real pressure to move fast and push components quickly. But locking designs too early, before we were able to use real content and scenarios, would have put us at risk of breaking the brand guidelines as soon as teams began using them in production.
Instead, we intentionally built a flexible, repeatable foundation with guidelines on how to use them. The goal was to support a wide range of real‑world use cases first, knowing we could layer in tighter visual consistency, enhancements, and refinements over time without breaking the system.
This approach allowed teams to move faster with confidence, while giving us space to reinforce the brand through clear guidelines, documentation, and workshops. Those efforts helped spread component intent across teams, ensuring the system evolved in a consistent, aligned way rather than fragmenting under speed.
Defining the Component Requirements
To reduce ambiguity and prevent scope creep, I worked with partners to map feature requirements early and make them explicit. This included documenting support for:
- Themes (On dark, on light, white, light blue)
- Media types (image, video, animation, GIF)
- Motion behaviors (on‑load, on‑scroll)
- Legal patterns (short legal, long legal, tooltips)
- CTA variations (text links, buttons)
- Responsive behavior across breakpoints
By being clear upfront, we reduced downstream friction with platform teams and avoided late‑stage surprises.
Designing for Reality, Not Perfection
Another key decision was to design for authoring reality, not just visual polish. Many early NOVA concepts didn’t account for real content variability, legal requirements, or Sanity limitations. Rather than pushing those issues downstream, I adapted designs to match how teams actually work.
That meant:
- Designing within DUC 3.0 standards
- Anticipating inconsistent content lengths
- Supporting stacking vs. scrolling on mobile
- Accounting for real merchandising use cases
This helped connect the dots between design intent and real‑world usage. Most importantly, it reduced the need for constant design intervention later.
Process
Understand
After reviewing the global redesign direction, I facilitated cross‑functional workshops with partners across brand, governance, business, legal, billing, and engineering. These sessions surfaced key pain points and aligned teams on the core functional needs for each component.
Explore
We validated our approach through A/B testing with low‑risk segments, focusing on information hierarchy, clarity, and navigational confidence while ensuring users felt comfortable moving deeper into the site.
Materialize
Throughout delivery, we partnered closely across teams and reviewed engagement, bounce, and conversion data. Each iteration was informed by both quantitative metrics and qualitative insights, allowing us to refine the experience while staying aligned with business goals.
Example Deliverable: Offset Panel
One outcome of this work was the Offset Panel, a modular way-finding component composed of a text panel, buttons, icons, and links.
Each component submission included:
- Clear purpose and usage guidelines
- Interaction patterns and style variations
- Editorial considerations
- Accessibility support
- Detailed design specs and developer notes
The goal was to ensure consistent implementation and allow teams to make correct decisions without needing constant design review.
Outcome
We delivered a scalable component system anchored by a centralized library of reusable parts. This worked to:
- Reduced inconsistencies across upper‑funnel pages
- Improved cross‑team alignment
- Accelerated prototyping and delivery
- Strengthened brand cohesion during the rebrand
More importantly, it created a foundation of 11 new components that could evolve over time without needing to be rebuilt.
Why This Matters
This work wasn’t about visual refresh alone. It was about turning a brand refresh into durable infrastructure.
By stepping into ensuring flexibility, making clear tradeoffs, and designing for scale, I helped teams move faster without sacrificing consistency or quality. That’s how I contribute to innovation: by building systems that make future work easier.
