A Ted Kusio Case Study

CASE STUDY OVERVIEW

From Silos to Partnership

Building Technical Literacy and a Creative-Dev Partnership at Lumen

When I started at CenturyLink (CTL) in 2019, it had a pretty solid website already running. The home page served as a gateway to both the residential and enterprise business units, with the latter being my primary focus as Manager of Digital Design. These two business units were visually differentiated: bright, welcoming imagery for residential versus a darker, 'night time' aesthetic for enterprise. The site was built in Adobe Experience Manager (AEM), a comprehensive content management and digital asset management platform, and processes were in place to make edits and updates to the site.

THE CHALLENGE

The Silos Problem

There was no real relationship between the Creative team and the web Authors & AEM Developers.

Designers would create comps in Photoshop or XD and submit them into what felt like a "black box" where we hoped the web team would execute our creative vision, but there was no real dialogue or active collaboration.

Pain Points
  • Late-stage surprises: Technical limitations often discovered after pages went live
  • Slow revision cycles: Back-and-forth corrections took weeks instead of days
  • No shared language: Designers couldn't distinguish between a developer saying something was "hard" vs. "impossible"
  • Limited innovation: Designers self-censored creative ideas, assuming they wouldn't be technically feasible
  • Missing skills: While the AEM Developers were strong back-end developers, they lacked front-end experience, especially CSS
  • Pages published without design review: Authors would publish content without Creative team input
  • Copy or images breaking layouts: Authors would add content that didn't work with the design
  • Frustration on both sides: Developers felt designers didn't understand constraints; designers felt developers just said "no" to everything
What We Needed
Clearly this wasn't working. I saw we needed:
  • A collaborative culture where Creative and dev actively worked as partners
  • A design team that understood the capabilities and limitations of code well enough to design for what's realistic, and ask for what's possible
  • The technical capability within Creative to build prototypes and solve integration challenges
THE SOLUTION

Building Technical Foundation

Phase 1: Build the Collaborative Culture (2019-2022)

To work together, web development managers and team leaders and I had to get to know each other. Because we had no dedicated collaborative process, finding the right people was a challenge. I needed to understand the web team's structure and responsibilities for AEM Developers, Authors, and team leaders.

I started with meet-and-greets with web development managers and team leaders. These helped me to identify the knowledgeable and decision-making players. From here, I organized formal governance meetings and started a dedicated Teams channel with hands-on designers, developers, and Authors. I drove the purpose and attendee list for these meetings. When discussions veered into irrelevant topics, I kept us on track. When important voices were being overlooked—particularly women in design and UI/UX—I made sure they were heard, even when that meant navigating egos. Others helped give the meetings shape and eventually led some of them, but I maintained the strategic direction through continuous improvement iterations. Project Managers created status tracking; meeting invites were refined to ensure the right attendance; and AEM Developers and Authors added designers to their review processes.

Phase 2: Share the Code (2019-onward)

To help the Creative team understand the web better, I expanded web page design tasks to the whole team and created a continuous learning program that I personally delivered over six years. Topics evolved from foundational HTML/CSS and responsive design principles to advanced tools like Figma and animation frameworks—transforming a team with zero technical knowledge into designers who could prototype interactions and push back on "impossible" with working code.

Core topics included:

I also worked directly with AEM Developers when they dismissed requests as too difficult, even for relatively simple features. This required diplomacy because I was an outsider coming into their domain to say "do it this way instead." So in addition to humanity, patience and understanding, I approached them with actual working demos built in CodePen, which I also shared with Authors for context. I gave the dev team the tools to build smarter and more efficient solutions; I showed designers how to create more engaging layouts—but without my vision, persistence, and legwork, it wouldn't have happened.

Key CodePen Demos

Responsive Layout CodePen Demo

Responsive Layout

Showed how CSS "float" could make mobile content stack consistently so images matched their corresponding copy.

View Demo

CSS Gradients CodePen Demo

Code-based Gradients

Demonstrated CSS gradients instead of editing images directly, enabling quick directional changes and color swaps.

View Demo

CSS Notch CodePen Demo

Code-based Notch

Showed how CSS could create the signature Lumen "notch" design element without manually editing each image.

View Demo

Flexbox CodePen Demo

The Flexbox Breakthrough

We needed dynamic card layouts that automatically adjusted to the number of cards and browser width. I introduced them to flexbox with a CodePen demo that showed the exact behavior we needed.

View Demo

Impact:
  • Dev team could see the exact behavior we wanted
  • They understood it was feasible and had a starting point
  • We established a shared language and collaborative approach to solutions
  • Together we built a better, more beautiful and more efficient website
  • One developer literally said "You taught me flexbox."

Phase 3: Strategic Hiring (2022)

I identified that we needed designers who could bridge the creative and technical worlds. I intentionally hired two "unicorn" visual designers with coding experience and pursued interns with clear interactive interests and skills.

These hires transformed what our team could deliver. When we hit a major roadblock trying to integrate ION interactive content directly into our pages—and dev said it was impossible—I didn't accept that answer. I directed these two technical designers I'd hired specifically for challenges like this to investigate a solution. I assigned work based on their interests and skills, helped them overcome obstacles (both managerial priorities and technical roadblocks), and gave them time and air cover to experiment. When one of them cracked the code, I championed the solution with leadership and ensured dev implemented it. I celebrated their achievements to leadership and nominated them for awards with detailed explanations, because sometimes creative leadership didn't grasp what a big deal they'd solved.

One built the interactive solution finder currently on Lumen's homepage—the AEM Developers simply dropped his code into an AEM component and it runs perfectly. The other introduced Lottie animation formats and new interactive capabilities. These weren't just positions filled—they were force multipliers who elevated the entire team's technical capability.

What this unlocked:
  • More people on the creative team who could debug integration issues
  • Experienced designers who could push back on dev's "we can't do that" with working examples
  • Technical advocates within Creative who could translate for the rest of the team
RESULTS

Breakthrough Projects

ION Integration

The challenge: We wanted to integrate ION (third-party content experience platform—ioninteractive.com) directly into AEM pages, instead of always linking to stand-alone ION pages. The dev team said it couldn't be done—ION and our CMS weren't compatible.

The solution: When dev said ION integration was impossible, I didn't accept that answer. I directed the two technical designers I'd hired to investigate. After experimentation and testing, one cracked the code.

The impact:

Other Technical Achievements

Enabling Major Initiatives

The culture and technical capability I built unlocked features that were previously impossible. When leadership wanted sophisticated interactive elements like card carousels, I worked directly with both Creative and dev to design solutions, prototype interactions in CodePen, and guide implementation.

Lumen Rebrand (CenturyLink to Lumen):

Lumen 3.0 Redesign:

CenturyLink colors

CenturyLink
Mint Green
CenturyLink
Vibrant Blue
CenturyLink
Navy Blue

Lumen launch colors

Lumen
Light Blue
Lumen
Blue
Lumen
Medium Blue

Lumen 3.0 colors (recent rebrand)

Lumen
Orange
Deep
Orange
Dark
Teal

Site Personalization:

The collaborative foundation and technical literacy enabled sophisticated site personalization—impossible with the old "black box" approach. An example is the landing page for the Lumen Channel Partners program, featuring pages with custom content for potential new partners, or active or dormant partners.

This allowed us to invite visitors not part of the prohram with benefits, get partners who haven't logged in recently excited about the Partner Program again, and get active partners to the partal as quickly as possible.

A Transformed Team and Process

Quantifiable Improvements

Speed: Corrections went from weeks to days; designers could make minor updates without dev tickets; faster iteration meant better final designs

Capability: Complex technical integrations (like ION) became possible; team could prototype sophisticated interactions; reduced dependency on external agencies

Quality: Designs that actually worked on real devices; fewer "impossible to implement" surprises; better alignment between design vision and technical execution

Cultural Transformation

From:

  • Siloed teams with mistrust
  • Designers afraid to suggest innovative ideas
  • Developers saying "no" by default
  • Submission-based workflow

To:

  • Partnership and shared ownership
  • Designers empowered with technical knowledge
  • Collaborative problem-solving
  • Ongoing dialogue throughout projects
  • Personal relationships extending beyond work—developers were invited to join the creative team's Friday Dance Party, which I started to build team culture

Lasting Legacy

What We Built

By the time I led the team through the major rebrand initiatives, we had:

  • A team that could speak developer language
  • Direct, trusting relationships between Creative and dev
  • Technical capability to prototype and solve integration challenges
  • A process that other teams wanted to emulate

What It Enabled

The foundation I built enabled Lumen to:

  • Launch an e-commerce platform contributing to $18M revenue increase
  • Offer interactive guided-buying tools with location search and product selection
  • Successfully rebrand, and later redesign, the entire digital presence
  • Migrate to AEM Cloud without major disruptions
  • Pursue sophisticated personalization and dynamic content
  • Continue innovating with interactive web experiences
Retrospective

KEY TAKEAWAYS

What I Learned
  • Start hands-on: Leading by example (like the flexbox demo) was more powerful than mandating change
  • Hire strategically: The two designer/dev hybrids were force multipliers for the entire team
  • Build relationships, not just processes: Personal connections between designers and developers were as important as formal meetings
  • Technical literacy is a superpower: Designers who understand code don't just execute better—they innovate more boldly
  • Culture change takes time: The foundation of this transformation happened over 3+ years, constantly adjusting for best results
  • My own technical expertise (HTML/CSS/JS) gave me credibility with both sides
  • Support from leadership to invest in training and hiring
  • Extending the invitation to my partners on the dev team to meet, discuss, collaborate
  • Willingness to experiment and learn together
  • Focus on solving real problems (like the AEM migration) rather than abstract process improvement
What Made This Possible

Contact me