Year
2011
My Role
User Research, Interaction Design, Visual Design, Strategy
The AT&T Homepage redesign addressed critical usability challenges and business goals by streamlining navigation, improving task efficiency, and enhancing marketing opportunities. The user-centered solution reduced cart abandonment, decreased support calls, and increased engagement, creating a scalable platform for long-term success.
Challenge
The AT&T homepage struggled with poor navigation, difficult access to key tasks, and limited support visibility, frustrating users and increasing cart abandonment. It also lacked effective marketing opportunities and alignment with organizational goals, requiring a redesign to improve the user experience and drive business outcomes.
Solution
The redesigned AT&T homepage focused on improving usability, enhancing task efficiency, and aligning with business objectives. I created a user-centered navigation structure that prioritized key tasks such as account management, bill payment, and support access, making them easily discoverable.
Marketing opportunities were optimized with a prominent hero carousel and strategically placed promotional banners to highlight offers and services. By addressing user pain points and incorporating insights from cross-functional teams, the solution reduced friction, improved engagement, and provided a scalable framework to meet both user and business needs.
Approach
The redesign began with a comprehensive research phase, including competitive analysis of industry leaders such as Verizon, T-Mobile, and Comcast to identify best practices and opportunities for differentiation. I collaborated with internal teams—including Support, Sales, Marketing, and Brand—to gather insights into user pain points and business objectives.
To address usability challenges, I analyzed feedback from support teams, reviewed user complaints, and identified recurring issues, such as difficulty navigating the site, managing accounts, and paying bills. These findings informed the development of wireframes and prototypes that focused on simplifying navigation, prioritizing key user tasks, and creating space for impactful marketing content.
Throughout the process, I presented design concepts to stakeholders across the organization, often on calls with over 100 participants, explaining my decisions and aligning the solution with organizational goals. This collaborative approach ensured that the redesign addressed user needs while meeting business objectives.
Outcome
Increased Task Success: Simplified navigation improved user success rates for critical tasks like bill payment, account management, and support access.
Reduced Cart Abandonment: Streamlined checkout flows and clear CTAs helped decrease cart abandonment rates.
Decreased Support Calls: Enhanced self-service options reduced the need for users to contact support, improving efficiency for both users and the business.
Boosted Engagement: Redesigned marketing spaces, including a prominent hero carousel and banners, increased user interaction with promotions and services.
Improved Scalability: The design created a flexible framework that supported future business needs without requiring frequent updates.
Long-Term Effectiveness: The homepage remained effective and unchanged for three years, underscoring the design’s enduring value.
The att.com homepage is the primary gateway for current and potential customers averaging over 16 million unique visitors per month and is one of the top 100 most popular websites by traffic in the US.
The AT&T homepage served as a critical touchpoint for millions of users, yet its design struggled to meet both user needs and business objectives.
Navigation Challenges
The top navigation bar is crowded and lacks clear prioritization. Key services like "Residential," "Small Business," and "Enterprise" are competing for visibility, which can confuse users about where to start.
Site categories such as "Wireless," "Internet," and "Home Phone" appear in a secondary menu, but their placement and styling do not stand out enough to facilitate quick access.
Account Management and Support
While there is a "Manage / Support" section, its placement in a small banner at the bottom of the page makes it easy to overlook.
Users looking for critical tasks like paying bills or managing their account may not intuitively find these links, as they are visually subordinate to marketing content.
Task Completion Difficulties
Key actions such as paying bills or requesting support are buried under layers of navigation or poorly prioritized links, making them harder to access.
The lack of prominent, action-oriented CTAs (call-to-actions) for task-driven features increases user friction.
Marketing Opportunities
While the hero graphic carousel highlights a promotional offer, the visual hierarchy heavily favors this section at the expense of other valuable content.
The smaller banners below the hero image, though intended for additional promotions, are visually disconnected and do not effectively draw attention.
User Experience and Visual Design
The homepage relies on a highly visual hero image but lacks a balance between aesthetics and functionality.
Content below the fold (such as "Manage / Support") is not immediately visible, requiring users to scroll, which may lead to missed information.
The color scheme and typography choices create visual noise, making it harder for users to focus on key actions.
Research & Discovery
The research and discovery phase was critical to understanding user needs and aligning the redesign with AT&T’s business objectives.
Key activities included:
Stakeholder Interviews: Conducted discussions with the Marketing, Sales, Brand, and other organizational teams to understand their goals. Clarified priorities such as increasing engagement with promotions, improving task success rates, and reducing support call volume.
User Pain Point Analysis: Collaborated with the Support Team to analyze frequent user issues, including difficulties with navigation, account management, and bill payment. Leveraged support data and user complaints to prioritize features for the redesign.
Competitive Analysis: Studied industry leaders like Verizon, T-Mobile, and Comcast to identify best practices. Gained insights into effective navigation, task flows, and promotional strategies to inform the design.
This comprehensive research phase provided the foundation for a user-centered, business-aligned redesign that addressed user pain points while achieving AT&T’s strategic objectives.
Cross-Functional Collaboration
The AT&T homepage redesign was a highly collaborative effort that brought together teams from across the organization to ensure the final design addressed user needs and business priorities.
Key aspects of this collaboration included:
Partnership with the AT&T Brand Team: Ensured the visual design adhered to AT&T’s branding guidelines, creating a cohesive and trustworthy experience. Worked closely to align the homepage’s visual elements and messaging with the company’s broader identity.
Engagement with Marketing and Sales: Integrated promotional opportunities, such as the hero carousel and marketing banners, to highlight key offers and services. Aligned the homepage with business objectives to drive user engagement and conversions.
Input from the Support Team: Addressed recurring user pain points, including challenges with navigation, account management, and accessing support tools. Prioritized solutions that reduced user frustration and decreased support call volume.
Collaboration with Business Units: Partnered with teams from Wireless, Advanced TV, Home Phone, Residential, Small Business, and Enterprise to ensure the redesign met their specific goals. Facilitated feedback sessions to incorporate diverse organizational needs into the final design.
Stakeholder Engagement: Led large-scale presentations with over 100 participants, clearly articulating design decisions and incorporating feedback. Balanced competing priorities across departments to create a unified solution that served both users and the business.
This cross-functional approach ensured the redesign not only addressed user pain points but also aligned with the strategic goals of AT&T’s diverse teams, resulting in a homepage that delivered measurable improvements in usability and business performance.
Wireframing and Prototyping
The wireframing and prototyping phase was essential for translating research insights into actionable design solutions. Using data gathered from user pain points, stakeholder feedback, and competitive analysis, I developed wireframes that prioritized usability, task efficiency, and alignment with AT&T’s business goals.
Key features in the wireframes included:
Streamlined Navigation: Simplified menus to improve discoverability of key services, such as account management, bill payment, and support access.
Prominent Marketing Areas: Strategically positioned a hero carousel and promotional banners to highlight high-priority offers and drive engagement.
Task-Oriented Layout: Organized quick links for frequently accessed actions like “View or Pay My Bill” and “Check Order Status,” addressing common user needs.
Prototypes were created to test and validate these designs with stakeholders across the organization, including Marketing, Sales, Brand, and various business units. I facilitated feedback sessions to ensure the prototypes aligned with organizational objectives while remaining user-centered.
This iterative process allowed me to refine the designs based on input and ensure they were both functional and scalable. The wireframes and prototypes ultimately served as a blueprint for the final design, balancing user needs and business priorities in a cohesive and intuitive homepage layout.
Stakeholder Presentation and Feedback
Presenting the AT&T homepage redesign to stakeholders was a critical step in ensuring alignment across the organization. With over 100 participants representing diverse teams—including Marketing, Sales, Brand, Wireless, Advanced TV, Home Phone, Residential, Small Business, and Enterprise—these presentations served as an opportunity to explain design decisions, gather input, and foster collaboration.
During the presentations:
Articulated Design Decisions: Walked stakeholders through the rationale behind the layout, navigation structure, and feature prioritization, demonstrating how each element addressed user pain points and business objectives.
Facilitated Cross-Team Feedback: Encouraged input from all teams to ensure their unique goals were addressed in the redesign. This feedback was essential for refining elements such as the hero carousel, promotional banners, and task-focused sections.
Balanced Competing Priorities: Mediated discussions to reconcile differing needs across teams, ensuring the final design was cohesive and aligned with AT&T’s broader strategic goals.
Demonstrated Scalability: Highlighted how the design could accommodate future updates and campaigns, emphasizing its long-term value.
The stakeholder presentations and feedback sessions were instrumental in creating a homepage that addressed user needs while meeting the diverse priorities of AT&T’s internal organizations. This collaborative process ensured widespread buy-in and contributed to the overall success of the project.
Design Iteration and Testing
The design iteration and testing phase was crucial to refining the AT&T homepage redesign. Feedback from stakeholders, user insights, and organizational priorities informed multiple rounds of iteration to ensure the design effectively balanced usability and business objectives.
Key steps in this phase included:
Iterative Refinements: Incorporated feedback from stakeholder presentations, addressing specific requests from teams such as Marketing, Sales, Wireless, and Support. Adjusted design elements, such as navigation menus, promotional banners, and task-oriented sections, to better meet user needs and business goals.
Internal Testing: Collaborated with cross-functional teams to review prototypes and gather feedback on usability and visual design alignment. Ensured the design adhered to AT&T’s brand guidelines and maintained a cohesive look and feel across all touchpoints.
Scalability Validation: Tested how the layout would accommodate future updates, campaigns, and additional content without disrupting the user experience.
Stakeholder Reviews: Conducted follow-up sessions with key teams to present updates and validate changes, ensuring alignment with their objectives.
Although formal user testing was planned after my departure, the iterative process ensured the final design was thoroughly reviewed, well-aligned with AT&T’s strategic goals, and equipped to address key user pain points. This phase ensured the homepage was not only functional and user-friendly but also scalable for future needs.
Implementation and Handoff
The implementation phase of the AT&T homepage redesign was a streamlined process, thanks to close collaboration with developer Derek Owca. After completing the final design, I worked closely with Derek to ensure that all specifications were clearly communicated, including layout details, interactions, and responsive design requirements.
Key highlights of this phase included:
Detailed Handoff Documentation: Provided comprehensive documentation, including annotated wireframes and prototypes, to ensure a seamless development process. Included design specifications for spacing, typography, and functionality to minimize ambiguity.
Collaborative Development: Maintained open communication with Derek throughout the implementation to address any questions and ensure alignment with the design vision. Conducted periodic reviews during development to validate progress and confirm accuracy.
Error-Free Delivery: Derek delivered the redesigned homepage flawlessly on the first attempt, reflecting the clarity of the design handoff and our effective collaboration.
This efficient implementation process ensured the redesigned AT&T homepage was launched without delays or issues, providing users with a seamless, improved experience from day one.
Key Challenges and Solutions
The AT&T homepage redesign presented several challenges, requiring strategic problem-solving and collaboration to overcome.
Key challenges included:
Balancing Diverse Stakeholder Needs: With input from teams across Marketing, Sales, Brand, Wireless, Advanced TV, Home Phone, Residential, Small Business, and Enterprise, each organization had unique goals and priorities for the homepage.
Solution: Facilitated presentations and discussions to gather feedback and reconcile competing priorities, ensuring the design addressed critical needs while maintaining a cohesive vision.Addressing Usability and Business Objectives: The existing homepage struggled with usability issues, such as poor navigation and task inefficiency, while also failing to fully capitalize on marketing opportunities. Solution: Conducted extensive research and competitive analysis to prioritize user pain points and align the redesign with AT&T’s strategic goals, creating a task-oriented, business-aligned layout.
Ensuring Scalability and Longevity: The homepage needed to support future updates and campaigns without requiring frequent redesigns. Solution: Designed a flexible framework that could accommodate evolving business needs while maintaining a seamless user experience.
Coordinating with a Large Audience: Presenting to over 100 stakeholders during design reviews posed challenges in gathering consensus and managing feedback. Solution: Structured presentations to clearly articulate design decisions and addressed concerns in follow-up sessions, ensuring buy-in from all key teams.
By proactively addressing these challenges, the project successfully delivered a user-centered, business-aligned homepage that improved usability, met organizational goals, and provided a scalable platform for the future.
This wireframe was strategically structured to address user pain points, prioritize critical tasks, and create opportunities for marketing engagement. The design is grounded in user research and stakeholder collaboration to ensure alignment with both customer needs and business objectives.
Key features include:
Hero Image with CTA
The central hero image features a high-priority promotion, such as device offers or service upgrades, with a clear call-to-action button ("Add a Line") to drive conversions.
Streamlined Navigation
A simplified top navigation bar provides quick access to key service categories: Wireless, Digital TV, Internet & DSL, Home Phone, and Bundles.
Secondary links for personal, small business, and enterprise users are clearly segmented to reduce confusion.
Account Management
The "Manage My Account" section is prominently placed to enable quick access to login functionality, account management, and password recovery.
Support Access
A dedicated "Support" section ensures users can easily find help, reducing reliance on customer service calls.
Marketing Opportunities
Below the hero image, smaller promotional sections and CTAs allow multiple offers to be displayed simultaneously, improving visibility and engagement for additional campaigns.
Footer Links
Organized into clear categories (Common Links, At Home, Services, Support, and Company), the footer simplifies navigation to frequently accessed pages, ensuring no critical functionality is overlooked.
Newsletter Signup
A persistent newsletter bar encourages users to stay connected with AT&T, providing updates and deals.
This wireframe was created to provide a clean, functional layout that addresses previous usability challenges while balancing the needs of multiple stakeholders. It focuses on reducing user friction, enhancing task success rates, and driving engagement with marketing initiatives, all within a scalable framework that supports future updates.
The final AT&T homepage redesign refined the user experience and created a visually engaging interface that aligned with AT&T’s strategic goals. By addressing user pain points and incorporating feedback from cross-functional teams, the design enhanced usability, promoted engagement, and reflected AT&T’s brand identity.
A key focus was balancing functional priorities with marketing opportunities. The hero carousel and promotional banners were designed in close collaboration with the Brand Team to highlight flagship offers while maintaining a clear, task-oriented layout. This ensured that promotions complemented, rather than competed with, user actions.
The layout emphasized accessibility for diverse user groups, including Residential, Small Business, and Enterprise customers. By creating tailored navigation paths, the design allowed users to quickly locate relevant services and resources. Additionally, streamlined pathways to support tools and account management features addressed common frustrations from the previous design.
The final homepage provided a cohesive experience that served AT&T’s wide-ranging audience while supporting the company’s marketing and operational objectives. It also offered scalability, ensuring the homepage could evolve with future business needs without requiring a complete redesign.
The redesigned AT&T homepage delivered significant improvements in usability, user engagement, and business performance.
Key outcomes included:
Improved Task Completion: Users experienced faster and more efficient access to critical features like account management, bill payment, and support resources, leading to higher task success rates.
Reduced Cart Abandonment: Streamlined navigation and clear calls-to-action helped lower cart abandonment rates, improving sales conversions.
Enhanced Marketing Engagement: The hero carousel and promotional banners successfully drove interaction with offers, resulting in increased engagement with key services and promotions.
Decreased Support Calls: By addressing user pain points and prioritizing self-service features, the redesign reduced the volume of customer service calls.
Brand Alignment: The close collaboration with the AT&T Brand Team ensured the homepage adhered to AT&T’s identity, creating a consistent and trustworthy user experience.
Scalability: The flexible design framework allowed the homepage to remain effective and unchanged for three years, supporting AT&T’s evolving business needs without major updates.
The project not only met its goals of improving usability and aligning with business objectives but also reinforced AT&T’s position as a leader in the digital space by delivering a user-centered, scalable solution.
