High Marks for a New ETS Online

SUMMARY

A full-scale effort to revamp the outdated digital experience of Educational Testing Service (ETS), the world’s largest private nonprofit for educational testing and assessment.

MY ROLE

Lead UX Designer


• UX Research
• Wireframing

• Prototyping
• Annotations

TASK AT HAND

To advance ETS’s global mission in education, a rapid technological upgrade was crucial, with a strong focus on creating a unified visual identity, showcasing their industry-leading services and capabilities, and streamlining the conversion path for test-takers. Leveraging a recent brand refresh, we worked closely with stakeholders to swiftly transform ets.org. Our strategy brought ETS’s brand to life online, fostering personalized relationships, building community, and seamlessly integrating eCommerce into the user experience.

Despite an ambitious timeline, we efficiently delivered a redesign that met ETS’s critical deadlines, ensuring the new digital presence aligned with their business objectives and maximized revenue opportunities.

What We Started With

Snapshot of previous design

Core Challenges + Solution Overview

We performed a comprehensive audit of the ETS website, including its crucial Test of English as a Foreign Language (TOEFL) component, to evaluate the digital ecosystem and enterprise architecture. This process identified strengths, weaknesses, and areas for growth, guiding our strategic improvements.

Below is a snapshot of the key solutions we implemented. The following sections provide detailed explanations, process insights, and visual examples, illustrating how our strategies transformed the ETS site into a more effective gateway for educational resources, significantly enhancing the user experience for test-takers, educators, and institutions.

🚨

Navigation lacks clear prioritization, focusing narrowly on tests while obscuring its full range of services and capabilities, resulting in a disjointed experience.

✅

The streamlined new navigation balances ETS’s core pillars: Products, Solutions, and Research, allowing users to register as well as effortlessly transition from landing pages to detailed content. About Us sections appear as secondary links and a search bar appears along the bottom of the full screen menu.

🚨

The site doesn’t highlight ETS’s core strengths, undervaluing the organization’s complex offerings.

✅

A dynamic reorganization of content and creation of unique flexible modules showcases the offerings of a complex business in a visually intuitive manner.

🚨

The current system lacks tailored design elements for ETS and TOEFL, diluting brand distinction and limiting engagement for each brand’s unique needs.

✅

Developed adaptable wireframes that seamlessly inform the unique visual identities of ETS and TOEFL, streamlining design and development processes.

Experience the Newly Launched ETS Site

Phases in Focus

Our comprehensive redesign of ets.org was guided by three key phases: Discovery, Define, and Design. Each phase played a critical role in transforming ETS’s digital presence, ensuring alignment with their strategic goals and the refreshed brand identity. Through close collaboration with key stakeholders and a focus on rapid implementation, we successfully delivered a seamless, user-centric experience that supports ETS’s mission and business objectives.

Design Phase

Given the tight timeline for launch, we operated within the framework of two design sprints. Collaborating closely with strategy and visual design, we iterated and refined the wireframes to meet CRD requirements, enabling the full build-out of our new design system. At the end of each sprint, I meticulously annotated each module and template in Confluence, providing detailed guidance and working with our internal development team to ensure successful site implementation.

Optimizing Site Navigation

Restructuring and coalescing global navigation to mitigate confusion and dead-ends is often the primary challenge in considering the UX of a new site experience. Through careful analysis of the existing navigation and site structure, we identified three critical challenges that needed resolution for optimal performance.

A snapshot of old nav

Challenge 1

The second level navigation competes with the primary navigation, causing confusion.

The navigation items change as a user clicks into the audience-centric pillars, which creates a disorienting user experience.

Solution 1

Create a persistent yet clear navigation that enables wayfinding while minimizing confusion

Challenge 2

Core business offerings are not prioritized in the navigation.

Many of the key ETS offerings are not immediately visible in the current structure. The site prioritizes the assessment products and, consequently, consulting services & research offerings get buried.

Solution 2

Elevate key offerings to the primary navigation so products, services, and research

Challenge 3

The navigation is geared towards decisive test takers, working well for users who know exactly what test or resource they need.

However, it falls short for new or exploratory users, including consultants.

Solution 3

Create balance by structuring the navigation for a wider variety of ETS users and their goals

Our recommendations included a revamped mega menu navigation system prominently featuring Product Assessments, ETS Services, the ETS Research Institute, and About ETS.

Navigation diagram

A mega menu enhances user experience by making navigation intuitive and efficient. By displaying many options in a single view, users can easily find what they’re looking for without excessive clicks. Our design groups related items under clear headings, reducing clutter and improving content hierarchy.

Mega menu wireframe proto

This new structure ensures balanced representation of ETS’s core pillars: Products, Solutions, and Research, streamlining navigation and allowing users to effortlessly transition from landing pages to detailed content. About Us sections appear as secondary links and a search bar appears along the bottom of the full screen menu.

Final mega menu GIF

Annotations setup example

Templates

Templates, guided by the initial Zone Diagrams developed by our strategy team, enabled us to outline the full spectrum of page instances, modules, and features for the new ETS experience.

ETS Homepage

The homepage effectively showcases ETS’s mission and strategic goals, providing visitors with a clear and engaging introduction to their offerings. It highlights key services and research areas, and fosters a deeper connection with users, guiding them towards relevant content and encouraging further exploration.

In particular, the ETS homepage provides users with:

  • Understanding the ETS brand and purpose

  • Navigation to the three key ETS pillars: Product Assessments, ETS Solutions, and the ETS Research Institute

  • A preview of the three research focus areas: Transforming Assessment & Measurement, Innovating Next Generation ETS Products, and Leading Global Educational Assessment Programs

  • A snapshot of ETS Solutions and primary products, enticing users to explore further

ETS Solutions Landing

Provides users with:

  • Understanding the ETS Solutions vision and value propositions

  • Quick access to the three core offerings: Advising, End-to-End Assessment, and Licensing

  • Introduction to the ETS team

  • Opportunities to explore related case studies and research

Narrative Landing Pages

Narrative landing pages effectively communicate ETS’s mission and values, guiding users through their core offerings with a compelling story. This approach not only clarifies complex information but also creates an emotional connection, enhancing user engagement and driving exploration.

ETS Research Landing

Provides users with:

  • Access to the three research focus area pages: Transforming Assessment & Measurement, Innovating Next Generation ETS Products, and Leading Global Educational Assessment Programs

  • Insight into the Research Institute’s impact

  • Introduction to the ETS team

  • Overview of ETS thought leadership and the researchers who comprise the Institute

TOEFL Landing Pages

This project, while primarily focused on ETS, also involved the TOEFL (Test of English as a Foreign Language) sub-brand. We concurrently developed templates and modules for both brands, each with distinct visual identities: the sophisticated and mature look of ETS, and the playful, youthful appearance of TOEFL. Although the template structures and UX were largely consistent, we implemented key functional adjustments to streamline development.

For instance, using a streamlined Sub Navigation Tab Module, we efficiently curated content for specific audiences, adjusting the content hierarchy to best serve the three primary TOEFL audience groups.

VISUAL DESIGN
WIREFRAMES

Modules

An effective module library streamlines and systemizes wireframing by clearly defining page requirements. It guides visual designers with precision, reflecting our strategic approach while allowing for design flexibility.

WIREFRAMES
VISUAL DESIGN

Annotations

Meticulous, well-organized, and timely annotations are qualities I take great pride in. For this ETS project, these attributes were essential, given the client’s goal to launch in time for a global conference. Working closely with the Development Lead and Accessibility Expert, we executed our tasks with precision and speed, ensuring a smooth and successful site launch.

Define Phase

We synthesized findings from audits, site assessments, and stakeholder interviews to craft customer journeys. By identifying the diverse journeys for each audience, from B2C to B2B, we uncovered user needs, barriers, and opportunities, allowing us to better serve them.

Together with Strategy we developed a Content Requirement Document (CRD), which informed our low-fidelity template and module designs. This secured client sign-off before advancing to the Design Phase.

USER JOURNEY MAPS

The CRD informs a modular design system

A modular design system provides a scalable yet structured experience that can flex to the needs of different pages. The CRD includes a library of pages, modules, and features that serves as the blueprint for what we build in design, starting with wireframes and ending with visual design and annotations for development.

THE APPROACH

Strategy Snapshot

We conducted a comprehensive audit of the ETS website, digital ecosystem, and enterprise architecture to identify strengths, weaknesses, and opportunities for improvement as we charted a path forward.

Under the ETS umbrella, many educational testing systems are in play (TOEFL®, TOEIC®, GRE®, Praxis®), but they are currently disconnected, making content navigation challenging.

  • The product-focused e-registration sites are disconnected from ets.org and each other. To register, users go into a separate experience in a new tab.

  • The site is product (test) focused and doesn’t showcase the complete set of ETS services, capabilities, and offerings.

  • While the top-level audience entry points are intuitive, the navigation changes as a user clicks into detail pages. There isn’t one consistent paradigm for content presentation.

  • Robust information on each user is collected to begin an account but is not leveraged toward a more personalized experience for the logged in/authenticated user.

  • Back-end core business (product) systems are currently siloed and disparate, holding back e-commerce and personalization ambitions.

  • A basic search experience allows the user to filter by test but doesn’t give them any other way to sort results. This isn’t leveraging best-in-class technology and could be an enhancement.

Discovery Phase

We conducted a comprehensive landscape assessment of customer experiences across businesses in the assessment, research, and consulting sectors. This evaluation, integral to our Define process, highlighted best-in-class examples for reference.

LANDSCAPE AUDITS

Key Takeaways

It was a privilege to work on this educational platform. ETS's commitment to enhancing the quality and equity of education for everyone, along with their belief in the transformative power of learning, truly resonated with me.

With a refreshed brand identity as our foundation, we swiftly revamped ets.org, creating a dynamic platform that fosters personalized connections and community, while seamlessly integrating eCommerce. Given the ambitious timeline, we moved with agility to deliver a redesign that not only aligned with ETS's business goals but also optimized revenue potential.

Credits

DESIGN

Addi Hou
Sanchi Oberoi

TEAM

Elise Sokolowski
Jess Volodarsky

TOOLS

Figma
Confluence
Airtable

Explore similar projects

B2C | LEAD UX DESIGNER

Digital Innovation Meets Trusted Coverage for Berkley Insurance

Starting with the foundation, our team revamped the digital experience and visual identity for Berkley, a Fortune 500 insurance company.

B2E | LEAD UX DESIGNER

Degree of Excellence for Northeastern’s CAMD Site

A substantial visual and digital experience overhaul for Northeastern University’s College of Arts, Media & Design.

B2B | LEAD UX DESIGNER

An Innovative New Avenue for Real Estate

A comprehensive initiative to transform the outdated digital experience of AvenueOne, a leading platform for real estate investment and management.