Redesigning Navigation to Help K-12 Teachers Find Content Faster

Redesigning Navigation to Help K-12 Teachers Find Content Faster

Redesigning Navigation to Help K-12 Teachers Find Content Faster

Redesign

Redesign

Product Design Lead

Product Design Lead

Object-Oriented UX (OOUX)

Object-Oriented UX (OOUX)

A classroom table with a laptop and phone displaying the redesigned assignment workflow

Overview

I inherited a navigation redesign that wasn't meeting teacher needs on National Geographic Learning's K-12 online platform

Through research and iterative testing, I realigned the platform's information architecture with how teachers actually work, creating a more intuitive content discovery experience

Full case study available upon request

ROLE

Lead User Experience Designer

RESPONSIBILITIES

End-to-end design

Cross-functional collaboration

TEAM

1 UX Designer, 1 UX Researcher, 1 Instructional Designer, 2 Product Managers

Key Results

90%

success at finding content

100%

success at finding resources

Key Results

90%

success at finding content

100%

success at finding resources

Approach

Benchmarking Analysis

Benchmarking revealed that teachers preferred student content first, contrary to earlier research, highlighting a clear opportunity to improve content discovery and better align teacher and student materials.

“

I need the teacher and student materials to be near each other and not require as many steps.

Science Teacher

“

I need the teacher and student materials to be near each other and not require as many steps.

Science Teacher

“

I need the teacher and student materials to be near each other and not require as many steps.

Science Teacher

Testing Content & Navigation

I partnered with an Instructional Designer & UX Researcher to build interactive prototypes to test 2 options for content structure & 2 options for navigation.

Mirroring the structure in the print book led to a 5% increase in teacher success at finding content.

A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block

Book structure had a 58% success rate for finding content

A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class
A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class
A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class

Learning purpose structure had a 53% success rate for finding content

Teachers were 27% more successful at finding content with a flatter navigation.

In the end, technical limitations and usability concerns led us to abandon this structure.

A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block

Flat navigation structure had an 85% success rate for finding content

A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class
A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class
A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class

Breadcrumb navigation structure had a 58% success rate for finding content

Testing Resource Findability

I designed a Resources button and side panel to bridge the teacher-student materials gap, but only 60% of teachers found it, indicating findability issues.

A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block

New Learning = New Perspectives

As part of my professional development, I completed a course in Object-Oriented UX (OOUX) fundamentals, which helped me see the platform and its content through a new lens.

THEME

Activity

KEY ATTRIBUTES

Name
Content
Type
Page Number
State/National Standards

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

Assigned to 0-M Students
Has 1-M Attempts
Has 0-M Resources

THEME

Activity

KEY ATTRIBUTES

Name
Content
Type
Page Number
State/National Standards

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

Assigned to 0-M Students
Has 1-M Attempts
Has 0-M Resources

THEME

Resource

KEY ATTRIBUTES

Name
Content
Type

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

Associated to 1-M Activities

THEME

Resource

KEY ATTRIBUTES

Name
Content
Type

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

Associated to 1-M Activities

THEME

User

KEY ATTRIBUTES

Name
Content
Type
Page Number
State/National Standards

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

Student Assigned 0-M Activities
Student Granted 1-M Attempts

THEME

User

KEY ATTRIBUTES

Name
Content
Type
Page Number
State/National Standards

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

Student Assigned 0-M Activities
Student Granted 1-M Attempts

DEPENDENT OBJECT

Attempt

KEY ATTRIBUTES

Name
Content
Type
Page Number
State/National Standards

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

None because it's a dependent object

DEPENDENT OBJECT

Attempt

KEY ATTRIBUTES

Name
Content
Type
Page Number
State/National Standards

KEY TEACHER ACTIONS

Assign
Review

KEY RELATIONSHIPS

None because it's a dependent object

Testing Navigation Structures

I built 2 prototypes to test different information architecture models: a filtered view, inspired by eCommerce, and a hierarchical tree view.

Teachers were 90% more successful at finding content with a hierarchical tree view.

A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block

Filtered View Model that might not have happened without OOUX

A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class
A paper sketch of the new design that has gradebok category on the left and on the right is the assignment details with a divider to show the interaction when a teacher selects in individual students and sees a list of all students in the class

Hierarchical Tree View Model

Confirming Usability with New Tools

When a new reading experience was introduced, I created a high-fidelity prototype to evaluate its usability alongside a revised Resources button placement, which resulted in 100% success and improved functionality without impacting usability

A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block
A paper sketch of the new design that has gradebook category on the left and on the right is a section with assignment details and an option to add another assignment detail block

Results

90%

success at finding content

100%

success at finding resources

90%

success at finding content

100%

success at finding resources

“

Oh so much better! It's all right there; I don't have to go searching around!

Special Education Teacher

“

Oh so much better! It's all right there; I don't have to go searching around!

Special Education Teacher

The final design successfully bridged the gap between teacher and student materials while maintaining the familiar textbook-based organization that educators rely on for curriculum planning

What I Learned

  • The OOUX framework provides a valuable way to rethink and clarify complex design problems

  • EdTech platforms aren't yet ready for eCommerce-style navigation patterns

Future Ideas

Had I stayed on the project, I would have:

  • Explored ways to streamline the multiple toolbars introduced by the new reading experience

  • Improved the alignment between the card that opens an activity and the activity itself, to reduce cognitive load and support smoother navigation

Create a free website with Framer, the website builder loved by startups, designers and agencies.