Enhanced DDoS Portal Redesign

Turning Delays Into Design Wins

I stepped in as interim design lead on a stalled redesign, four months behind schedule, mentoring a contract designer on accessible Material UI standards, restructuring the IA, and realigning flows to real user workflows during a 5-week coverage gap. The redesign later launched with strong results: task completion improved 25%, and support tickets dropped 30%.

Client

AT&T Cybersecurity

Role

Lead Designer

Team

2 Contract Designers, Product Managers, Engineering & Stakeholders

Timeframe

5 Weeks

Skills

Interface Design, Design Component Library, Figma, Mockups, Accessibility Compliance, Cross-Functional Collaboration, Communication, Attention to Detail, Empathy

Due to NDA contractual agreements, detailed work is available on request.

DDoS portal screens
DDoS portal screens

Context & Problem

When a DDoS (Distributed Denial of Service) attack happens, customers need immediate understanding. Instead, AT&T’s DDoS customers were juggling three separate portals to interpret their traffic, alerts, mitigations, analytics, protected zones, reports, admin tools, and documentation. Each portal looked and behaved differently, which added friction during already high-pressure moments.

Our MSS operations team confirmed the impact: about 70% of support calls were tied to portal confusion.

Challenges & Constraints

puzzle piece

The squad had reached a standstill. The contract designer still needed more info and guidance on the brand and product system design.

There were a lot of challenges and constraints:

  • Short timeline

  • Highly technical content

  • No access to current products

  • Lean research

  • Lean user testing

  • New design library without much documentation

  • Constrained confined deliverables

Lots of ambiguity!

Project Duties

My role was interim design lead for the contract designers. I also helped establish some initial designs and templates.

  1. Onboard the team 

Get the few contract designers up to speed on our design library, branding guidelines, product requirements, and platform patterns.

  1. Guide design reviews

Lead design reviews so the work reflected what both users and the product required. Also check accessibility contrasts while I was there.

  1. Stakeholder meetings

Clarify design goals and help the team meet deadlines.

section of mui component library

Sections of mui component library

Preliminary Research & Findings

Sketchnote depicting 3 separate portals with an arrow merging into one unified portal with 6 sections

Three separate portals to unify everything into one cohesive experience

PowerPoint screen shot Instructions for a proposed portal landing page for Non-Reactive customers

Instructions from PM for a portal landing page for Non-Reactive customers

Instructions sample given to us for a proposed portal landing page for Non-Reactive customers

Working under a tight timeline, we conducted guerrilla UX research to quickly surface the core issues. The DDoS experience lived across three disconnected portals with inconsistent navigation and patterns. Users described it as fragmented and unintuitive. They bounced between tools to find basic information, lacked a reliable starting point, and struggled to interpret key data. Support teams saw the same problems through recurring questions.

Users needed one stable, predictable portal they could rely on. The goal became clear: unify everything into a cohesive experience.

What Failed and What Was Chosen

Wireframe of Portal home. Early round with Mitigation updates across the top. The Traffic Analytics and Alerts split equally across the most of the page underneath.

Early round of a Wireframe of Portal home which gives equal weight to the Traffic Analytics and Alerts, while Mitigation updates scroll across the top.

Wireframe of Portal home. Later round with Traffic Analytics taking up about 2/3 of the page while Mitigation updates and Alerts split equally across the right 1/3 rail of the page. Easier to scan, less busy.

Wireframe of portal home which presented the information clearer. It was found easier to scan.

Instructions sample given to us for a proposed portal landing page for Non-Reactive customers

Key Decision: After testing, this layout presented the summary of information better, was easier to scan.

Outcomes & Impact

Within a month, the redesigned experience took shape. We reduced cognitive load through a clearer IA, made the content within tabs more concise, and reorganized navigation to remove unnecessary searching. Improved tables, meaningful badges and icons, and improved visual hierarchy. We kept the design consistent, accessible and reduced confusion.

I led design on the portal landing page, traffic, alerts, and mitigations pages before handing off back to my team. The DDoS portal redesign team carried the work forward, completing the protected zones, traffic analytics, reports, admin tools, and documentation sections.

Section of home page

A peek at the home / landing page

Usability testing confirmed the improvement

25%

30%

Users completed task flows faster

Support tickets tied to portal confusion

Usability testing confirmed the improvement. Users completed task flows 25% faster. Support tickets tied to portal confusion declined by 30%. Customers found the visuals more trustworthy and aligned with the broader platform, and product leaders highlighted the strengthened consistency and usability.

Top left area in data table - Customer names and color dots
Right edge of Active Mitigations table showing sparkline chart
start mitigation, stop mitigation section of data table

Reflection & Growth

Despite the challenges and constraints, I relied on cross-functional collaboration and clear communication to keep the project moving during a critical gap, helping set it back on schedule during a critical staffing gap, before returning to my core team. A new contract UX designer later continued the work through launch.

With more time, I would have explored different chart generators like D3. I would have also liked to explore providing specialized dashboards to multiple archetypes.

chart

Award

I was awarded “Support of DDoS UX and Going Above and Beyond” for collaboration and accessible design excellence.

Due to NDA contractual agreements, detailed work is available on request.